b5b85df2e5
- Enable Tailwind darkMode: 'class' with system preference detection - Add shared Layout component with sidebar navigation, dark mode toggle, and mobile hamburger menu - Add global CSS: focus-visible rings, smooth transitions, custom scrollbar, entrance animations - Update all authenticated pages to use Layout wrapper via App.tsx route restructure - Responsive improvements: stack headers on mobile, responsive padding, modal safe areas - Add fade-in animations for stat cards and scale-in for modals - 11 tests added for Layout component. All 430 tests pass.
29 lines
850 B
JavaScript
29 lines
850 B
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
|
|
darkMode: "class",
|
|
theme: {
|
|
extend: {
|
|
keyframes: {
|
|
"fade-in": {
|
|
from: { opacity: "0", transform: "translateY(4px)" },
|
|
to: { opacity: "1", transform: "translateY(0)" },
|
|
},
|
|
"slide-in": {
|
|
from: { opacity: "0", transform: "translateX(-8px)" },
|
|
to: { opacity: "1", transform: "translateX(0)" },
|
|
},
|
|
"scale-in": {
|
|
from: { opacity: "0", transform: "scale(0.95)" },
|
|
to: { opacity: "1", transform: "scale(1)" },
|
|
},
|
|
},
|
|
animation: {
|
|
"fade-in": "fade-in 0.3s ease-out",
|
|
"slide-in": "slide-in 0.3s ease-out",
|
|
"scale-in": "scale-in 0.2s ease-out",
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
};
|