|
10 | 10 | border-spacing: 0; |
11 | 11 | width: 100%; |
12 | 12 | margin: 2rem 0; |
13 | | - background: hsl(var(--background)); |
14 | | - border: 1px solid hsl(var(--border) / 0.5); |
15 | | - border-radius: 12px; |
| 13 | + background: hsl(var(--card)); |
| 14 | + border: 1px solid hsl(var(--border)); |
| 15 | + border-radius: 8px; |
16 | 16 | overflow: hidden; |
17 | | - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); |
18 | 17 | } |
19 | 18 |
|
20 | 19 | /* 暗色模式下的表格容器 */ |
21 | 20 | :global(.dark) .notionEditor table { |
22 | | - background: hsl(var(--background) / 0.5); |
23 | | - border: 1px solid hsl(var(--border) / 0.3); |
24 | | - box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); |
| 21 | + background: hsl(var(--card)); |
| 22 | + border: 1px solid hsl(var(--border)); |
25 | 23 | } |
26 | 24 |
|
27 | 25 | .notionEditor table th, |
28 | 26 | .notionEditor table td { |
29 | | - padding: 14px 20px; |
| 27 | + padding: 12px 16px; |
30 | 28 | text-align: left; |
31 | 29 | vertical-align: middle; |
32 | | - border-right: 1px solid hsl(var(--border) / 0.3); |
33 | | - border-bottom: 1px solid hsl(var(--border) / 0.3); |
| 30 | + border-right: 1px solid hsl(var(--border)); |
| 31 | + border-bottom: 1px solid hsl(var(--border)); |
34 | 32 | transition: background-color 0.2s ease; |
35 | 33 | } |
36 | 34 |
|
|
45 | 43 | border-bottom: none; |
46 | 44 | } |
47 | 45 |
|
48 | | -/* 表头样式 */ |
| 46 | +/* 表头样式 - 使用系统颜色 */ |
49 | 47 | .notionEditor table th { |
50 | | - background: linear-gradient(to bottom, |
51 | | - hsl(var(--muted) / 0.3), |
52 | | - hsl(var(--muted) / 0.2)); |
| 48 | + background: hsl(var(--muted)); |
53 | 49 | font-weight: 600; |
54 | 50 | font-size: 0.875rem; |
55 | 51 | text-transform: uppercase; |
56 | | - letter-spacing: 0.05em; |
57 | | - color: hsl(var(--foreground) / 0.9); |
58 | | - border-bottom: 2px solid hsl(var(--border) / 0.5); |
| 52 | + letter-spacing: 0.02em; |
| 53 | + color: hsl(var(--muted-foreground)); |
| 54 | + border-bottom: 1px solid hsl(var(--border)); |
59 | 55 | } |
60 | 56 |
|
61 | 57 | /* 暗色模式下的表头 */ |
62 | 58 | :global(.dark) .notionEditor table th { |
63 | | - background: linear-gradient(to bottom, |
64 | | - hsl(var(--muted) / 0.5), |
65 | | - hsl(var(--muted) / 0.4)); |
66 | | - color: hsl(var(--foreground) / 0.95); |
67 | | - border-bottom: 2px solid hsl(var(--primary) / 0.3); |
| 59 | + background: hsl(var(--muted)); |
| 60 | + color: hsl(var(--muted-foreground)); |
| 61 | + border-bottom: 1px solid hsl(var(--border)); |
68 | 62 | } |
69 | 63 |
|
70 | 64 | /* 表格内容单元格 */ |
71 | 65 | .notionEditor table td { |
72 | 66 | background-color: transparent; |
73 | 67 | font-size: 0.95rem; |
74 | 68 | line-height: 1.6; |
| 69 | + color: hsl(var(--foreground)); |
75 | 70 | } |
76 | 71 |
|
77 | | -/* 斑马纹效果 - 更柔和 */ |
78 | | -.notionEditor table tbody tr:nth-child(even) { |
79 | | - background-color: hsl(var(--muted) / 0.08); |
80 | | -} |
81 | | - |
82 | | -/* 暗色模式斑马纹 */ |
83 | | -:global(.dark) .notionEditor table tbody tr:nth-child(even) { |
84 | | - background-color: hsl(var(--muted) / 0.15); |
85 | | -} |
86 | | - |
87 | | -/* 悬停效果 */ |
| 72 | +/* 悬停效果 - 使用系统颜色 */ |
88 | 73 | .notionEditor table tbody tr { |
89 | 74 | transition: background-color 0.15s ease; |
90 | 75 | } |
91 | 76 |
|
92 | 77 | .notionEditor table tbody tr:hover { |
93 | | - background-color: hsl(var(--primary) / 0.05); |
| 78 | + background-color: hsl(var(--accent)); |
94 | 79 | } |
95 | 80 |
|
96 | 81 | :global(.dark) .notionEditor table tbody tr:hover { |
97 | | - background-color: hsl(var(--primary) / 0.08); |
| 82 | + background-color: hsl(var(--accent)); |
98 | 83 | } |
99 | 84 |
|
100 | 85 | /* 第一列特殊样式(如果需要) */ |
|
0 commit comments