feat: add full @property declarations and fix theme system

- Add @property declarations for all 28 animatable color tokens ensuring
  smooth 500ms transitions between light/dark modes
- Remove invalid @theme block from inside @media (prefers-color-scheme: dark)
  that was causing Tailwind v4 to use dark values as defaults
- Add FOUC-prevention inline script in entry-server.tsx that applies
  theme class before first paint
- Integrate useTheme() hook in app.tsx for meta theme-color updates
  and system preference change listener
This commit is contained in:
2026-05-25 13:14:30 -04:00
parent aa69c0ecc4
commit ee31b88612
3 changed files with 155 additions and 24 deletions

View File

@@ -2,9 +2,11 @@ import { MetaProvider, Title } from "@solidjs/meta";
import { Router } from "@solidjs/router";
import { FileRoutes } from "@solidjs/start/router";
import { Suspense } from "solid-js";
import { useTheme } from "./lib/theme";
import "./app.css";
export default function App() {
useTheme();
return (
<Router
root={props => (