fix: design system v4 polish — home icon, mobile hamburger, contrast, font-label cleanup

- Home sidebar icon: always cyan, bg-accent-dim only when route is "/"
- Mobile TopBar: add left padding so hamburger isn't hidden behind logo
- Landing page: bump card border color (#1e2130 → #2a2f3d) for better contrast
- Replace all font-label references (40 occurrences, 19 files) with font-mono or font-sans
- Remove deprecated --font-label CSS variable from index.css
- Convert hardcoded hex in layout inline styles to CSS variables (light-mode ready)
- Add @types/react-syntax-highlighter for script builder types

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-22 19:19:44 +00:00
parent 83a27b4d9a
commit 2bcd3e2f3c
26 changed files with 84 additions and 76 deletions

View File

@@ -87,7 +87,7 @@ export function NavItem({ href, icon: Icon, label, badge, iconColor, matchPaths,
badge === 'dot' ? (
<span className="ml-auto h-1.5 w-1.5 shrink-0 rounded-full bg-brand-gradient-from" />
) : (
<span className="ml-auto shrink-0 rounded-full bg-card border border-border px-2 text-[0.6875rem] font-label text-muted-foreground">
<span className="ml-auto shrink-0 rounded-full bg-card border border-border px-2 text-[0.6875rem] font-mono text-muted-foreground">
{badge}
</span>
)
@@ -117,7 +117,7 @@ export function NavItem({ href, icon: Icon, label, badge, iconColor, matchPaths,
>
<span className="truncate">{child.label}</span>
{child.count !== undefined && (
<span className="ml-auto shrink-0 rounded-full bg-card border border-border px-2 text-[0.6875rem] font-label text-muted-foreground">
<span className="ml-auto shrink-0 rounded-full bg-card border border-border px-2 text-[0.6875rem] font-mono text-muted-foreground">
{child.count}
</span>
)}