2569718930@qq.com
2b1d7c0b65
The dashboard had several oversized orchestration, component, and CSS files that made product-copy changes and mobile/performance work risky. This refactor preserves behavior while splitting scan terminal CSS, opportunity helpers, future forecast panels, history/detail charts, and probability/model sections into smaller ownership boundaries. Constraint: No user-visible version bump because this batch is architecture and performance cleanup, not a release announcement. Rejected: Rewrite dashboard state management in the same batch | too broad for a safe upload after CSS and component splitting. Confidence: high Scope-risk: moderate Reversibility: clean Directive: Keep new component/CSS boundaries instead of moving product copy back into the large dashboard files. Tested: npm run build; npm run test:business; git diff --check Not-tested: Browser visual smoke test after push
123 lines
3.5 KiB
CSS
123 lines
3.5 KiB
CSS
/* ──────────────────────────────────────────────────────────
|
|
PolyWeather Map — Premium Dark Theme
|
|
────────────────────────────────────────────────────────── */
|
|
|
|
.root {
|
|
/* ── Palette (bridged from globals.css unified tokens) ── */
|
|
--bg-primary: #0B1220;
|
|
--bg-secondary: #16213A;
|
|
--bg-card: #111A2E;
|
|
--bg-glass: rgba(17, 26, 46, 0.82);
|
|
--border-glass: rgba(159, 178, 199, 0.16);
|
|
--border-subtle: rgba(159, 178, 199, 0.08);
|
|
|
|
/* Text */
|
|
--text-primary: var(--color-text-primary);
|
|
--text-secondary: var(--color-text-secondary);
|
|
--text-muted: var(--color-text-muted);
|
|
|
|
/* Accents — Fintech 3-Color Model */
|
|
--accent-cyan: #4DA3FF;
|
|
--accent-blue: #4DA3FF;
|
|
--accent-green: #22C55E;
|
|
--accent-orange: #F59E0B;
|
|
--accent-red: #EF4444;
|
|
--accent-yellow: #F59E0B;
|
|
--accent-purple: #4DA3FF;
|
|
|
|
/* Risk colors */
|
|
--risk-high: var(--color-risk-high);
|
|
--risk-medium: var(--color-risk-medium);
|
|
--risk-low: var(--color-risk-low);
|
|
|
|
/* Spacing — aligned with global layout tokens */
|
|
--panel-width: 560px;
|
|
--header-height: 72px;
|
|
--sidebar-width: 240px;
|
|
|
|
/* Effects — using global elevation tokens */
|
|
--glass-blur: 20px;
|
|
--shadow-lg: var(--shadow-elevation-3);
|
|
--shadow-glow-cyan: var(--shadow-glow-accent);
|
|
--shadow-glow-blue: var(--shadow-glow-secondary);
|
|
--transition: all var(--transition-base);
|
|
}
|
|
|
|
/* ── Reset & Base ── */
|
|
.root :global(*),
|
|
.root :global(*::before),
|
|
.root :global(*::after) {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.root {
|
|
font-family:
|
|
"Inter",
|
|
-apple-system,
|
|
BlinkMacSystemFont,
|
|
sans-serif;
|
|
background: var(--bg-primary);
|
|
color: var(--text-primary);
|
|
overflow: hidden;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
background-image:
|
|
radial-gradient(
|
|
circle at 18% 18%,
|
|
rgba(77, 163, 255, 0.09),
|
|
transparent 24%
|
|
),
|
|
radial-gradient(
|
|
circle at 82% 12%,
|
|
rgba(111, 183, 255, 0.05),
|
|
transparent 20%
|
|
),
|
|
linear-gradient(180deg, #0B1220 0%, #07101D 100%);
|
|
}
|
|
|
|
:global(html.light) .root {
|
|
--bg-primary: #F7F9FC;
|
|
--bg-secondary: #EEF2F7;
|
|
--bg-card: #ffffff;
|
|
--bg-glass: rgba(255, 255, 255, 0.88);
|
|
--border-glass: #E2E8F0;
|
|
--border-subtle: rgba(226, 232, 240, 0.74);
|
|
--text-primary: #0F172A;
|
|
--text-secondary: #475569;
|
|
--text-muted: #64748B;
|
|
background: #F7F9FC;
|
|
color: #0F172A;
|
|
background-image:
|
|
radial-gradient(
|
|
circle at 18% 18%,
|
|
rgba(59, 130, 246, 0.1),
|
|
transparent 25%
|
|
),
|
|
radial-gradient(
|
|
circle at 82% 12%,
|
|
rgba(22, 163, 74, 0.07),
|
|
transparent 22%
|
|
),
|
|
linear-gradient(180deg, #F7F9FC 0%, #EEF2F7 100%);
|
|
}
|
|
|
|
:global(html.light) .root :global(.header),
|
|
:global(html.light) .root :global(.city-list),
|
|
:global(html.light) .root :global(.home-intelligence-panel.full),
|
|
:global(html.light) .root :global(.home-opportunity-strip),
|
|
:global(html.light) .root :global(.home-summary-card),
|
|
:global(html.light) .root :global(.opportunity-card),
|
|
:global(html.light) .root :global(.home-deb-card),
|
|
:global(html.light) .root :global(.home-card-section) {
|
|
background: rgba(255, 255, 255, 0.86);
|
|
color: #0b1726;
|
|
border-color: rgba(48, 77, 112, 0.18);
|
|
}
|
|
|
|
:global(html.light) .root :global(.map) {
|
|
background: #dbeafe;
|
|
filter: saturate(0.95) brightness(1.12);
|
|
}
|