72 lines
1.8 KiB
TypeScript
72 lines
1.8 KiB
TypeScript
import type { Config } from 'tailwindcss';
|
|
|
|
const rgb = (variable: string) => `rgb(var(${variable}) / <alpha-value>)`;
|
|
|
|
const config: Config = {
|
|
content: ['./index.html', './src/**/*.{ts,tsx}'],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
primary: {
|
|
DEFAULT: rgb('--color-primary'),
|
|
fg: rgb('--color-primary-fg'),
|
|
soft: rgb('--color-primary-soft'),
|
|
},
|
|
secondary: {
|
|
DEFAULT: rgb('--color-secondary'),
|
|
fg: rgb('--color-secondary-fg'),
|
|
},
|
|
accent: rgb('--color-accent'),
|
|
bg: {
|
|
DEFAULT: rgb('--color-bg'),
|
|
muted: rgb('--color-bg-muted'),
|
|
inverse: rgb('--color-bg-inverse'),
|
|
},
|
|
fg: {
|
|
DEFAULT: rgb('--color-fg'),
|
|
muted: rgb('--color-fg-muted'),
|
|
inverse: rgb('--color-fg-inverse'),
|
|
},
|
|
border: {
|
|
DEFAULT: rgb('--color-border'),
|
|
strong: rgb('--color-border-strong'),
|
|
},
|
|
badge: {
|
|
fg: rgb('--color-badge-fg'),
|
|
},
|
|
},
|
|
borderRadius: {
|
|
sm: 'var(--radius-sm)',
|
|
DEFAULT: 'var(--radius-md)',
|
|
md: 'var(--radius-md)',
|
|
lg: 'var(--radius-lg)',
|
|
xl: 'var(--radius-xl)',
|
|
'2xl': 'var(--radius-2xl)',
|
|
},
|
|
fontFamily: {
|
|
sans: ['var(--font-sans)'],
|
|
display: ['var(--font-display)'],
|
|
},
|
|
boxShadow: {
|
|
sm: 'var(--shadow-sm)',
|
|
md: 'var(--shadow-md)',
|
|
lg: 'var(--shadow-lg)',
|
|
glow: 'var(--shadow-glow)',
|
|
},
|
|
maxWidth: {
|
|
container: 'var(--container-max)',
|
|
},
|
|
spacing: {
|
|
section: 'var(--space-section-y)',
|
|
gutter: 'var(--space-container)',
|
|
},
|
|
transitionTimingFunction: {
|
|
smooth: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
};
|
|
|
|
export default config;
|