fix(): refine table row height

easyops-cn · Jan 23, 2025 · 0343fc8 · 0343fc8
1 parent 888ffeb
commit 0343fc8
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 3 deletions.
diff --git a/bricks/advanced/docs/eo-next-table.md b/bricks/advanced/docs/eo-next-table.md
@@ -48,6 +48,7 @@
               - brick: eo-button
                 properties:
                   type: link
+                  size: small
                   icon:
                     lib: antd
                     icon: edit
@@ -59,6 +60,7 @@
               - brick: eo-button
                 properties:
                   type: link
+                  size: small
                   danger: true
                   icon:
                     lib: antd
@@ -693,6 +695,7 @@ children:
 - brick: eo-next-table
   properties:
     pagination: false
+    bordered: true
     columns:
       - dataIndex: name
         key: name

diff --git a/bricks/advanced/src/next-table/host-context.css b/bricks/advanced/src/next-table/host-context.css
@@ -1,22 +1,30 @@
 :root {
   --eo-table-head-cell-padding: 14px 12px;
+  --eo-table-head-cell-height: 51px;
   --eo-table-body-cell-padding: 11px 12px;
+  --eo-table-body-cell-height: 45px;
 }
 
 html[data-ui="v8-2"] {
   --eo-table-head-cell-padding: 9px 12px;
+  --eo-table-head-cell-height: 41px;
 
   eo-next-table[size="large"] {
-    --eo-table-body-cell-padding: 11px 12px;
+    --eo-table-body-cell-padding: 9px 12px;
+    --eo-table-body-cell-height: 45px;
   }
 
   eo-next-table[size="middle"] {
     --eo-table-head-cell-padding: 7px 12px;
-    --eo-table-body-cell-padding: 8px 12px;
+    --eo-table-head-cell-height: 37px;
+    --eo-table-body-cell-padding: 6px 12px;
+    --eo-table-body-cell-height: 39px;
   }
 
   eo-next-table[size="small"] {
     --eo-table-head-cell-padding: 3px 12px;
-    --eo-table-body-cell-padding: 4px 12px;
+    --eo-table-head-cell-height: 29px;
+    --eo-table-body-cell-padding: 1px 12px;
+    --eo-table-body-cell-height: 31px;
   }
 }
diff --git a/bricks/advanced/src/next-table/styles.shadow.css b/bricks/advanced/src/next-table/styles.shadow.css
@@ -58,6 +58,7 @@
   > th,
 .next-table.ant-table-wrapper .ant-table .ant-table-container tfoot > tr > th {
   padding: var(--eo-table-head-cell-padding);
+  height: var(--eo-table-head-cell-height);
 }
 
 .next-table.ant-table-wrapper .ant-table .ant-table-container .ant-table-cell,
@@ -69,6 +70,7 @@
   > td,
 .next-table.ant-table-wrapper .ant-table .ant-table-container tfoot > tr > td {
   padding: var(--eo-table-body-cell-padding);
+  height: var(--eo-table-body-cell-height);
 }
 
 .ant-table-wrapper
@@ -159,6 +161,15 @@
   right: 11px;
 }
 
+.next-table.ant-table-wrapper
+  .ant-table-ping-left
+  .ant-table-cell-fix-left-first::after,
+.next-table.ant-table-wrapper
+  .ant-table-ping-left
+  .ant-table-cell-fix-left-last::after {
+  box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, 0.15);
+}
+
 .next-table.ant-table-wrapper
   .ant-table-ping-right
   .ant-table-cell-fix-right-first::after,
@@ -168,6 +179,18 @@
   box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.15);
 }
 
+.next-table.ant-table-wrapper
+  .ant-table-ping-left:not(.ant-table-has-fix-left)
+  .ant-table-container::before {
+  box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, 0.15);
+}
+
+.next-table.ant-table-wrapper
+  .ant-table-ping-right:not(.ant-table-has-fix-right)
+  .ant-table-container::after {
+  box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.15);
+}
+
 .next-table.ant-table-wrapper .ant-table-column-sorters {
   justify-content: initial;
 }