1.1 KiB
1.1 KiB
Tailwind CSS + daisyUI
Version and integration
- Tailwind CSS 4 via the
@tailwindcss/viteplugin. Configuration is CSS-first. - Global theming and daisyUI plugin setup live in
src/app.css— read it for the current theme names and page background setup. It is the source of truth for theme configuration. tailwind.config.tsonly defines content globs. Do not add JS theme tokens there; use CSS-first@themeinsrc/app.cssinstead.
Style rules
- Prefer Tailwind utilities and daisyUI component classes (e.g.
btn,card,badge) and their theme colors over hand-written CSS. - Avoid arbitrary values (
[ ... ]) when a core utility exists. - Add new design tokens via
@themeinsrc/app.css, not intailwind.config.ts. - Put page/component styling in
src/routes/**components with utilities; keep global styles insrc/app.css. - Static assets referenced by URL (e.g.
/background.jpg) live instatic/.
Verification
- After styling changes, run
pnpm check(Svelte typecheck) andpnpm build. - Class ordering is handled by
prettier-plugin-tailwindcss— runpnpm formatrather than reordering classes by hand.