style: Material Design - 操作按钮添加悬停背景

2026-02-27 10:52:17 +08:00
parent d47c0ad6a8
commit bdc5463b6d
1 changed files with 11 additions and 3 deletions
--- a/ruoyi-ui/src/views/ccdiProject/components/ProjectTable.vue
+++ b/ruoyi-ui/src/views/ccdiProject/components/ProjectTable.vue
@@ -345,19 +345,27 @@ export default {
  font-weight: bold;
 }

-// 操作按钮样式
+// 操作按钮样式 - Material Design 风格
 :deep(.el-button--text) {
  color: #1890ff;
-  padding: 0 8px;
+  padding: 8px 12px;
+  border-radius: 4px;
+  transition: all 0.2s ease;

  &:hover {
    color: #096dd9;
-    text-decoration: underline;
+    background-color: rgba(24, 144, 255, 0.08);
+    text-decoration: none;
  }

  &:first-child {
    padding-left: 0;
  }
+
+  // 按钮间距
+  & + .el-button--text {
+    margin-left: 4px;
+  }
 }

 // 分页样式优化