Refonte UI complète : palettes saisonnières, typo moderne, paroles nettoyées, Shadoks
- Nettoyage paroles : suppression instructions Suno AI, corrections prononciation (11 fichiers) - 4 palettes saisonnières (Automne/Hiver dark, Printemps/Été light) avec sélecteur - Typographie modernisée : Outfit (display) + Inter (sans) remplacent Syne + Space Grotesk - Styles adaptatifs : CSS vars pour couleurs, overrides light mode complets - Mini-player : bouton Next ajouté, flèche expand plus visible - BookPlayer : fix scroll mode paginé, croix de fermeture visible - Illustrations Shadoks inline SVG dans 11 composants/pages - Suppression soulignés navigation, reset boutons, bordures propres Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -20,9 +20,10 @@ export default defineConfig({
|
||||
presetWebFonts({
|
||||
provider: 'bunny',
|
||||
fonts: {
|
||||
display: 'Syne:400,500,600,700,800',
|
||||
sans: 'Space Grotesk:300,400,500,600,700',
|
||||
display: 'Outfit:400,500,600,700,800',
|
||||
sans: 'Inter:300,400,500,600,700',
|
||||
mono: 'JetBrains Mono:400,500,700',
|
||||
calligraphy: 'Playfair Display:400,700',
|
||||
},
|
||||
}),
|
||||
],
|
||||
@@ -33,47 +34,47 @@ export default defineConfig({
|
||||
theme: {
|
||||
colors: {
|
||||
primary: {
|
||||
DEFAULT: 'hsl(12, 76%, 48%)',
|
||||
50: 'hsl(12, 76%, 95%)',
|
||||
100: 'hsl(12, 76%, 88%)',
|
||||
200: 'hsl(12, 76%, 76%)',
|
||||
300: 'hsl(12, 76%, 64%)',
|
||||
400: 'hsl(12, 76%, 56%)',
|
||||
500: 'hsl(12, 76%, 48%)',
|
||||
600: 'hsl(12, 76%, 40%)',
|
||||
700: 'hsl(12, 76%, 33%)',
|
||||
800: 'hsl(12, 76%, 26%)',
|
||||
900: 'hsl(12, 76%, 18%)',
|
||||
DEFAULT: 'hsl(var(--color-primary))',
|
||||
50: 'hsl(18, 80%, 95%)',
|
||||
100: 'hsl(18, 80%, 88%)',
|
||||
200: 'hsl(18, 80%, 76%)',
|
||||
300: 'hsl(18, 80%, 64%)',
|
||||
400: 'hsl(18, 80%, 56%)',
|
||||
500: 'hsl(var(--color-primary))',
|
||||
600: 'hsl(18, 80%, 38%)',
|
||||
700: 'hsl(18, 80%, 30%)',
|
||||
800: 'hsl(18, 80%, 24%)',
|
||||
900: 'hsl(18, 80%, 16%)',
|
||||
},
|
||||
accent: {
|
||||
DEFAULT: 'hsl(36, 80%, 52%)',
|
||||
50: 'hsl(36, 80%, 95%)',
|
||||
100: 'hsl(36, 80%, 88%)',
|
||||
200: 'hsl(36, 80%, 76%)',
|
||||
300: 'hsl(36, 80%, 66%)',
|
||||
400: 'hsl(36, 80%, 58%)',
|
||||
500: 'hsl(36, 80%, 52%)',
|
||||
600: 'hsl(36, 80%, 44%)',
|
||||
700: 'hsl(36, 80%, 36%)',
|
||||
800: 'hsl(36, 80%, 28%)',
|
||||
900: 'hsl(36, 80%, 20%)',
|
||||
DEFAULT: 'hsl(var(--color-accent))',
|
||||
50: 'hsl(32, 85%, 95%)',
|
||||
100: 'hsl(32, 85%, 88%)',
|
||||
200: 'hsl(32, 85%, 76%)',
|
||||
300: 'hsl(32, 85%, 66%)',
|
||||
400: 'hsl(32, 85%, 58%)',
|
||||
500: 'hsl(var(--color-accent))',
|
||||
600: 'hsl(32, 85%, 42%)',
|
||||
700: 'hsl(32, 85%, 34%)',
|
||||
800: 'hsl(32, 85%, 26%)',
|
||||
900: 'hsl(32, 85%, 18%)',
|
||||
},
|
||||
surface: {
|
||||
DEFAULT: 'hsl(20, 8%, 8%)',
|
||||
50: 'hsl(20, 8%, 22%)',
|
||||
100: 'hsl(20, 8%, 18%)',
|
||||
200: 'hsl(20, 8%, 13%)',
|
||||
300: 'hsl(20, 8%, 10%)',
|
||||
400: 'hsl(20, 8%, 8%)',
|
||||
500: 'hsl(20, 8%, 6%)',
|
||||
600: 'hsl(20, 8%, 4%)',
|
||||
bg: 'hsl(20, 8%, 3.5%)',
|
||||
DEFAULT: 'hsl(var(--color-surface))',
|
||||
50: 'hsl(16, 12%, 22%)',
|
||||
100: 'hsl(16, 12%, 18%)',
|
||||
200: 'hsl(16, 12%, 13%)',
|
||||
300: 'hsl(16, 12%, 10%)',
|
||||
400: 'hsl(var(--color-surface))',
|
||||
500: 'hsl(16, 12%, 6%)',
|
||||
600: 'hsl(16, 12%, 4%)',
|
||||
bg: 'hsl(var(--color-bg))',
|
||||
},
|
||||
},
|
||||
},
|
||||
shortcuts: {
|
||||
'btn-primary': 'inline-flex items-center justify-center px-6 py-3 rounded-lg bg-primary text-white font-display font-semibold tracking-wide transition-all duration-200 hover:bg-primary-600 hover:scale-105 active:scale-95',
|
||||
'btn-accent': 'inline-flex items-center justify-center px-6 py-3 rounded-lg bg-accent text-surface-bg font-display font-semibold tracking-wide transition-all duration-200 hover:bg-accent-600 hover:scale-105 active:scale-95',
|
||||
'btn-primary': 'inline-flex items-center justify-center px-6 py-3 rounded-lg bg-primary text-white font-display font-semibold tracking-wide border-none transition-all duration-200 hover:bg-primary-600 hover:scale-105 active:scale-95',
|
||||
'btn-accent': 'inline-flex items-center justify-center px-6 py-3 rounded-lg bg-accent text-surface-bg font-display font-semibold tracking-wide border-none transition-all duration-200 hover:bg-accent-600 hover:scale-105 active:scale-95',
|
||||
'btn-ghost': 'inline-flex items-center justify-center px-4 py-2 rounded-lg border-none text-white/70 font-sans transition-all duration-200 hover:bg-white/10 hover:text-white',
|
||||
'card-surface': 'rounded-xl bg-surface border border-white/8 p-6 transition-all duration-300 hover:border-primary/30 hover:shadow-lg hover:shadow-primary/5',
|
||||
'text-gradient': 'bg-gradient-to-r from-primary-300 to-accent bg-clip-text text-transparent',
|
||||
|
||||
Reference in New Issue
Block a user