feat(ui): wire tailwind v4 and daisyui theme into nuxt

Tailwind v4 integrates as a Vite plugin and configures daisyui via the CSS @plugin directive; the light theme is selected with data-theme on <html>. Heading font sizes are re-asserted because Tailwind's preflight resets them, which would otherwise shrink the hand-crafted headings.
2026-05-27 23:46:12 +02:00
parent e2e6b95e7c
commit 762d912243
2 changed files with 36 additions and 1 deletions
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,11 +1,19 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
+import tailwindcss from '@tailwindcss/vite'
+
 export default defineNuxtConfig({
  compatibilityDate: '2025-07-15',
  devtools: { enabled: true },
  modules: ['@nuxt/eslint', '@nuxt/test-utils/module'],
  css: ['~/assets/css/main.css'],
+  // Tailwind v4 integrates as a Vite plugin (no @nuxtjs/tailwindcss module).
+  vite: {
+    plugins: [tailwindcss()],
+  },
  app: {
    head: {
+      // DaisyUI theme is selected via data-theme on the root element.
+      htmlAttrs: { 'data-theme': 'light' },
      link: [
        { rel: 'preconnect', href: 'https://api.fonts.coollabs.io' },
        {