87 lines
2.4 KiB
JavaScript
87 lines
2.4 KiB
JavaScript
// tailwind.config.mjs
|
|
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
darkMode: 'class',
|
|
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
'sans': ['Inter', 'system-ui', 'sans-serif'],
|
|
'headline': ['Poppins', 'system-ui', 'sans-serif'],
|
|
'serif': ['Noto Serif', 'serif'],
|
|
},
|
|
colors: {
|
|
'nigerian-green': {
|
|
50: '#f0fdf4',
|
|
100: '#dcfce7',
|
|
200: '#bbf7d0',
|
|
300: '#86efac',
|
|
400: '#4ade80',
|
|
500: '#16a34a', // Primary Nigerian green
|
|
600: '#15803d',
|
|
700: '#166534',
|
|
800: '#14532d',
|
|
900: '#14532d',
|
|
},
|
|
'kente-gold': {
|
|
50: '#fffbeb',
|
|
100: '#fef3c7',
|
|
200: '#fde68a',
|
|
300: '#fcd34d',
|
|
400: '#fbbf24',
|
|
500: '#f59e0b', // Primary gold
|
|
600: '#d97706',
|
|
700: '#b45309',
|
|
800: '#92400e',
|
|
900: '#78350f',
|
|
},
|
|
'ankara-red': {
|
|
50: '#fef2f2',
|
|
100: '#fee2e2',
|
|
200: '#fecaca',
|
|
300: '#fca5a5',
|
|
400: '#f87171',
|
|
500: '#ef4444',
|
|
600: '#dc2626', // Primary red
|
|
700: '#b91c1c',
|
|
800: '#991b1b',
|
|
900: '#7f1d1d',
|
|
},
|
|
'adire-blue': {
|
|
50: '#eff6ff',
|
|
100: '#dbeafe',
|
|
200: '#bfdbfe',
|
|
300: '#93c5fd',
|
|
400: '#60a5fa',
|
|
500: '#3b82f6',
|
|
600: '#2563eb', // Primary blue
|
|
700: '#1d4ed8',
|
|
800: '#1e40af',
|
|
900: '#1e3a8a',
|
|
},
|
|
},
|
|
animation: {
|
|
'text-shine': 'text-shine 8s linear infinite', // Changed from 4s to 8s
|
|
'float': 'float 6s ease-in-out infinite',
|
|
'bounce-gentle': 'bounce-gentle 2s infinite',
|
|
},
|
|
keyframes: {
|
|
'text-shine': {
|
|
'0%': { 'background-position': '-200% center' },
|
|
'100%': { 'background-position': '200% center' },
|
|
},
|
|
'float': {
|
|
'0%, 100%': { transform: 'translateY(0px)' },
|
|
'50%': { transform: 'translateY(-10px)' },
|
|
},
|
|
'bounce-gentle': {
|
|
'0%, 20%, 53%, 80%, 100%': { transform: 'translateY(0)' },
|
|
'40%, 43%': { transform: 'translateY(-10px)' },
|
|
'70%': { transform: 'translateY(-5px)' },
|
|
'90%': { transform: 'translateY(-2px)' },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [ ],
|
|
} |