seahi/blogflare
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 优化分析面板的边框样式与背景阴影效果

Browse Source
This commit is contained in:
seahi committed 2026-09-27 21:28:00 +08:00
1 parent a8671e4cb3
commit a83acc1427
1 file changed
+13 -11
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/admin/AnalyticsPanel.svelte
+13 -11
View File
@@ -667,8 +667,9 @@
display: grid; display: grid;
grid-template-columns: 7fr 3fr; /* 增加图表宽度，缩小右侧网格 */ grid-template-columns: 7fr 3fr; /* 增加图表宽度，缩小右侧网格 */
gap: 0; gap: 0;
border: 2px solid var(--text-color, #000); border: 1px solid var(--text-color, #000);
background: transparent; background: var(--bg-color, #ffffff);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
} }
@media (max-width: 900px) { @media (max-width: 900px) {
@@ -693,13 +694,13 @@
.core-metrics { .core-metrics {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
border-left: 2px solid var(--text-color, #000); border-left: 1px solid var(--text-color, #000);
} }
@media (max-width: 900px) { @media (max-width: 900px) {
.core-metrics { .core-metrics {
border-left: none; border-left: none;
border-top: 2px solid var(--text-color, #000); border-top: 1px solid var(--text-color, #000);
} }
} }
@@ -717,12 +718,12 @@
/* 为 2x2 网格绘制内部边框 */ /* 为 2x2 网格绘制内部边框 */
.metric-item:nth-child(1), .metric-item:nth-child(1),
.metric-item:nth-child(2) { .metric-item:nth-child(2) {
border-bottom: 2px solid var(--text-color, #000); border-bottom: 1px solid var(--text-color, #000);
} }
.metric-item:nth-child(1), .metric-item:nth-child(1),
.metric-item:nth-child(3) { .metric-item:nth-child(3) {
border-right: 2px solid var(--text-color, #000); border-right: 1px solid var(--text-color, #000);
} }
@media (max-width: 600px) { @media (max-width: 600px) {
@@ -736,7 +737,7 @@
.metric-item:nth-child(1), .metric-item:nth-child(1),
.metric-item:nth-child(2), .metric-item:nth-child(2),
.metric-item:nth-child(3) { .metric-item:nth-child(3) {
border-bottom: 2px solid var(--text-color, #000); border-bottom: 1px solid var(--text-color, #000);
} }
} }
@@ -775,15 +776,16 @@
} }
.quota-container { .quota-container {
border: 2px solid var(--text-color, #000); border: 1px solid var(--text-color, #000);
background: transparent; background: var(--bg-color, #ffffff);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
display: grid; display: grid;
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
} }
.quota-item { .quota-item {
padding: 24px 20px; padding: 24px 20px;
border-right: 2px solid var(--text-color, #000); border-right: 1px solid var(--text-color, #000);
} }
.quota-item:last-child { .quota-item:last-child {
border-right: none; border-right: none;
@@ -795,7 +797,7 @@
} }
.quota-item { .quota-item {
border-right: none; border-right: none;
border-bottom: 2px solid var(--text-color, #000); border-bottom: 1px solid var(--text-color, #000);
} }
.quota-item:last-child { .quota-item:last-child {
border-bottom: none; border-bottom: none;