feat(frontend): skeleton loading states, empty-state glow, light-mode polish
- Add shared skeleton building blocks (SkeletonHero, SkeletonMetricRow, SkeletonPanel, SkeletonRows) and wire them into every view's initial loading branch, replacing bare spinners for a cohesive shimmering shell. - Polish EmptyState with a glow-ring icon chip instead of a flat icon. - Harden .light theme: color-scheme, tuned scrollbar + selection for pale canvas. Dark/light theme toggle (next-themes) already persisted in TopBar.
This commit is contained in:
@@ -53,6 +53,7 @@
|
||||
|
||||
/* ── Light theme overrides ── */
|
||||
.light {
|
||||
color-scheme: light;
|
||||
--color-canvas: oklch(0.96 0.012 80);
|
||||
--color-canvas-2: oklch(0.92 0.014 80);
|
||||
--color-surface: oklch(1 0 0 / 0.7);
|
||||
@@ -65,6 +66,18 @@
|
||||
--color-hairline: oklch(0.22 0.02 70 / 0.12);
|
||||
}
|
||||
|
||||
/* Light-theme scrollbar + selection tuned for pale canvas */
|
||||
.light ::-webkit-scrollbar-thumb {
|
||||
background: oklch(0.22 0.02 70 / 0.2);
|
||||
}
|
||||
.light ::-webkit-scrollbar-thumb:hover {
|
||||
background: oklch(0.22 0.02 70 / 0.34);
|
||||
}
|
||||
.light ::selection {
|
||||
background: var(--color-signal-glow);
|
||||
color: var(--color-ink);
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-transparent;
|
||||
|
||||
Reference in New Issue
Block a user