Projets/Shaarli_bm_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: teinter backgrounds dark mode avec couleur primaire thème via color-mix() pour différenciation visuelle entre thèmes (DEFAULT/GitHub/NavyElegance/Dracula), augmenter ratio primary dans --tile-bg/border/hover (14%/45%/30% vs 0%/30%/18%), ajouter tokens --tile-* light mode (6%/14%/35% primary mix + shadow-sm/md), appliquer tint 8% primary sur body.view-notes/todo/archive backgrounds, et remplacer --bg-body hardcodé par transparent dans .content-container pour héritage background teinté

Browse Source
This commit is contained in:
Bruno Charest 2026-04-20 19:43:30 -04:00
parent 55c11db610
commit c8f7aec7ec
2 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
shaarli-pro/css/custom_views.css
View File

@ -28,7 +28,7 @@
/* --- TODO VIEW --- */ /* --- TODO VIEW --- */
body.view-todo .content-container { body.view-todo .content-container {
padding: 2rem; padding: 2rem;
background-color: var(--bg-body); background-color: transparent;
min-height: 100vh; min-height: 100vh;
/* Adjust for header */ /* Adjust for header */
} }
@ -143,7 +143,7 @@ body.view-todo #linklist {
body.view-notes .content-container, body.view-notes .content-container,
body.view-archive .content-container { body.view-archive .content-container {
padding: 2rem; padding: 2rem;
background-color: var(--bg-body); background-color: transparent;
min-height: 100vh; min-height: 100vh;
} }
@ -382,7 +382,7 @@ body.view-archive .content-container {
/* Ensure archive view uses same background as notes view */ /* Ensure archive view uses same background as notes view */
body.view-archive .content-container { body.view-archive .content-container {
background-color: var(--bg-body) !important; background-color: transparent !important;
} }
/* Archive Title */ /* Archive Title */

25
shaarli-pro/css/style.css
View File

@ -4611,13 +4611,32 @@ table {
} }
[data-theme="dark"] { [data-theme="dark"] {
--tile-bg: var(--surface-variant, var(--bg-card)); /* Tint surfaces with theme primary so each theme (DEFAULT, GITHUB,
--tile-bg-hover: color-mix(in srgb, var(--surface-variant, var(--bg-card)) 82%, var(--primary) 18%); NAVY_ELEGANCE, DRACULA, ...) is visually distinct even though all
--tile-border: color-mix(in srgb, var(--outline-variant, var(--border)) 70%, var(--text-main) 30%); dark themes share very similar navy/charcoal neutrals. */
--tile-bg: color-mix(in srgb, var(--surface-variant, var(--bg-card)) 86%, var(--primary) 14%);
--tile-bg-hover: color-mix(in srgb, var(--surface-variant, var(--bg-card)) 70%, var(--primary) 30%);
--tile-border: color-mix(in srgb, var(--outline-variant, var(--border)) 55%, var(--primary) 45%);
--tile-shadow: 0 1px 2px rgba(0, 0, 0, 0.45); --tile-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
--tile-shadow-hover: 0 8px 20px rgba(0, 0, 0, 0.55); --tile-shadow-hover: 0 8px 20px rgba(0, 0, 0, 0.55);
} }
[data-theme="light"] {
--tile-bg: color-mix(in srgb, var(--bg-card) 94%, var(--primary) 6%);
--tile-bg-hover: color-mix(in srgb, var(--bg-card) 86%, var(--primary) 14%);
--tile-border: color-mix(in srgb, var(--border) 65%, var(--primary) 35%);
--tile-shadow: var(--shadow-sm);
--tile-shadow-hover: var(--shadow-md);
}
/* Theme-tinted page background for Notes / Tâches / Archive views
(was pure --bg-body = near-black and felt disconnected from the theme). */
body.view-notes,
body.view-todo,
body.view-archive {
background-color: color-mix(in srgb, var(--bg-body) 92%, var(--primary) 8%);
}
/* Grid & list cards */ /* Grid & list cards */
.link-outer { .link-outer {
background: var(--tile-bg); background: var(--tile-bg);