优化PC核心工作流视觉 Wave2（05-27-pc-core-workflow-visual-wave2）
这个提交包含在：
+173
-19
@@ -49,6 +49,69 @@
|
||||
@apply space-y-5;
|
||||
}
|
||||
|
||||
.auth-shell {
|
||||
background:
|
||||
radial-gradient(circle at 20% 12%, rgba(0, 57, 138, 0.10), transparent 26rem),
|
||||
radial-gradient(circle at 78% 78%, rgba(19, 168, 184, 0.10), transparent 24rem),
|
||||
linear-gradient(180deg, #f9fbfd 0%, #eff4f8 58%, #e6edf3 100%);
|
||||
}
|
||||
|
||||
.auth-shell__grid {
|
||||
opacity: 0.68;
|
||||
background-image:
|
||||
linear-gradient(rgba(15, 23, 42, 0.052) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(15, 23, 42, 0.052) 1px, transparent 1px);
|
||||
background-size: 40px 40px;
|
||||
mask-image: linear-gradient(180deg, black, transparent 88%);
|
||||
}
|
||||
|
||||
.auth-shell__rail {
|
||||
background: linear-gradient(180deg, transparent, rgba(0, 57, 138, 0.34), rgba(19, 168, 184, 0.28), transparent);
|
||||
}
|
||||
|
||||
.auth-panel {
|
||||
border: 1px solid rgba(203, 213, 225, 0.92);
|
||||
border-radius: var(--radius-lg);
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96)),
|
||||
#ffffff;
|
||||
box-shadow: 0 24px 70px rgba(15, 23, 42, 0.12), 0 1px 0 rgba(255, 255, 255, 0.82) inset;
|
||||
}
|
||||
|
||||
.auth-panel__accent {
|
||||
position: absolute;
|
||||
inset: 0 auto 0 0;
|
||||
width: 4px;
|
||||
background: linear-gradient(180deg, var(--color-accent-primary), var(--color-accent-secondary));
|
||||
}
|
||||
|
||||
.auth-mode-switch {
|
||||
border: 1px solid rgba(203, 213, 225, 0.88);
|
||||
background: rgba(241, 245, 249, 0.74);
|
||||
@apply grid grid-cols-2 gap-1 rounded-lg p-1;
|
||||
}
|
||||
|
||||
.auth-mode-switch__item {
|
||||
@apply h-9 rounded-md text-sm font-medium transition;
|
||||
}
|
||||
|
||||
.auth-mode-switch__item--active {
|
||||
color: var(--color-accent-primary);
|
||||
background: #ffffff;
|
||||
box-shadow: var(--shadow-xs);
|
||||
}
|
||||
|
||||
.auth-mode-switch__item--idle {
|
||||
color: var(--color-text-secondary);
|
||||
@apply hover:text-slate-950;
|
||||
}
|
||||
|
||||
.auth-side-entry {
|
||||
border: 1px solid rgba(203, 213, 225, 0.88);
|
||||
background: rgba(248, 250, 252, 0.82);
|
||||
@apply rounded-lg px-3.5 py-3 text-sm leading-6;
|
||||
}
|
||||
|
||||
.workbench-hero {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
@@ -59,6 +122,97 @@
|
||||
@apply flex flex-col gap-4 px-5 py-5 md:flex-row md:items-end md:justify-between md:px-6;
|
||||
}
|
||||
|
||||
.ops-status-strip {
|
||||
@apply grid gap-3;
|
||||
}
|
||||
|
||||
.ops-status-strip .metric-card {
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow-xs);
|
||||
@apply px-3.5 py-3.5;
|
||||
}
|
||||
|
||||
.ops-status-strip .metric-card::before {
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.ops-status-strip .metric-card__title {
|
||||
@apply text-xs font-semibold;
|
||||
}
|
||||
|
||||
.ops-status-strip .metric-card__value {
|
||||
@apply mt-1 text-lg;
|
||||
}
|
||||
|
||||
.ops-status-strip .metric-card__note {
|
||||
@apply mt-1 text-xs leading-5;
|
||||
}
|
||||
|
||||
.ops-command-bar {
|
||||
border-color: rgba(203, 213, 225, 0.92);
|
||||
border-radius: var(--radius-lg);
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
box-shadow: var(--shadow-xs);
|
||||
@apply p-3 md:p-3.5;
|
||||
}
|
||||
|
||||
.ops-command-bar__row {
|
||||
@apply flex flex-col gap-3 xl:flex-row xl:items-center xl:justify-between;
|
||||
}
|
||||
|
||||
.ops-command-bar__tabs {
|
||||
@apply flex w-full flex-wrap justify-start gap-1 rounded-lg border border-slate-200 bg-slate-50 p-1 xl:w-auto;
|
||||
}
|
||||
|
||||
.ops-command-bar__actions {
|
||||
@apply flex w-full flex-wrap items-center gap-2 xl:w-auto xl:justify-end;
|
||||
}
|
||||
|
||||
.ops-filter-label {
|
||||
color: var(--color-text-secondary);
|
||||
@apply text-xs font-semibold;
|
||||
}
|
||||
|
||||
.ops-inline-alert {
|
||||
border-radius: var(--radius-lg);
|
||||
@apply border px-3.5 py-2.5 text-sm leading-6;
|
||||
}
|
||||
|
||||
.ops-table-focus {
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow-xs);
|
||||
}
|
||||
|
||||
.ops-table-focus table {
|
||||
min-width: 760px;
|
||||
}
|
||||
|
||||
.ops-table-focus thead,
|
||||
.ops-table-focus .table-header {
|
||||
background: rgba(248, 250, 252, 0.96);
|
||||
}
|
||||
|
||||
.ops-table-focus th,
|
||||
.ops-table-focus .table-th {
|
||||
color: var(--color-text-tertiary);
|
||||
@apply px-4 py-3 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;
|
||||
}
|
||||
|
||||
.ops-table-focus tbody tr:hover {
|
||||
background: rgba(248, 250, 252, 0.92);
|
||||
}
|
||||
|
||||
.ops-table-focus .table-td-strong {
|
||||
color: var(--color-text-primary);
|
||||
@apply font-semibold;
|
||||
}
|
||||
|
||||
.workbench-hero::after {
|
||||
display: none;
|
||||
}
|
||||
@@ -312,9 +466,9 @@
|
||||
.portal-list-card {
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
border: 1px solid rgba(226, 232, 240, 0.94);
|
||||
border-radius: var(--radius-lg);
|
||||
border-radius: var(--radius-sm);
|
||||
box-shadow: var(--shadow-xs);
|
||||
@apply block px-3.5 py-3.5 transition duration-150;
|
||||
@apply block px-3.5 py-3 transition duration-150;
|
||||
}
|
||||
|
||||
.portal-list-card:hover {
|
||||
@@ -328,21 +482,21 @@
|
||||
}
|
||||
|
||||
.portal-list-card--compact {
|
||||
border-radius: var(--radius-lg);
|
||||
@apply px-3.5 py-3.5;
|
||||
border-radius: var(--radius-sm);
|
||||
@apply px-3.5 py-3;
|
||||
}
|
||||
|
||||
.portal-action-stack {
|
||||
@apply grid gap-3 sm:grid-cols-2 xl:grid-cols-1;
|
||||
@apply grid gap-2 sm:grid-cols-2 xl:grid-cols-1;
|
||||
}
|
||||
|
||||
.portal-action-tile {
|
||||
min-height: 100%;
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
border: 1px solid rgba(226, 232, 240, 0.94);
|
||||
border-radius: var(--radius-lg);
|
||||
border-radius: var(--radius-sm);
|
||||
box-shadow: var(--shadow-xs);
|
||||
@apply px-3.5 py-3.5 text-left transition duration-150;
|
||||
@apply px-3 py-3 text-left transition duration-150;
|
||||
}
|
||||
|
||||
.portal-action-tile:hover {
|
||||
@@ -358,13 +512,13 @@
|
||||
}
|
||||
|
||||
.portal-action-tile--compact {
|
||||
@apply px-3.5 py-3.5;
|
||||
@apply px-3 py-3;
|
||||
}
|
||||
|
||||
.portal-action-icon {
|
||||
background: rgba(0, 57, 138, 0.08);
|
||||
color: var(--color-accent-primary);
|
||||
@apply flex size-10 items-center justify-center rounded-xl;
|
||||
@apply flex size-9 items-center justify-center rounded-lg;
|
||||
}
|
||||
|
||||
.portal-action-icon--muted {
|
||||
@@ -375,19 +529,19 @@
|
||||
.portal-status-card {
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
border: 1px solid rgba(226, 232, 240, 0.94);
|
||||
border-radius: var(--radius-panel);
|
||||
@apply px-4 py-4;
|
||||
border-radius: var(--radius-sm);
|
||||
@apply px-3.5 py-3;
|
||||
}
|
||||
|
||||
.portal-team-list {
|
||||
border: 1px solid rgba(226, 232, 240, 0.94);
|
||||
background: rgba(255, 255, 255, 0.64);
|
||||
@apply overflow-hidden rounded-2xl divide-y divide-slate-200/80;
|
||||
@apply overflow-hidden rounded-lg divide-y divide-slate-200/80;
|
||||
}
|
||||
|
||||
.portal-team-row {
|
||||
background: rgba(255, 255, 255, 0.84);
|
||||
@apply flex min-h-[64px] items-center gap-3 px-4 py-3;
|
||||
@apply flex min-h-[56px] items-center gap-3 px-3.5 py-2.5;
|
||||
}
|
||||
|
||||
.portal-panel-footer {
|
||||
@@ -396,15 +550,15 @@
|
||||
}
|
||||
|
||||
.portal-insight-tabs__list {
|
||||
@apply h-10 rounded-full border-slate-200 bg-slate-50 p-1;
|
||||
@apply h-9 rounded-lg border-slate-200 bg-slate-50 p-1;
|
||||
}
|
||||
|
||||
.portal-insight-tabs__content {
|
||||
@apply mt-4;
|
||||
@apply mt-3;
|
||||
}
|
||||
|
||||
.portal-secondary-drawer {
|
||||
@apply p-4 md:p-5;
|
||||
@apply p-3.5 md:p-4;
|
||||
}
|
||||
|
||||
.portal-secondary-summary {
|
||||
@@ -417,15 +571,15 @@
|
||||
}
|
||||
|
||||
.portal-secondary-drawer__body {
|
||||
@apply mt-4 space-y-5;
|
||||
@apply mt-4 space-y-4;
|
||||
}
|
||||
|
||||
.portal-secondary-compact-grid {
|
||||
@apply grid gap-4 xl:grid-cols-2;
|
||||
@apply grid gap-3 xl:grid-cols-2;
|
||||
}
|
||||
|
||||
.portal-compact-group {
|
||||
@apply rounded-xl border border-slate-200 bg-white/80 px-3.5 py-3.5;
|
||||
@apply rounded-lg border border-slate-200 bg-white/80 px-3.5 py-3;
|
||||
}
|
||||
|
||||
.portal-compact-group__title {
|
||||
|
||||
在新工单中引用
屏蔽一个用户