Re-theme dashboard, suivi, plan, and flux pages plus nav from the claude.ai/design import: warm cream/terracotta/olive palette, pill nav/buttons/inputs, Caprasimo display font for headings. Dark mode variant derived to hold the existing WCAG AA contrast ratios since the import only specified light. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
59 lines
2.5 KiB
JavaScript
59 lines
2.5 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],
|
|
display: ['Caprasimo', ...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],
|
|
};
|