feat(web): design tokens, Tailwind config, base components (TEC-3057)

- Add chart palette, motion, and z-index CSS vars to globals.css
- Replace custom theme-provider with next-themes (dark default)
- Extend tailwind.config.ts with heading fonts, spacing (row-compact,
  row-roomy, sidebar), chart colors, elevation shadows, glow shadows,
  transition timing, pill border-radius, z-index scale
- Update tick-flash animations to match design token spec (480ms)
- Add prefers-reduced-motion support for all animations
- Create base design-system components:
  Surface, SurfaceElevated, Divider, DensityProvider/useDensity,
  Numeric (VND/percent/compact formatting), Signal (up/down/neutral pill)
- Add dev-only /dev/tokens showcase route (404 in production)
- Update theme-provider tests to match next-themes integration

Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
Ho Ngoc Hai
2026-04-21 03:19:40 +07:00
parent e1beda2573
commit 7d6fcb4d8d
13 changed files with 665 additions and 138 deletions

View File

@@ -23,6 +23,7 @@
"mapbox-gl": "^3.21.0",
"next": "^15.5.14",
"next-intl": "^4.9.0",
"next-themes": "^0.4.6",
"react": "^18.3.0",
"react-dom": "^18.3.0",
"react-hook-form": "^7.72.1",