feat(theme): add Ash theme (currently active) + palette preview; docs/README to six themes

This commit is contained in:
Richard Zink
2026-09-21 12:50:07 +02:00
parent 00bfea9d3c
commit 9e456bbaaa
4 changed files with 179 additions and 7 deletions
+3 -2
View File
@@ -9,13 +9,14 @@ note IDs are given for reference.
| Theme | Repo file | Live note | Dark / light |
|---|---|---|---|
| **Ash (active)** | `theme/blog_share_theme_ash.css` | `OCbcTyzbQJA2` | panel/bone · ember+steel / paper+ink |
| Coffee (default) | `theme/blog_share_theme_coffee.css` | `NqZXcFRGi3II` | espresso / latte-cream |
| Harbor | `theme/blog_share_theme_harbor.css` | `Ep54EDTwKxup` | harbordark / paper |
| Gruvbox | `theme/blog_share_theme_gruvbox.css` | `edhL5cByGwqA` | gruvbox dark / light |
| Solarized | `theme/blog_share_theme_solarized.css` | `UFxPR5IpTyfj` | base03 / base3 |
| Tokyo Night | `theme/blog_share_theme_tokyonight.css` | `bf1OKYo3msZm` | storm / day |
All three themes include a `html.theme-light` + `html.theme-dark` block, theme-aware **3D viewer**
All six themes include a `html.theme-light` + `html.theme-dark` block, theme-aware **3D viewer**
overlays and **Mermaid** rendering. The 3D viewer reads the theme's CSS variables
(`--background-primary` for the canvas, `--background-active` for the model material), so it adapts
automatically to whichever theme is active – no script changes needed.
@@ -70,4 +71,4 @@ If you want to add or customise a theme on a new Trilium instance:
The palette-independent layout lives in **`blog_share_base.css`** (note under `.blog`, mime `text/css`). It is attached to the blog root with a **second `shareCss` relation that is inherited (`isInheritable`)**, alongside the per-palette theme relation. When you switch the active palette you change ONLY the theme `shareCss` target; the base relation stays untouched.
Because the base is shared, add any **new generic rule (focus ring, image caps, component layout) to `blog_share_base.css`** instead of duplicating it across all five theme files. The themes now carry only the `:root` variables and the colour-specific components. For production you can serve the minified build via `tools/minify_css.py`.
Because the base is shared, add any **new generic rule (focus ring, image caps, component layout) to `blog_share_base.css`** instead of duplicating it across all six theme files. The themes now carry only the `:root` variables and the colour-specific components. For production you can serve the minified build via `tools/minify_css.py`.