Refactoring complet : contenu livre, config unique, routes, admin et light mode
- Source unique : supprime app/data/librodrome.config.yml, renomme site/ en bookplayer.config.yml - Morceaux : renommés avec slugs lisibles, fichiers audio renommés, inversion ch2↔ch3 corrigée - Chapitres : 11 fichiers .md réécrits avec le vrai contenu du livre (synthèse fidèle du PDF) - Routes : /lire → /modele-eco, /ecouter → /en-musique, redirections 301 - Admin chapitres : champs structurés (titre, description, temps lecture), compteur mots - Éditeur markdown : mode split, plein écran, support Tab, meilleur rendu aperçu - Admin morceaux : drag & drop, ajout/suppression, gestion playlist - Light mode : palettes printemps/été plus saturées et contrastées, teintes primary - Raccourcis clavier player : espace, flèches gauche/droite - Paroles : toggle supprimé, toujours visibles et scrollables - Nouvelles pages : autonomie, evenement Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Yvv
@@ -97,24 +97,24 @@ a {
|
||||
color: hsl(var(--color-text)) !important;
|
||||
}
|
||||
|
||||
/* white with opacity → dark text with same opacity */
|
||||
.palette-light .text-white\/20 { color: hsl(var(--color-text) / 0.2) !important; }
|
||||
.palette-light .text-white\/30 { color: hsl(var(--color-text) / 0.3) !important; }
|
||||
.palette-light .text-white\/40 { color: hsl(var(--color-text) / 0.4) !important; }
|
||||
.palette-light .text-white\/45 { color: hsl(var(--color-text) / 0.45) !important; }
|
||||
.palette-light .text-white\/50 { color: hsl(var(--color-text) / 0.5) !important; }
|
||||
.palette-light .text-white\/60 { color: hsl(var(--color-text) / 0.6) !important; }
|
||||
.palette-light .text-white\/70 { color: hsl(var(--color-text) / 0.7) !important; }
|
||||
.palette-light .text-white\/80 { color: hsl(var(--color-text) / 0.8) !important; }
|
||||
.palette-light .text-white\/85 { color: hsl(var(--color-text) / 0.85) !important; }
|
||||
/* white with opacity → dark text with boosted opacity for punch */
|
||||
.palette-light .text-white\/20 { color: hsl(var(--color-text) / 0.28) !important; }
|
||||
.palette-light .text-white\/30 { color: hsl(var(--color-text) / 0.38) !important; }
|
||||
.palette-light .text-white\/40 { color: hsl(var(--color-text) / 0.48) !important; }
|
||||
.palette-light .text-white\/45 { color: hsl(var(--color-text) / 0.52) !important; }
|
||||
.palette-light .text-white\/50 { color: hsl(var(--color-text) / 0.58) !important; }
|
||||
.palette-light .text-white\/60 { color: hsl(var(--color-text) / 0.68) !important; }
|
||||
.palette-light .text-white\/70 { color: hsl(var(--color-text) / 0.78) !important; }
|
||||
.palette-light .text-white\/80 { color: hsl(var(--color-text) / 0.88) !important; }
|
||||
.palette-light .text-white\/85 { color: hsl(var(--color-text) / 0.92) !important; }
|
||||
|
||||
/* white backgrounds → surface tones */
|
||||
.palette-light .bg-white\/5 { background-color: hsl(var(--color-text) / 0.04) !important; }
|
||||
.palette-light .bg-white\/8 { background-color: hsl(var(--color-text) / 0.06) !important; }
|
||||
.palette-light .bg-white\/10 { background-color: hsl(var(--color-text) / 0.07) !important; }
|
||||
/* white backgrounds → surface tones with more contrast */
|
||||
.palette-light .bg-white\/5 { background-color: hsl(var(--color-primary) / 0.05) !important; }
|
||||
.palette-light .bg-white\/8 { background-color: hsl(var(--color-primary) / 0.07) !important; }
|
||||
.palette-light .bg-white\/10 { background-color: hsl(var(--color-primary) / 0.09) !important; }
|
||||
|
||||
/* borders */
|
||||
.palette-light .border-white\/8 { border-color: hsl(var(--color-text) / 0.1) !important; }
|
||||
/* borders with primary tint */
|
||||
.palette-light .border-white\/8 { border-color: hsl(var(--color-primary) / 0.15) !important; }
|
||||
|
||||
/* hover overrides */
|
||||
.palette-light .hover\:text-white:hover,
|
||||
@@ -123,42 +123,43 @@ a {
|
||||
color: hsl(var(--color-text)) !important;
|
||||
}
|
||||
.palette-light .hover\:text-white\/60:hover {
|
||||
color: hsl(var(--color-text) / 0.6) !important;
|
||||
color: hsl(var(--color-text) / 0.7) !important;
|
||||
}
|
||||
.palette-light .hover\:bg-white\/5:hover {
|
||||
background-color: hsl(var(--color-text) / 0.04) !important;
|
||||
background-color: hsl(var(--color-primary) / 0.08) !important;
|
||||
}
|
||||
.palette-light .hover\:bg-white\/10:hover {
|
||||
background-color: hsl(var(--color-text) / 0.07) !important;
|
||||
background-color: hsl(var(--color-primary) / 0.12) !important;
|
||||
}
|
||||
|
||||
/* group-hover overrides */
|
||||
.palette-light .group:hover .group-hover\:text-primary\/60 {
|
||||
color: hsl(var(--color-primary) / 0.6) !important;
|
||||
color: hsl(var(--color-primary) / 0.7) !important;
|
||||
}
|
||||
|
||||
/* placeholder overrides */
|
||||
.palette-light .placeholder\:text-white\/30::placeholder {
|
||||
color: hsl(var(--color-text) / 0.3) !important;
|
||||
color: hsl(var(--color-text) / 0.35) !important;
|
||||
}
|
||||
|
||||
/* Prose/content in light mode */
|
||||
.palette-light .prose { color: hsl(var(--color-text)); }
|
||||
.palette-light .prose :where(h1,h2,h3,h4,h5,h6) { color: hsl(var(--color-text)); }
|
||||
|
||||
/* text-gradient in light mode — needs transparent fill override */
|
||||
/* text-gradient in light mode — vivid gradient */
|
||||
.palette-light .text-gradient {
|
||||
background-image: linear-gradient(to right, hsl(var(--color-primary)), hsl(var(--color-accent)));
|
||||
background-image: linear-gradient(135deg, hsl(var(--color-primary)), hsl(var(--color-accent)));
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
/* card surfaces */
|
||||
/* card surfaces — subtle shadow for depth */
|
||||
.palette-light .card-surface {
|
||||
background: hsl(var(--color-surface)) !important;
|
||||
border-color: hsl(var(--color-text) / 0.1) !important;
|
||||
border-color: hsl(var(--color-primary) / 0.12) !important;
|
||||
box-shadow: 0 1px 3px hsl(var(--color-text) / 0.06);
|
||||
}
|
||||
|
||||
/* btn-primary text stays white on colored bg */
|
||||
@@ -166,17 +167,36 @@ a {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
/* input fields */
|
||||
/* input fields — cleaner contrast */
|
||||
.palette-light input,
|
||||
.palette-light textarea {
|
||||
color: hsl(var(--color-text));
|
||||
background-color: hsl(var(--color-surface));
|
||||
border-color: hsl(var(--color-text) / 0.12);
|
||||
background-color: white;
|
||||
border-color: hsl(var(--color-text) / 0.18);
|
||||
}
|
||||
|
||||
.palette-light input:focus,
|
||||
.palette-light textarea:focus {
|
||||
border-color: hsl(var(--color-primary) / 0.5);
|
||||
box-shadow: 0 0 0 3px hsl(var(--color-primary) / 0.1);
|
||||
}
|
||||
|
||||
/* Ecouter view toggle buttons */
|
||||
.palette-light .bg-white\/10 {
|
||||
background-color: hsl(var(--color-text) / 0.1) !important;
|
||||
background-color: hsl(var(--color-primary) / 0.1) !important;
|
||||
}
|
||||
|
||||
/* Light mode scrollbar — tinted with primary */
|
||||
.palette-light ::-webkit-scrollbar-thumb {
|
||||
background: hsl(var(--color-primary) / 0.2);
|
||||
}
|
||||
.palette-light ::-webkit-scrollbar-thumb:hover {
|
||||
background: hsl(var(--color-primary) / 0.35);
|
||||
}
|
||||
|
||||
/* Light mode selection — vivid */
|
||||
.palette-light ::selection {
|
||||
background-color: hsl(var(--color-accent) / 0.25);
|
||||
}
|
||||
|
||||
/* Page transitions */
|
||||
|
||||
Reference in New Issue
Block a user