refactor: enhance Nord theme styles and update Tailwind configuration

This commit is contained in:
2025-06-26 17:14:20 +02:00
parent 5d93919fb2
commit e7647fb80b
7 changed files with 150 additions and 65 deletions
+67 -27
View File
@@ -8,33 +8,73 @@ const config: Config = {
"./app/**/*.{js,ts,jsx,tsx,mdx}",
],
theme: {
extend: {
colors: {
nord: {
0: '#2E3440',
1: '#3B4252',
2: '#434C5E',
3: '#4C566A',
4: '#D8DEE9',
5: '#E5E9F0',
6: '#ECEFF4',
7: '#8FBCBB',
8: '#88C0D0',
9: '#81A1C1',
10: '#5E81AC',
11: '#BF616A',
12: '#D08770',
13: '#EBCB8B',
14: '#A3BE8C',
15: '#B48EAD',
},
},
borderRadius: {
lg: 'var(--radius)',
md: 'calc(var(--radius) - 2px)',
sm: 'calc(var(--radius) - 4px)'
}
},
extend: {
colors: {
nord: {
'0': '#2E3440',
'1': '#3B4252',
'2': '#434C5E',
'3': '#4C566A',
'4': '#D8DEE9',
'5': '#E5E9F0',
'6': '#ECEFF4',
'7': '#8FBCBB',
'8': '#88C0D0',
'9': '#81A1C1',
'10': '#5E81AC',
'11': '#BF616A',
'12': '#D08770',
'13': '#EBCB8B',
'14': '#A3BE8C',
'15': '#B48EAD'
},
background: 'hsl(var(--background))',
foreground: 'hsl(var(--foreground))',
card: {
DEFAULT: 'hsl(var(--card))',
foreground: 'hsl(var(--card-foreground))'
},
popover: {
DEFAULT: 'hsl(var(--popover))',
foreground: 'hsl(var(--popover-foreground))'
},
primary: {
DEFAULT: 'hsl(var(--primary))',
foreground: 'hsl(var(--primary-foreground))'
},
secondary: {
DEFAULT: 'hsl(var(--secondary))',
foreground: 'hsl(var(--secondary-foreground))'
},
muted: {
DEFAULT: 'hsl(var(--muted))',
foreground: 'hsl(var(--muted-foreground))'
},
accent: {
DEFAULT: 'hsl(var(--accent))',
foreground: 'hsl(var(--accent-foreground))'
},
destructive: {
DEFAULT: 'hsl(var(--destructive))',
foreground: 'hsl(var(--destructive-foreground))'
},
border: 'hsl(var(--border))',
input: 'hsl(var(--input))',
ring: 'hsl(var(--ring))',
chart: {
'1': 'hsl(var(--chart-1))',
'2': 'hsl(var(--chart-2))',
'3': 'hsl(var(--chart-3))',
'4': 'hsl(var(--chart-4))',
'5': 'hsl(var(--chart-5))'
}
},
borderRadius: {
lg: 'var(--radius)',
md: 'calc(var(--radius) - 2px)',
sm: 'calc(var(--radius) - 4px)'
}
}
},
plugins: [require("tailwindcss-animate")],
};