115 lines
3.3 KiB
JavaScript
115 lines
3.3 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: ['./index.html', './src/**/*.{js,jsx}'],
|
|
theme: {
|
|
screens: {
|
|
xs: '390px',
|
|
sm: '640px',
|
|
md: '768px',
|
|
lg: '1024px',
|
|
xl: '1280px',
|
|
'2xl': '1440px',
|
|
},
|
|
extend: {
|
|
colors: {
|
|
ink: {
|
|
DEFAULT: '#0F0E0C',
|
|
muted: '#5C574F',
|
|
faint: '#8A847A',
|
|
},
|
|
surface: {
|
|
DEFAULT: '#FAF8F5',
|
|
elevated: '#FFFFFF',
|
|
muted: '#F3EFE8',
|
|
},
|
|
accent: {
|
|
DEFAULT: '#C45C26',
|
|
hover: '#A34A1E',
|
|
subtle: '#F5E8DF',
|
|
},
|
|
gold: {
|
|
DEFAULT: '#C9A227',
|
|
muted: '#E8D9A8',
|
|
},
|
|
festival: {
|
|
DEFAULT: '#8B2E5A',
|
|
subtle: '#F3E6ED',
|
|
},
|
|
border: {
|
|
DEFAULT: '#E8E4DD',
|
|
strong: '#D4CEC4',
|
|
},
|
|
success: {
|
|
DEFAULT: '#2D6A4F',
|
|
subtle: '#E6F2EC',
|
|
},
|
|
danger: {
|
|
DEFAULT: '#B42318',
|
|
subtle: '#FCECEA',
|
|
},
|
|
},
|
|
fontFamily: {
|
|
display: ['"Fraunces"', 'Georgia', 'serif'],
|
|
sans: ['"DM Sans"', 'system-ui', 'sans-serif'],
|
|
},
|
|
fontSize: {
|
|
'display-xl': ['clamp(2.25rem, 5vw, 3.75rem)', { lineHeight: '1.05', letterSpacing: '-0.02em', fontWeight: '600' }],
|
|
'display-lg': ['clamp(1.875rem, 3.5vw, 2.5rem)', { lineHeight: '1.1', letterSpacing: '-0.02em', fontWeight: '600' }],
|
|
'display-md': ['1.25rem', { lineHeight: '1.3', letterSpacing: '-0.01em', fontWeight: '600' }],
|
|
body: ['1rem', { lineHeight: '1.65' }],
|
|
'body-sm': ['0.875rem', { lineHeight: '1.55' }],
|
|
caption: ['0.75rem', { lineHeight: '1.45', letterSpacing: '0.04em' }],
|
|
label: ['0.8125rem', { lineHeight: '1.2', letterSpacing: '0.08em', fontWeight: '600' }],
|
|
},
|
|
spacing: {
|
|
gutter: '1rem',
|
|
'gutter-md': '1.5rem',
|
|
'gutter-lg': '2rem',
|
|
section: '4rem',
|
|
'section-lg': '6rem',
|
|
},
|
|
maxWidth: {
|
|
content: '80rem',
|
|
prose: '42rem',
|
|
editorial: '36rem',
|
|
},
|
|
borderRadius: {
|
|
sm: '0.125rem',
|
|
DEFAULT: '0.25rem',
|
|
md: '0.375rem',
|
|
lg: '0.5rem',
|
|
'2xl': '1rem',
|
|
pill: '9999px',
|
|
},
|
|
boxShadow: {
|
|
sm: '0 1px 2px 0 rgba(15, 14, 12, 0.05)',
|
|
editorial: '0 1px 0 0 rgba(15, 14, 12, 0.06)',
|
|
card: '0 12px 40px -24px rgba(15, 14, 12, 0.18)',
|
|
lift: '0 20px 50px -30px rgba(15, 14, 12, 0.22)',
|
|
inset: 'inset 0 1px 0 0 rgba(255, 255, 255, 0.04)',
|
|
},
|
|
transitionDuration: {
|
|
DEFAULT: '200ms',
|
|
medium: '300ms',
|
|
slow: '500ms',
|
|
},
|
|
transitionTimingFunction: {
|
|
smooth: 'cubic-bezier(0.22, 1, 0.36, 1)',
|
|
},
|
|
backgroundImage: {
|
|
'scrim-bottom': 'linear-gradient(to top, rgba(15, 14, 12, 0.72) 0%, rgba(15, 14, 12, 0) 68%)',
|
|
'scrim-subtle': 'linear-gradient(180deg, rgba(15, 14, 12, 0.04) 0%, transparent 100%)',
|
|
},
|
|
animation: {
|
|
shimmer: 'shimmer 1.6s ease-in-out infinite',
|
|
},
|
|
keyframes: {
|
|
shimmer: {
|
|
'0%': { backgroundPosition: '200% 0' },
|
|
'100%': { backgroundPosition: '-200% 0' },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|