fix(admin-ui): align grid cards top (remove card+card margin in grids)
This commit is contained in:
@@ -482,6 +482,15 @@
|
||||
align-items:stretch; /* 关键:保证同一行 KPI 卡片等高 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 重要:admin-base.css 有全局规则 `.card + .card{margin-top:20px;}` 用于“纵向堆叠卡片”。
|
||||
* 但在 grid(KPI / two-col 等)里会导致“第二张卡片整体下沉”,出现你看到的“站点在中间、其它在底部”的错位。
|
||||
* 因此:在 KPI grid 场景显式清零 margin-top。
|
||||
*/
|
||||
.kpi-grid .card{
|
||||
margin-top:0;
|
||||
}
|
||||
|
||||
/* KPI 卡片:统一为竖向 flex,保证标题/数值/脚注布局稳定且等高 */
|
||||
.kpi-grid .card{
|
||||
display:flex;
|
||||
@@ -492,6 +501,11 @@
|
||||
margin-top:auto; /* 把脚注推到底部,进一步锁定等高视觉 */
|
||||
}
|
||||
|
||||
/* Dashboard 两列卡片:同样清理“纵向堆叠 margin-top”对 grid 的干扰,确保“趋势/排行/工作台/定位/最近订单/占比”顶边对齐 */
|
||||
.two-col .card{
|
||||
margin-top:0;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px){
|
||||
.kpi-grid{
|
||||
grid-template-columns:repeat(2,minmax(0,1fr));
|
||||
|
||||
Reference in New Issue
Block a user