Laravel 11 + Livewire 3/Volt + Alpine.js + Tailwind app for household budget planning, transaction tracking, and financial dashboards. - Multi-tenant households with member invites - Plan: monthly/yearly budget per category with overrides - Suivi: transaction log with running balance (desktop + mobile quick-entry) - Dashboard: budget vs tracked breakdown + Chart.js donuts - Flux: Sankey diagram of income allocation - WCAG 2.1 AA color tokens, dark mode, accessible tables/forms - 50 Pest tests Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
58 lines
2.4 KiB
JavaScript
58 lines
2.4 KiB
JavaScript
import defaultTheme from 'tailwindcss/defaultTheme';
|
|
import forms from '@tailwindcss/forms';
|
|
|
|
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
darkMode: 'class',
|
|
content: [
|
|
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
|
|
'./storage/framework/views/*.php',
|
|
'./resources/views/**/*.blade.php',
|
|
],
|
|
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
sans: ['Figtree', ...defaultTheme.fontFamily.sans],
|
|
},
|
|
colors: {
|
|
surface: 'rgb(var(--color-surface) / <alpha-value>)',
|
|
'surface-alt': 'rgb(var(--color-surface-alt) / <alpha-value>)',
|
|
text: 'rgb(var(--color-text) / <alpha-value>)',
|
|
'text-muted': 'rgb(var(--color-text-muted) / <alpha-value>)',
|
|
border: {
|
|
DEFAULT: 'rgb(var(--color-border) / <alpha-value>)',
|
|
strong: 'rgb(var(--color-border-strong) / <alpha-value>)',
|
|
},
|
|
brand: {
|
|
DEFAULT: 'rgb(var(--color-brand) / <alpha-value>)',
|
|
emphasis: 'rgb(var(--color-brand-emphasis) / <alpha-value>)',
|
|
},
|
|
positive: {
|
|
DEFAULT: 'rgb(var(--color-positive) / <alpha-value>)',
|
|
surface: 'rgb(var(--color-positive-surface) / <alpha-value>)',
|
|
fill: 'rgb(var(--color-positive-fill) / <alpha-value>)',
|
|
},
|
|
negative: {
|
|
DEFAULT: 'rgb(var(--color-negative) / <alpha-value>)',
|
|
surface: 'rgb(var(--color-negative-surface) / <alpha-value>)',
|
|
fill: 'rgb(var(--color-negative-fill) / <alpha-value>)',
|
|
},
|
|
info: {
|
|
DEFAULT: 'rgb(var(--color-info) / <alpha-value>)',
|
|
surface: 'rgb(var(--color-info-surface) / <alpha-value>)',
|
|
fill: 'rgb(var(--color-info-fill) / <alpha-value>)',
|
|
},
|
|
danger: {
|
|
DEFAULT: 'rgb(var(--color-danger) / <alpha-value>)',
|
|
surface: 'rgb(var(--color-danger-surface) / <alpha-value>)',
|
|
fill: 'rgb(var(--color-danger-fill) / <alpha-value>)',
|
|
},
|
|
'focus-ring': 'rgb(var(--color-focus-ring) / <alpha-value>)',
|
|
},
|
|
},
|
|
},
|
|
|
|
plugins: [forms],
|
|
};
|