统一PC前端布局密度(05-28-pc-frontend-layout-unification)

这个提交包含在:
2026-05-28 00:58:29 +08:00
父节点 f926905c57
当前提交 2229449e66
共修改 18 个文件,包含 308 行新增和 83 行删除
+38 -25
查看文件
@@ -46,7 +46,7 @@
.page-scaffold {
animation: page-reveal 320ms ease-out both;
@apply space-y-5;
@apply space-y-4 md:space-y-5;
}
.auth-shell {
@@ -119,7 +119,7 @@
border: 1px solid rgba(226, 232, 240, 0.92);
border-radius: var(--radius-panel);
box-shadow: var(--shadow-xs);
@apply flex flex-col gap-4 px-5 py-5 md:flex-row md:items-end md:justify-between md:px-6;
@apply flex flex-col gap-4 px-4 py-4 md:flex-row md:items-end md:justify-between md:px-5 md:py-4;
}
.ops-status-strip {
@@ -129,7 +129,7 @@
.ops-status-strip .metric-card {
border-radius: var(--radius-lg);
box-shadow: var(--shadow-xs);
@apply px-3.5 py-3.5;
@apply min-h-[92px] px-3.5 py-3;
}
.ops-status-strip .metric-card::before {
@@ -153,7 +153,7 @@
border-radius: var(--radius-lg);
background: rgba(255, 255, 255, 0.94);
box-shadow: var(--shadow-xs);
@apply p-3 md:p-3.5;
@apply p-3;
}
.ops-command-bar__row {
@@ -168,6 +168,11 @@
@apply flex w-full flex-wrap items-center gap-2 xl:w-auto xl:justify-end;
}
.ops-command-bar__actions > .select-sm,
.ops-command-bar__actions > .select-std {
min-width: 9rem;
}
.ops-filter-label {
color: var(--color-text-secondary);
@apply text-xs font-semibold;
@@ -181,6 +186,8 @@
.ops-table-focus {
border-radius: var(--radius-lg);
box-shadow: var(--shadow-xs);
border: 1px solid rgba(226, 232, 240, 0.94);
background: rgba(255, 255, 255, 0.98);
}
.ops-table-focus table {
@@ -195,13 +202,13 @@
.ops-table-focus th,
.ops-table-focus .table-th {
color: var(--color-text-tertiary);
@apply px-4 py-3 text-xs font-semibold;
@apply px-3.5 py-2.5 text-xs font-semibold;
}
.ops-table-focus td,
.ops-table-focus .table-td,
.ops-table-focus .table-td-strong {
@apply px-4 py-3 text-sm;
@apply px-3.5 py-2.5 text-sm;
}
.ops-table-focus tbody tr:hover {
@@ -238,7 +245,7 @@
}
.workbench-hero--compact {
@apply gap-4 px-5 py-5 md:px-6 md:py-6;
@apply gap-4 px-4 py-4 md:px-5 md:py-5;
}
.workbench-hero--compact .workbench-hero__title {
@@ -275,7 +282,7 @@
.section-panel {
position: relative;
overflow: hidden;
@apply p-4 md:p-5;
@apply p-3.5 md:p-4;
}
.section-panel::before {
@@ -311,7 +318,7 @@
border: 1px solid rgba(226, 232, 240, 0.96);
border-radius: var(--radius-panel);
box-shadow: var(--shadow-xs);
@apply block px-4 py-4 transition duration-150 hover:border-slate-300 hover:bg-white;
@apply block px-3.5 py-3.5 transition duration-150 hover:border-slate-300 hover:bg-white;
}
.metric-card::before {
@@ -348,12 +355,12 @@
.metric-card__value {
color: var(--color-text-primary);
@apply mt-2 text-xl font-semibold tracking-tight;
@apply mt-1.5 text-xl font-semibold tracking-tight;
}
.metric-card__note {
color: var(--color-text-secondary);
@apply mt-2 text-sm leading-6;
@apply mt-1.5 text-sm leading-6;
}
.info-chip {
@@ -393,7 +400,7 @@
.table-container {
border-color: rgba(226, 232, 240, 0.92);
background: var(--color-bg-surface-raised);
@apply overflow-hidden rounded-2xl border shadow-sm backdrop-blur;
@apply overflow-hidden rounded-lg border shadow-sm backdrop-blur;
}
.table-header {
@@ -537,7 +544,7 @@
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.88));
border-radius: var(--radius-lg);
box-shadow: var(--shadow-xs);
@apply border p-4;
@apply min-h-[92px] border p-3.5;
}
.finance-metric-card__label {
@@ -547,7 +554,7 @@
.finance-metric-card__value {
color: var(--color-text-primary);
@apply mt-2 text-2xl font-bold;
@apply mt-1.5 text-xl font-semibold;
}
.finance-workspace-grid {
@@ -559,7 +566,7 @@
background: rgba(255, 255, 255, 0.97);
border-radius: var(--radius-lg);
box-shadow: var(--shadow-xs);
@apply border p-4 md:p-5;
@apply border p-3.5 md:p-4;
}
.finance-list-card {
@@ -580,11 +587,11 @@
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.9));
border-radius: var(--radius-lg);
box-shadow: var(--shadow-xs);
@apply border p-4 md:p-5;
@apply border p-3.5 md:p-4;
}
.admin-tile-grid {
@apply grid gap-4 md:grid-cols-2 xl:grid-cols-3;
@apply grid gap-3 md:grid-cols-2 xl:grid-cols-4;
}
.admin-tile-card {
@@ -592,7 +599,13 @@
background: rgba(255, 255, 255, 0.96);
border-radius: var(--radius-lg);
box-shadow: var(--shadow-xs);
@apply border p-4 transition-colors hover:border-slate-300 hover:bg-slate-50/60 md:p-5;
@apply border p-3.5 transition-colors hover:border-slate-300 hover:bg-slate-50/60 md:p-4;
}
.admin-tile-card__icon {
background: rgba(0, 57, 138, 0.08);
color: var(--color-accent-primary);
@apply flex size-9 shrink-0 items-center justify-center rounded-lg;
}
.admin-workspace-grid {
@@ -622,11 +635,11 @@
}
.portal-home-grid {
@apply grid gap-5 xl:grid-cols-[minmax(0,2fr),minmax(320px,0.92fr)] xl:items-stretch;
@apply grid gap-4 xl:grid-cols-[minmax(0,1.72fr),minmax(300px,0.86fr)] xl:items-stretch;
}
.portal-home-grid--collaboration {
@apply xl:grid-cols-[minmax(0,1.55fr),minmax(320px,0.9fr)];
@apply xl:grid-cols-[minmax(0,1.42fr),minmax(300px,0.92fr)];
}
.portal-panel-fill {
@@ -638,7 +651,7 @@
border: 1px solid rgba(226, 232, 240, 0.94);
border-radius: var(--radius-sm);
box-shadow: var(--shadow-xs);
@apply block px-3.5 py-3 transition duration-150;
@apply block px-3 py-2.5 transition duration-150;
}
.portal-list-card:hover {
@@ -666,7 +679,7 @@
border: 1px solid rgba(226, 232, 240, 0.94);
border-radius: var(--radius-sm);
box-shadow: var(--shadow-xs);
@apply px-3 py-3 text-left transition duration-150;
@apply px-3 py-2.5 text-left transition duration-150;
}
.portal-action-tile:hover {
@@ -700,7 +713,7 @@
background: rgba(255, 255, 255, 0.92);
border: 1px solid rgba(226, 232, 240, 0.94);
border-radius: var(--radius-sm);
@apply px-3.5 py-3;
@apply px-3 py-2.5;
}
.portal-team-list {
@@ -728,7 +741,7 @@
}
.portal-secondary-drawer {
@apply p-3.5 md:p-4;
@apply p-3 md:p-3.5;
}
.portal-secondary-summary {
@@ -749,7 +762,7 @@
}
.portal-compact-group {
@apply rounded-lg border border-slate-200 bg-white/80 px-3.5 py-3;
@apply rounded-lg border border-slate-200 bg-white/80 px-3 py-2.5;
}
.portal-compact-group__title {