diff --git a/frontend/index.html b/frontend/index.html index 0cc61d9..eef5cd9 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -8,9 +8,5 @@
- diff --git a/frontend/src/style.css b/frontend/src/style.css index e792c77..6b291f5 100644 --- a/frontend/src/style.css +++ b/frontend/src/style.css @@ -1,6 +1,60 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; +@import "tailwindcss"; + +@plugin 'flowbite/plugin'; + +@source "../node_modules/flowbite-svelte/dist"; + +@theme { + --color-primary-50: #FFF5F2; + --color-primary-100: #FFF1EE; + --color-primary-200: #FFE4DE; + --color-primary-300: #FFD5CC; + --color-primary-400: #FFBCAD; + --color-primary-500: #FE795D; + --color-primary-600: #EF562F; + --color-primary-700: #EB4F27; + --color-primary-800: #CC4522; + --color-primary-900: #A5371B; +} + +@utility container { + width: 100%; + margin-inline: auto; + padding-inline: 1rem; + + @media (width >= theme(--breakpoint-sm)) { + max-width: theme(--breakpoint-sm); + padding-inline: 2rem; + } + + @media (width >= theme(--breakpoint-md)) { + max-width: theme(--breakpoint-md); + } + + @media (width >= theme(--breakpoint-lg)) { + max-width: theme(--breakpoint-lg); + padding-inline: 4rem; + } + + @media (width >= theme(--breakpoint-xl)) { + max-width: theme(--breakpoint-xl); + padding-inline: 5rem; + } + + @media (width >= theme(--breakpoint-2xl)) { + max-width: theme(--breakpoint-2xl); + padding-inline: 6rem; + } +} + +@layer base { + /* Tailwind v4 removed the v3 preflight rule that gave buttons a + pointer cursor. Restore it (disabled buttons keep the default). */ + button:not(:disabled), + [role="button"]:not(:disabled) { + cursor: pointer; + } +} html { background-color: rgba(27, 38, 54, 1); diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 19ce10d..0f5d79e 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -1,5 +1,6 @@ import {defineConfig} from 'vite' import {svelte} from '@sveltejs/vite-plugin-svelte' +import tailwindcss from '@tailwindcss/vite' import wails from '@wailsio/runtime/plugins/vite' // https://vitejs.dev/config/ @@ -9,5 +10,5 @@ export default defineConfig({ port: Number(process.env.WAILS_VITE_PORT) || 5173, strictPort: true, }, - plugins: [svelte(), wails('./bindings')] + plugins: [tailwindcss(), svelte(), wails('./bindings')] })