feat(theme): add Ash theme (currently active) + palette preview; docs/README to six themes
This commit is contained in:
@@ -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`.
|
||||
|
||||
Reference in New Issue
Block a user