zink/trilium_share_gruvbox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Theme: switch blog to Coffee dark / Coffee Latte light (megabyte0x/omarchy-coffee-theme, MIT); theme-aware 3D viewer + palette + docs

Browse Source
This commit is contained in:
trilium-share-gruvbox
2026-09-07 19:36:30 +02:00
parent 3da4ae92fa
commit b7a59be0d7
5 changed files with 206 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+8 -8
View File
@@ -1,16 +1,16 @@
# Trilium Share – Harbor Blog System # Trilium Share – Coffee Blog System
[![License](https://img.shields.io/badge/License-GPL--3.0-fb4934)](LICENSE) [![License](https://img.shields.io/badge/License-GPL--3.0-fb4934)](LICENSE)
[![Live demo](https://img.shields.io/badge/Live%20demo-richard.familie--zink.org-8ec07c)](https://richard.familie-zink.org) [![Live demo](https://img.shields.io/badge/Live%20demo-richard.familie--zink.org-8ec07c)](https://richard.familie-zink.org)
[![TriliumNext](https://img.shields.io/badge/TriliumNext-Public%20Share-83a598)](https://github.com/TriliumNext/Trilium) [![TriliumNext](https://img.shields.io/badge/TriliumNext-Public%20Share-83a598)](https://github.com/TriliumNext/Trilium)
[![Theme](https://img.shields.io/badge/Theme-Harbor-e75a50)](https://github.com/HANCORE-linux/omarchy-harbor-theme) [![Theme](https://img.shields.io/badge/Theme-Coffee-e0a15c)](https://github.com/megabyte0x/omarchy-coffee-theme)
[![Built with](https://img.shields.io/badge/Built%20with-Opencode-fe8019)](https://opencode.ai) [![Built with](https://img.shields.io/badge/Built%20with-Opencode-fe8019)](https://opencode.ai)
[![Model](https://img.shields.io/badge/Model-Deepseek%20V4%20Flash-d3869b)](https://www.deepseek.com/) [![Model](https://img.shields.io/badge/Model-Deepseek%20V4%20Flash-d3869b)](https://www.deepseek.com/)
> **Note:** This theme and blog system was created with the help of > **Note:** This theme and blog system was created with the help of
> [**Opencode**](https://opencode.ai) and **Deepseek V4 Flash**. > [**Opencode**](https://opencode.ai) and **Deepseek V4 Flash**.
A complete **public-share blog system + Harbor theme** for [TriliumNext](https://github.com/TriliumNext/Trilium). A complete **public-share blog system + Coffee theme** for [TriliumNext](https://github.com/TriliumNext/Trilium).
It turns a normal Trilium note tree into a themed, searchable blog with categories, an RSS feed, It turns a normal Trilium note tree into a themed, searchable blog with categories, an RSS feed,
a sitemap, a digital garden (growth states) and client-side rendering of Mermaid, Excalidraw and a sitemap, a digital garden (growth states) and client-side rendering of Mermaid, Excalidraw and
mind-map notes. mind-map notes.
@@ -18,13 +18,13 @@ mind-map notes.
Everything is driven by Trilium's built-in **Public Share** feature plus a few frontend/backend scripts – Everything is driven by Trilium's built-in **Public Share** feature plus a few frontend/backend scripts –
no external dependencies (except `highlight.js`, vendored in `lib/`). no external dependencies (except `highlight.js`, vendored in `lib/`).
![Harbor palette](assets/palette.png) ![Coffee palette](assets/palette.png)
*Palette from the [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (Harbor light / Harbordark) repository, MIT licensed.* *Palette from the [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (Coffee / Coffee Latte) repository, MIT licensed.*
## Features ## Features
- Harbor light/dark theme for the share, with a theme toggle in the header. - Coffee dark / Coffee Latte light theme for the share, with a theme toggle in the header.
- Blog index, category pages, sub-categories, tags and tag overview. - Blog index, category pages, sub-categories, tags and tag overview.
- **Menu sorting**: articles in the left menu are sorted by publication date (newest first) - **Menu sorting**: articles in the left menu are sorted by publication date (newest first)
and labelled `Fri 2026-08-28 <shortened title>` automatically. All date displays and labelled `Fri 2026-08-28 <shortened title>` automatically. All date displays
@@ -66,7 +66,7 @@ no external dependencies (except `highlight.js`, vendored in `lib/`).
|---|---|---| |---|---|---|
| `blog_generator.js` | backend script that generates index, feed, sitemap, search data, category & tag pages | code, `application/javascript;env=backend` | | `blog_generator.js` | backend script that generates index, feed, sitemap, search data, category & tag pages | code, `application/javascript;env=backend` |
| `blog_publish_manager.js` | backend script that mirrors notes between `Unpublished` and the blog | code, `application/javascript;env=backend` | | `blog_publish_manager.js` | backend script that mirrors notes between `Unpublished` and the blog | code, `application/javascript;env=backend` |
| `theme/blog_share_theme.css` | the Harbor share theme (Harbor light / Harbordark) | code, `text/css` | | `theme/blog_share_theme.css` | the Coffee share theme (Coffee / Coffee Latte) | code, `text/css` |
| `theme/favicon.svg` | default site favicon | code (SVG) | | `theme/favicon.svg` | default site favicon | code (SVG) |
| `theme/cookie.woff2` | "Cookie" font for the Buy me a coffee button | file, `font/woff2` | | `theme/cookie.woff2` | "Cookie" font for the Buy me a coffee button | file, `font/woff2` |
| `lib/highlight.js` | vendored highlight.js | code, `application/javascript` | | `lib/highlight.js` | vendored highlight.js | code, `application/javascript` |
@@ -297,7 +297,7 @@ server {
## Customisation ## Customisation
- **Theme**: edit `theme/blog_share_theme.css` (Harbor light/dark via `html.theme-light/dark`). - **Theme**: edit `theme/blog_share_theme.css` (Coffee / Coffee Latte via `html.theme-light/dark`).
- **Buy me a coffee**: edit `scripts/bmc_button.js` (link, text, copyright) – the font is - **Buy me a coffee**: edit `scripts/bmc_button.js` (link, text, copyright) – the font is
referenced via `__COOKIE_FONT_ID__`. referenced via `__COOKIE_FONT_ID__`.
- **Category logos**: copy the `examples/` icon + `ignis8_menu_icon.js` pattern to give a - **Category logos**: copy the `examples/` icon + `ignis8_menu_icon.js` pattern to give a
THIRD_PARTY_LICENSES.md
+2 -2
View File
@@ -8,8 +8,8 @@ The following files in this repository are **not** covered by the GPL-3.0 and ke
| `lib/highlight.js` | [Highlight.js](https://github.com/highlightjs/highlight.js) v11.9.0 | [BSD-3-Clause](#bsd-3-clause) | | `lib/highlight.js` | [Highlight.js](https://github.com/highlightjs/highlight.js) v11.9.0 | [BSD-3-Clause](#bsd-3-clause) |
| `lib/hljs_line_numbers.js` | [highlightjs-line-numbers](https://github.com/yury-dymov/highlightjs-line-numbers) | [MIT](#mit-license) | | `lib/hljs_line_numbers.js` | [highlightjs-line-numbers](https://github.com/yury-dymov/highlightjs-line-numbers) | [MIT](#mit-license) |
| `theme/cookie.woff2` | "Cookie" font, © 2011 [Ania Kruk](https://fonts.google.com/specimen/Cookie) | [SIL Open Font License 1.1](https://openfontlicense.org/) | | `theme/cookie.woff2` | "Cookie" font, © 2011 [Ania Kruk](https://fonts.google.com/specimen/Cookie) | [SIL Open Font License 1.1](https://openfontlicense.org/) |
| `assets/palette.png` | Harbor / Harbordark palette image generated from [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (repo: MIT) | [MIT](#mit-license) | | `assets/palette.png` | Coffee / Coffee Latte palette image generated from [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (repo: MIT) | [MIT](#mit-license) |
| `theme/blog_share_theme.css` | Harbor light / Harbordark color scheme from [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (repo: MIT) | [MIT](#mit-license) | | `theme/blog_share_theme.css` | Coffee / Coffee Latte color scheme from [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (repo: MIT) | [MIT](#mit-license) |
| `lib/3d/three.min.js`, `lib/3d/OrbitControls.js`, `lib/3d/STLLoader.js` | [three.js](https://github.com/mrdoob/three.js) r128 | [MIT](#mit-license) | | `lib/3d/three.min.js`, `lib/3d/OrbitControls.js`, `lib/3d/STLLoader.js` | [three.js](https://github.com/mrdoob/three.js) r128 | [MIT](#mit-license) |
| `lib/3d/occt-import-js.js`, `lib/3d/occt-import-js.wasm` | [occt-import-js](https://github.com/kovacsv/occt-import-js) (OpenCASCADE, WASM) | [LGPL-2.1](#lgpl-21) | | `lib/3d/occt-import-js.js`, `lib/3d/occt-import-js.wasm` | [occt-import-js](https://github.com/kovacsv/occt-import-js) (OpenCASCADE, WASM) | [LGPL-2.1](#lgpl-21) |
| `lib/3d/occt-wasm-bundle.js`, `lib/3d/occt-wasm.wasm` | [occt-wasm](https://github.com/andymai/occt-wasm) (OpenCASCADE **OCCT V8**, WebAssembly, esbuild-bundled `OcctKernel`) | [MIT OR Apache-2.0](#mit-license) | | `lib/3d/occt-wasm-bundle.js`, `lib/3d/occt-wasm.wasm` | [occt-wasm](https://github.com/andymai/occt-wasm) (OpenCASCADE **OCCT V8**, WebAssembly, esbuild-bundled `OcctKernel`) | [MIT OR Apache-2.0](#mit-license) |
assets/palette.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 24 KiB

scripts/3d_model_viewer.js
+3 -3
View File
@@ -233,7 +233,7 @@
var renderer = new THREE.WebGLRenderer({ antialias: true }); var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(initSize.w, initSize.h); renderer.setSize(initSize.w, initSize.h);
var isLight = document.documentElement.classList.contains("theme-light"); var isLight = document.documentElement.classList.contains("theme-light");
renderer.setClearColor(isLight ? 0xe8ecd0 : 0x1b1b1b, 1); renderer.setClearColor(isLight ? 0xE8E3C3 : 0x1d150f, 1);
var scene = new THREE.Scene(); var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(45, initSize.w / initSize.h, 0.1, 1000000); var camera = new THREE.PerspectiveCamera(45, initSize.w / initSize.h, 0.1, 1000000);
@@ -309,7 +309,7 @@
geo.setAttribute("position", new THREE.Float32BufferAttribute(e.data.positions, 3)); geo.setAttribute("position", new THREE.Float32BufferAttribute(e.data.positions, 3));
if (e.data.indices) geo.setIndex(new THREE.BufferAttribute(e.data.indices, 1)); if (e.data.indices) geo.setIndex(new THREE.BufferAttribute(e.data.indices, 1));
fixWinding(geo); fixWinding(geo);
var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x5e81ac : 0x77838a, metalness: 0.2, roughness: 0.6, side: THREE.DoubleSide, flatShading: false }); var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x8e2d53 : 0xe0a15c, metalness: 0.2, roughness: 0.6, side: THREE.DoubleSide, flatShading: false });
chunkGeometry(geo, group, mat); chunkGeometry(geo, group, mat);
var tris = (e.data.indices && e.data.indices.length) ? e.data.indices.length / 3 : e.data.positions.length / 9; var tris = (e.data.indices && e.data.indices.length) ? e.data.indices.length / 3 : e.data.positions.length / 9;
fit(); fit();
@@ -331,7 +331,7 @@
} else { } else {
var geo = new THREE.STLLoader().parse(data.buffer); var geo = new THREE.STLLoader().parse(data.buffer);
geo.computeVertexNormals(); geo.computeVertexNormals();
var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x5e81ac : 0x77838a, metalness: 0.25, roughness: 0.55, flatShading: true }); var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x8e2d53 : 0xe0a15c, metalness: 0.25, roughness: 0.55, flatShading: true });
group.add(new THREE.Mesh(geo, mat)); group.add(new THREE.Mesh(geo, mat));
fit(); fit();
showCanvas(); showCanvas();
theme/blog_share_theme.css
+193 -193
View File
@@ -1,41 +1,41 @@
/* /*
* Harbor Share Theme for Richard's Blog (Trilium Public Share) * Coffee Share Theme for Richard's Blog (Trilium Public Share)
* Light: Harbor (paper #dfe4c4 / ink #1c2d28, accent #5e81ac) * Light: Coffee Latte (cream #E8E3C3 / ink #2D1A1D, accent #8e2d53)
* Dark: Harbordark (#1b1b1b / #efebdc, accent #e75a50) * Dark: Coffee (espresso #1d150f / latte-cream #f0e2d0, accent #e0a15c)
* Based on https://github.com/HANCORE-linux/omarchy-harbor-theme (MIT) * Based on https://github.com/megabyte0x/omarchy-coffee-theme (MIT)
*/ */
html.theme-light { html.theme-light {
--background-primary: #dfe4c4; --background-primary: #E8E3C3;
--background-secondary: #d0d6b4; --background-secondary: #eae6c9;
--background-highlight: #c3c9a6; --background-highlight: #c5c1a6;
--background-active: #5e81ac; --background-active: #8e2d53;
--blog-card-bg: #d0d6b4; --blog-card-bg: #eae6c9;
--scrollbar-thumb: #c3c9a6; --scrollbar-thumb: #c5c1a6;
--scrollbar-hover: #b3ba96; --scrollbar-hover: #aeaa92;
--scrollbar-track: #d0d6b4; --scrollbar-track: #eae6c9;
--text-primary: #1c2d28; --text-primary: #2D1A1D;
--text-heading: #1c2d28; --text-heading: #2D1A1D;
--text-menu: #556753; --text-menu: #4f6b00;
--text-link: #4c6c94; --text-link: #8e2d53;
--text-menu-active: #dfe4c4; --text-menu-active: #E8E3C3;
color-scheme: light; color-scheme: light;
} }
html.theme-dark { html.theme-dark {
--background-primary: #1b1b1b; --background-primary: #1d150f;
--background-secondary: #232323; --background-secondary: #2d2118;
--background-highlight: #2e2e2e; --background-highlight: #3a2a20;
--background-active: #e75a50; --background-active: #e0a15c;
--blog-card-bg: #262626; --blog-card-bg: #35291f;
--scrollbar-thumb: #2e2e2e; --scrollbar-thumb: #3a2a20;
--scrollbar-hover: #3f3f3f; --scrollbar-hover: #4a3a30;
--scrollbar-track: #1b1b1b; --scrollbar-track: #1d150f;
--text-primary: #efebdc; --text-primary: #f0e2d0;
--text-heading: #efebdc; --text-heading: #f0e2d0;
--text-menu: #a99b7a; --text-menu: #8f7a67;
--text-link: #e58980; --text-link: #ec8f89;
--text-menu-active: #1b1b1b; --text-menu-active: #1d150f;
color-scheme: dark; color-scheme: dark;
} }
@@ -139,8 +139,8 @@ body {
padding: 6px 12px 8px; padding: 6px 12px 8px;
border-radius: 8px; border-radius: 8px;
background: #fabd2f; background: #fabd2f;
color: #1c2d28; color: #2D1A1D;
border: 2px solid #1c2d28; border: 2px solid #2D1A1D;
font-family: "Cookie", "Brush Script MT", cursive; font-family: "Cookie", "Brush Script MT", cursive;
font-size: 1.4em; font-size: 1.4em;
line-height: 1.1; line-height: 1.1;
@@ -149,8 +149,8 @@ body {
} }
.bmc-btn:hover { .bmc-btn:hover {
background: #dc8164; background: #b25d76;
color: #1c2d28; color: #2D1A1D;
text-decoration: none; text-decoration: none;
transform: translateY(-1px); transform: translateY(-1px);
} }
@@ -333,18 +333,18 @@ body {
} }
html.theme-light .blog-search-header-input { html.theme-light .blog-search-header-input {
border-color: #4c6c94; border-color: #8e2d53;
background: rgba(76, 108, 148, 0.10); background: rgba(76, 108, 148, 0.10);
} }
.blog-search-header-input:focus { .blog-search-header-input:focus {
outline: none; outline: none;
border-color: #77838a; border-color: #cf90a2;
box-shadow: 0 0 0 2px rgba(119, 131, 138, 0.20); box-shadow: 0 0 0 2px rgba(119, 131, 138, 0.20);
} }
html.theme-light .blog-search-header-input:focus { html.theme-light .blog-search-header-input:focus {
border-color: #4c6c94; border-color: #8e2d53;
box-shadow: 0 0 0 2px rgba(76, 108, 148, 0.15); box-shadow: 0 0 0 2px rgba(76, 108, 148, 0.15);
} }
@@ -353,7 +353,7 @@ html.theme-light .blog-search-header-input:focus {
} }
html.theme-light .search-item .search-icon { html.theme-light .search-item .search-icon {
color: #4c6c94; color: #8e2d53;
} }
.tn-image { .tn-image {
@@ -769,33 +769,33 @@ html.theme-light {
/* ---------- Code blocks - Harbordark (always, also in light mode) ---------- */ /* ---------- Code blocks - Harbordark (always, also in light mode) ---------- */
.ck-content pre, .ck-content pre,
#content pre { #content pre {
background-color: #222222; background-color: #2d2118;
color: #efebdc; color: #f0e2d0;
border: 1px solid #2e2e2e; border: 1px solid #3a2a20;
border-radius: 8px; border-radius: 8px;
} }
.ck-content code, .ck-content code,
#content code { #content code {
background-color: #2a2a2a; background-color: #3a2a20;
color: #efebdc; color: #f0e2d0;
border-color: #3f3f3f; border-color: #4a3a30;
border-radius: 8px; border-radius: 8px;
padding: 0.1em 0.35em; padding: 0.1em 0.35em;
} }
html.theme-light .ck-content pre, html.theme-light .ck-content pre,
html.theme-light #content pre { html.theme-light #content pre {
background-color: #e8ecd0; background-color: #eae6c9;
color: #1c2d28; color: #2D1A1D;
border-color: #c3c9a6; border-color: #c5c1a6;
} }
html.theme-light .ck-content code, html.theme-light .ck-content code,
html.theme-light #content code { html.theme-light #content code {
background-color: #cdd3b0; background-color: #dcd8b8;
color: #1c2d28; color: #2D1A1D;
border-color: #b3ba96; border-color: #aeaa92;
} }
/* ---------- Eingebettete Bilder: Radius wie Code-Blöcke (8px) ---------- */ /* ---------- Eingebettete Bilder: Radius wie Code-Blöcke (8px) ---------- */
@@ -815,7 +815,7 @@ html.theme-light #content code {
width: calc(100vw - 24px); width: calc(100vw - 24px);
margin: 1em 0; margin: 1em 0;
margin-left: calc(50% - (100vw - 24px) / 2); margin-left: calc(50% - (100vw - 24px) / 2);
background: #1b1b1b; background: #1d150f;
border: 1px solid var(--background-highlight); border: 1px solid var(--background-highlight);
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
@@ -833,9 +833,9 @@ html.theme-light #content code {
z-index: 3; z-index: 3;
display: none; display: none;
font-size: 0.75em; font-size: 0.75em;
color: #a99b7a; color: #8f7a67;
background: rgba(27, 27, 27, 0.85); background: rgba(27, 27, 27, 0.85);
border: 1px solid #2e2e2e; border: 1px solid #3a2a20;
border-radius: 6px; border-radius: 6px;
padding: 2px 10px; padding: 2px 10px;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
@@ -858,12 +858,12 @@ html.theme-light #content code {
text-align: center; text-align: center;
padding: 48px; padding: 48px;
box-sizing: border-box; box-sizing: border-box;
color: #a99b7a; color: #8f7a67;
font-size: 0.9em; font-size: 0.9em;
} }
.model-viewer-status.error { .model-viewer-status.error {
color: #F44336; color: #d78a6f;
} }
.model-viewer-progress { .model-viewer-progress {
@@ -874,7 +874,7 @@ html.theme-light #content code {
height: 6px; height: 6px;
width: min(60%, 480px); width: min(60%, 480px);
margin: 0 auto; margin: 0 auto;
background: #2a2a2a; background: #3a2a20;
border-radius: 3px; border-radius: 3px;
overflow: hidden; overflow: hidden;
} }
@@ -882,7 +882,7 @@ html.theme-light #content code {
.model-viewer-progress-fill { .model-viewer-progress-fill {
height: 100%; height: 100%;
width: 0; width: 0;
background: #E1CE98; background: #ffda92;
border-radius: 3px; border-radius: 3px;
transition: width 150ms ease; transition: width 150ms ease;
} }
@@ -902,7 +902,7 @@ html.theme-light #content code {
top: 8px; top: 8px;
left: 10px; left: 10px;
font-size: 0.75em; font-size: 0.75em;
color: #a99b7a; color: #8f7a67;
z-index: 2; z-index: 2;
pointer-events: none; pointer-events: none;
} }
@@ -925,25 +925,25 @@ html.theme-light #content code {
/* ---------- 3D-Viewer: theme-bewusste Overlays ---------- */ /* ---------- 3D-Viewer: theme-bewusste Overlays ---------- */
html.theme-light .model-viewer { html.theme-light .model-viewer {
background: #e8ecd0; background: #eae6c9;
} }
html.theme-light .model-viewer-status, html.theme-light .model-viewer-status,
html.theme-light .model-viewer-hint, html.theme-light .model-viewer-hint,
html.theme-light .model-viewer-data { html.theme-light .model-viewer-data {
color: #1c2d28; color: #2D1A1D;
} }
html.theme-light .model-viewer-data { html.theme-light .model-viewer-data {
background: rgba(223, 228, 196, 0.85); background: rgba(223, 228, 196, 0.85);
border-color: #c3c9a6; border-color: #c5c1a6;
} }
html.theme-light .model-viewer-status.error { html.theme-light .model-viewer-status.error {
color: #b14752; color: #a4405e;
} }
html.theme-light .model-viewer-progress { html.theme-light .model-viewer-progress {
background: #c3c9a6; background: #c5c1a6;
} }
html.theme-light .model-viewer-progress-fill { html.theme-light .model-viewer-progress-fill {
background: #5e81ac; background: #8e2d53;
} }
/* ---------- Bildunterschriften (Harbor) ---------- */ /* ---------- Bildunterschriften (Harbor) ---------- */
@@ -961,19 +961,19 @@ html.theme-light .model-viewer-progress-fill {
} }
.hljs { .hljs {
background: #222222; background: #2d2118;
color: #efebdc; color: #f0e2d0;
} }
.hljs-comment, .hljs-comment,
.hljs-quote { .hljs-quote {
color: #817f68; color: #8f7a67;
} }
.hljs-keyword, .hljs-keyword,
.hljs-selector-tag, .hljs-selector-tag,
.hljs-subst { .hljs-subst {
color: #F44336; color: #d78a6f;
} }
.hljs-number, .hljs-number,
@@ -981,24 +981,24 @@ html.theme-light .model-viewer-progress-fill {
.hljs-variable, .hljs-variable,
.hljs-template-variable, .hljs-template-variable,
.hljs-tag .hljs-attr { .hljs-tag .hljs-attr {
color: #e58980; color: #ec8f89;
} }
.hljs-string, .hljs-string,
.hljs-doctag { .hljs-doctag {
color: #a99b7a; color: #8f7a67;
} }
.hljs-title, .hljs-title,
.hljs-section, .hljs-section,
.hljs-selector-id { .hljs-selector-id {
color: #E1CE98; color: #ffda92;
} }
.hljs-type, .hljs-type,
.hljs-class .hljs-title, .hljs-class .hljs-title,
.hljs-attribute { .hljs-attribute {
color: #77838a; color: #cf90a2;
} }
.hljs-symbol, .hljs-symbol,
@@ -1007,13 +1007,13 @@ html.theme-light .model-viewer-progress-fill {
.hljs-meta, .hljs-meta,
.hljs-deletion, .hljs-deletion,
.hljs-addition { .hljs-addition {
color: #e58980; color: #ec8f89;
} }
.hljs-built_in, .hljs-built_in,
.hljs-builtin-name, .hljs-builtin-name,
.hljs-params { .hljs-params {
color: #77838a; color: #cf90a2;
} }
.hljs-emphasis { .hljs-emphasis {
@@ -1026,19 +1026,19 @@ html.theme-light .model-viewer-progress-fill {
/* ---------- Light mode: Harbor light highlighter ---------- */ /* ---------- Light mode: Harbor light highlighter ---------- */
html.theme-light .hljs, html.theme-light .hljs,
html.theme-light pre code.hljs { html.theme-light pre code.hljs {
background: #e8ecd0 !important; background: #eae6c9 !important;
color: #1c2d28; color: #2D1A1D;
} }
html.theme-light .hljs-comment, html.theme-light .hljs-comment,
html.theme-light .hljs-quote { html.theme-light .hljs-quote {
color: #7d8794; color: #76756f;
} }
html.theme-light .hljs-keyword, html.theme-light .hljs-keyword,
html.theme-light .hljs-selector-tag, html.theme-light .hljs-selector-tag,
html.theme-light .hljs-subst { html.theme-light .hljs-subst {
color: #b14752; color: #a4405e;
} }
html.theme-light .hljs-number, html.theme-light .hljs-number,
@@ -1046,24 +1046,24 @@ html.theme-light .hljs-literal,
html.theme-light .hljs-variable, html.theme-light .hljs-variable,
html.theme-light .hljs-template-variable, html.theme-light .hljs-template-variable,
html.theme-light .hljs-tag .hljs-attr { html.theme-light .hljs-tag .hljs-attr {
color: #8a5b81; color: #7a003b;
} }
html.theme-light .hljs-string, html.theme-light .hljs-string,
html.theme-light .hljs-doctag { html.theme-light .hljs-doctag {
color: #556753; color: #4f6b00;
} }
html.theme-light .hljs-title, html.theme-light .hljs-title,
html.theme-light .hljs-section, html.theme-light .hljs-section,
html.theme-light .hljs-selector-id { html.theme-light .hljs-selector-id {
color: #dc8164; color: #b25d76;
} }
html.theme-light .hljs-type, html.theme-light .hljs-type,
html.theme-light .hljs-class .hljs-title, html.theme-light .hljs-class .hljs-title,
html.theme-light .hljs-attribute { html.theme-light .hljs-attribute {
color: #4c6c94; color: #8e2d53;
} }
html.theme-light .hljs-symbol, html.theme-light .hljs-symbol,
@@ -1072,13 +1072,13 @@ html.theme-light .hljs-link,
html.theme-light .hljs-meta, html.theme-light .hljs-meta,
html.theme-light .hljs-deletion, html.theme-light .hljs-deletion,
html.theme-light .hljs-addition { html.theme-light .hljs-addition {
color: #8a5b81; color: #7a003b;
} }
html.theme-light .hljs-built_in, html.theme-light .hljs-built_in,
html.theme-light .hljs-builtin-name, html.theme-light .hljs-builtin-name,
html.theme-light .hljs-params { html.theme-light .hljs-params {
color: #3d727d; color: #4f6b00;
} }
html.theme-light .hljs-regexp, html.theme-light .hljs-regexp,
@@ -1087,16 +1087,16 @@ html.theme-light .hljs-selector-attr,
html.theme-light .hljs-selector-pseudo, html.theme-light .hljs-selector-pseudo,
html.theme-light .hljs-selector-class, html.theme-light .hljs-selector-class,
html.theme-light .hljs-template-tag { html.theme-light .hljs-template-tag {
color: #8a5b81; color: #7a003b;
} }
html.theme-light .hljs-name, html.theme-light .hljs-name,
html.theme-light .hljs-tag { html.theme-light .hljs-tag {
color: #4c6c94; color: #8e2d53;
} }
html.theme-light .hljs-meta .hljs-string { html.theme-light .hljs-meta .hljs-string {
color: #556753; color: #4f6b00;
} }
/* ---------- Admonitions (Trilium-style, gefüllt) ---------- */ /* ---------- Admonitions (Trilium-style, gefüllt) ---------- */
.admonition { .admonition {
@@ -1135,11 +1135,11 @@ html.theme-light .admonition.warning { --admonition-bg: rgba(220, 129, 100, 0.20
margin-top: 0; margin-top: 0;
} }
.admonition.note { --accent-color: #4c6c94; } .admonition.note { --accent-color: #8e2d53; }
.admonition.tip { --accent-color: #556753; } .admonition.tip { --accent-color: #4f6b00; }
.admonition.important { --accent-color: #8a5b81; } .admonition.important { --accent-color: #7a003b; }
.admonition.caution { --accent-color: #b14752; } .admonition.caution { --accent-color: #a4405e; }
.admonition.warning { --accent-color: #dc8164; } .admonition.warning { --accent-color: #b25d76; }
.admonition::before { .admonition::before {
color: var(--accent-color); color: var(--accent-color);
@@ -1157,22 +1157,22 @@ html.theme-light .admonition.warning { --admonition-bg: rgba(220, 129, 100, 0.20
/* ---------- Tables (Harbor, theme-aware) ---------- */ /* ---------- Tables (Harbor, theme-aware) ---------- */
html.theme-dark { html.theme-dark {
--table-header-bg: rgba(231, 90, 80, 0.20); --table-header-bg: rgba(231, 90, 80, 0.20);
--table-header-text: #efebdc; --table-header-text: #f0e2d0;
--table-header-border: rgba(231, 90, 80, 0.45); --table-header-border: rgba(231, 90, 80, 0.45);
--table-stripe: rgba(255, 255, 255, 0.04); --table-stripe: rgba(255, 255, 255, 0.04);
--table-hover: rgba(231, 90, 80, 0.12); --table-hover: rgba(231, 90, 80, 0.12);
--table-rowlabel-bg: rgba(255, 255, 255, 0.05); --table-rowlabel-bg: rgba(255, 255, 255, 0.05);
--table-rowlabel-text: #efebdc; --table-rowlabel-text: #f0e2d0;
} }
html.theme-light { html.theme-light {
--table-header-bg: rgba(94, 129, 172, 0.16); --table-header-bg: rgba(94, 129, 172, 0.16);
--table-header-text: #1c2d28; --table-header-text: #2D1A1D;
--table-header-border: rgba(94, 129, 172, 0.40); --table-header-border: rgba(94, 129, 172, 0.40);
--table-stripe: rgba(0, 0, 0, 0.04); --table-stripe: rgba(0, 0, 0, 0.04);
--table-hover: rgba(94, 129, 172, 0.12); --table-hover: rgba(94, 129, 172, 0.12);
--table-rowlabel-bg: rgba(0, 0, 0, 0.05); --table-rowlabel-bg: rgba(0, 0, 0, 0.05);
--table-rowlabel-text: #1c2d28; --table-rowlabel-text: #2D1A1D;
} }
.ck-content table, .ck-content table,
@@ -1326,7 +1326,7 @@ html.theme-light {
} }
.note-state i { .note-state i {
color: #a99b7a; color: #8f7a67;
} }
.note-state.state-draft { .note-state.state-draft {
@@ -1342,7 +1342,7 @@ html.theme-light {
} }
.note-state.state-review i { .note-state.state-review i {
color: #77838a; color: #cf90a2;
} }
.note-state.state-unknown { .note-state.state-unknown {
@@ -1350,81 +1350,81 @@ html.theme-light {
} }
.note-state.state-unknown i { .note-state.state-unknown i {
color: #F44336; color: #d78a6f;
} }
/* ---------- Peppige Garden-Badges (dark) ---------- */ /* ---------- Peppige Garden-Badges (dark) ---------- */
html.theme-dark .note-state { html.theme-dark .note-state {
background: rgba(169, 155, 122, 0.40); background: rgba(169, 155, 122, 0.40);
border: 1px solid #a99b7a; border: 1px solid #8f7a67;
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state i { html.theme-dark .note-state i {
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state.state-draft { html.theme-dark .note-state.state-draft {
background: rgba(244, 67, 54, 0.85); background: rgba(244, 67, 54, 0.85);
border-color: #ff8a7f; border-color: #e8a086;
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state.state-draft i { html.theme-dark .note-state.state-draft i {
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state.state-review { html.theme-dark .note-state.state-review {
background: rgba(76, 108, 148, 0.85); background: rgba(76, 108, 148, 0.85);
border-color: #8fb4e0; border-color: #e0a3b3;
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state.state-review i { html.theme-dark .note-state.state-review i {
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state.state-unknown { html.theme-dark .note-state.state-unknown {
background: rgba(225, 206, 152, 0.85); background: rgba(225, 206, 152, 0.85);
border-color: #f2e4b8; border-color: #ffe0a0;
color: #1b1b1b; color: #1d150f;
} }
html.theme-dark .note-state.state-unknown i { html.theme-dark .note-state.state-unknown i {
color: #1b1b1b; color: #1d150f;
} }
/* ---------- Peppige Garden-Badges (light) ---------- */ /* ---------- Peppige Garden-Badges (light) ---------- */
html.theme-light .note-state { html.theme-light .note-state {
background: rgba(85, 103, 83, 0.85); background: rgba(85, 103, 83, 0.85);
border: 1px solid #556753; border: 1px solid #4f6b00;
color: #dfe4c4; color: #E8E3C3;
} }
html.theme-light .note-state i { html.theme-light .note-state i {
color: #dfe4c4; color: #E8E3C3;
} }
html.theme-light .note-state.state-draft { html.theme-light .note-state.state-draft {
background: rgba(220, 129, 100, 0.95); background: rgba(220, 129, 100, 0.95);
border-color: #b85f3f; border-color: #8a3c2e;
color: #1c2d28; color: #2D1A1D;
} }
html.theme-light .note-state.state-draft i { html.theme-light .note-state.state-draft i {
color: #1c2d28; color: #2D1A1D;
} }
html.theme-light .note-state.state-review { html.theme-light .note-state.state-review {
background: rgba(94, 129, 172, 0.95); background: rgba(94, 129, 172, 0.95);
border-color: #3d5f8a; border-color: #6b2a3d;
color: #dfe4c4; color: #E8E3C3;
} }
html.theme-light .note-state.state-review i { html.theme-light .note-state.state-review i {
color: #dfe4c4; color: #E8E3C3;
} }
html.theme-light .note-state.state-unknown { html.theme-light .note-state.state-unknown {
background: rgba(177, 71, 82, 0.95); background: rgba(177, 71, 82, 0.95);
border-color: #8f3a40; border-color: #7a2b30;
color: #dfe4c4; color: #E8E3C3;
} }
html.theme-light .note-state.state-unknown i { html.theme-light .note-state.state-unknown i {
color: #dfe4c4; color: #E8E3C3;
} }
/* ---------- Code notes: always Harbordark like code boxes ---------- */ /* ---------- Code notes: always Harbordark like code boxes ---------- */
#content.type-code pre { #content.type-code pre {
background-color: #222222 !important; background-color: #2d2118 !important;
color: #efebdc; color: #f0e2d0;
border: 1px solid #2e2e2e; border: 1px solid #3a2a20;
border-radius: 8px; border-radius: 8px;
padding: 1em; padding: 1em;
margin: 1em 0; margin: 1em 0;
@@ -1432,18 +1432,18 @@ html.theme-light .note-state.state-unknown i {
#content.type-code code { #content.type-code code {
background-color: transparent !important; background-color: transparent !important;
color: #efebdc; color: #f0e2d0;
border: 0; border: 0;
} }
html.theme-light #content.type-code pre { html.theme-light #content.type-code pre {
background-color: #e8ecd0 !important; background-color: #eae6c9 !important;
color: #1c2d28; color: #2D1A1D;
border-color: #c3c9a6; border-color: #c5c1a6;
} }
html.theme-light #content.type-code code { html.theme-light #content.type-code code {
color: #1c2d28; color: #2D1A1D;
} }
/* ---------- Code: line numbers + copy button ---------- */ /* ---------- Code: line numbers + copy button ---------- */
pre.code-processed { pre.code-processed {
@@ -1594,49 +1594,49 @@ html.theme-light #content .hljs-ln tbody tr:hover td.col-hover {
pre, pre,
pre.code-processed .code-wrap, pre.code-processed .code-wrap,
.hljs-ln-code { .hljs-ln-code {
scrollbar-color: #2e2e2e #1b1b1b; scrollbar-color: #3a2a20 #1d150f;
} }
pre::-webkit-scrollbar-thumb, pre::-webkit-scrollbar-thumb,
pre.code-processed .code-wrap::-webkit-scrollbar-thumb, pre.code-processed .code-wrap::-webkit-scrollbar-thumb,
.hljs-ln-code::-webkit-scrollbar-thumb { .hljs-ln-code::-webkit-scrollbar-thumb {
background: #2e2e2e; background: #3a2a20;
} }
pre::-webkit-scrollbar-thumb:hover, pre::-webkit-scrollbar-thumb:hover,
pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover, pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover,
.hljs-ln-code::-webkit-scrollbar-thumb:hover { .hljs-ln-code::-webkit-scrollbar-thumb:hover {
background: #3f3f3f; background: #4a3a30;
} }
pre::-webkit-scrollbar-track, pre::-webkit-scrollbar-track,
pre.code-processed .code-wrap::-webkit-scrollbar-track, pre.code-processed .code-wrap::-webkit-scrollbar-track,
.hljs-ln-code::-webkit-scrollbar-track { .hljs-ln-code::-webkit-scrollbar-track {
background: #1b1b1b; background: #1d150f;
} }
html.theme-light pre, html.theme-light pre,
html.theme-light pre.code-processed .code-wrap, html.theme-light pre.code-processed .code-wrap,
html.theme-light .hljs-ln-code { html.theme-light .hljs-ln-code {
scrollbar-color: #b3ba96 #d0d6b4; scrollbar-color: #aeaa92 #eae6c9;
} }
html.theme-light pre::-webkit-scrollbar-thumb, html.theme-light pre::-webkit-scrollbar-thumb,
html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb, html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb,
html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb { html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb {
background: #b3ba96; background: #aeaa92;
} }
html.theme-light pre::-webkit-scrollbar-thumb:hover, html.theme-light pre::-webkit-scrollbar-thumb:hover,
html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover, html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover,
html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb:hover { html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb:hover {
background: #c3c9a6; background: #c5c1a6;
} }
html.theme-light pre::-webkit-scrollbar-track, html.theme-light pre::-webkit-scrollbar-track,
html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-track, html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-track,
html.theme-light .hljs-ln-code::-webkit-scrollbar-track { html.theme-light .hljs-ln-code::-webkit-scrollbar-track {
background: #d0d6b4; background: #eae6c9;
} }
/* ---------- Link icons / markers: internal links without arrow, external links keep a marker ---------- */ /* ---------- Link icons / markers: internal links without arrow, external links keep a marker ---------- */
@@ -1695,12 +1695,12 @@ html.theme-light .blog-pn {
.blog-pn:hover { .blog-pn:hover {
background: rgba(231, 90, 80, 0.18); background: rgba(231, 90, 80, 0.18);
border-color: #e75a50; border-color: #e0a15c;
} }
html.theme-light .blog-pn:hover { html.theme-light .blog-pn:hover {
background: rgba(76, 108, 148, 0.15); background: rgba(76, 108, 148, 0.15);
border-color: #4c6c94; border-color: #8e2d53;
} }
/* ---------- Mermaid diagrams - Harbor, theme-following ---------- */ /* ---------- Mermaid diagrams - Harbor, theme-following ---------- */
@@ -1728,29 +1728,29 @@ html.theme-dark .mermaid svg text,
html.theme-dark .mermaid svg tspan, html.theme-dark .mermaid svg tspan,
html.theme-dark .mermaid svg .nodeLabel, html.theme-dark .mermaid svg .nodeLabel,
html.theme-dark .mermaid svg .edgeLabel p { html.theme-dark .mermaid svg .edgeLabel p {
fill: #efebdc !important; fill: #f0e2d0 !important;
color: #efebdc !important; color: #f0e2d0 !important;
} }
html.theme-light .mermaid svg text, html.theme-light .mermaid svg text,
html.theme-light .mermaid svg tspan, html.theme-light .mermaid svg tspan,
html.theme-light .mermaid svg .nodeLabel, html.theme-light .mermaid svg .nodeLabel,
html.theme-light .mermaid svg .edgeLabel p { html.theme-light .mermaid svg .edgeLabel p {
fill: #1c2d28 !important; fill: #2D1A1D !important;
color: #1c2d28 !important; color: #2D1A1D !important;
} }
/* Graph/node title */ /* Graph/node title */
html.theme-dark .mermaid svg .titleText text, html.theme-dark .mermaid svg .titleText text,
html.theme-dark .mermaid svg .node .label .nodeLabel { html.theme-dark .mermaid svg .node .label .nodeLabel {
fill: #efebdc !important; fill: #f0e2d0 !important;
color: #efebdc !important; color: #f0e2d0 !important;
} }
html.theme-light .mermaid svg .titleText text, html.theme-light .mermaid svg .titleText text,
html.theme-light .mermaid svg .node .label .nodeLabel { html.theme-light .mermaid svg .node .label .nodeLabel {
fill: #1c2d28 !important; fill: #2D1A1D !important;
color: #1c2d28 !important; color: #2D1A1D !important;
} }
/* Node shapes (rectangles, rounded boxes, ellipses, diamonds) */ /* Node shapes (rectangles, rounded boxes, ellipses, diamonds) */
@@ -1760,8 +1760,8 @@ html.theme-dark .mermaid svg .node circle,
html.theme-dark .mermaid svg .node ellipse, html.theme-dark .mermaid svg .node ellipse,
html.theme-dark .mermaid svg .node path, html.theme-dark .mermaid svg .node path,
html.theme-dark .mermaid svg .cluster rect { html.theme-dark .mermaid svg .cluster rect {
fill: #232323 !important; fill: #2d2118 !important;
stroke: #77838a !important; stroke: #cf90a2 !important;
} }
html.theme-light .mermaid svg .node rect, html.theme-light .mermaid svg .node rect,
@@ -1770,8 +1770,8 @@ html.theme-light .mermaid svg .node circle,
html.theme-light .mermaid svg .node ellipse, html.theme-light .mermaid svg .node ellipse,
html.theme-light .mermaid svg .node path, html.theme-light .mermaid svg .node path,
html.theme-light .mermaid svg .cluster rect { html.theme-light .mermaid svg .cluster rect {
fill: #d0d6b4 !important; fill: #eae6c9 !important;
stroke: #4c6c94 !important; stroke: #8e2d53 !important;
} }
/* Rounded corners on rectangular node boxes and subgraph clusters (8 px, like the blog cards) */ /* Rounded corners on rectangular node boxes and subgraph clusters (8 px, like the blog cards) */
@@ -1786,101 +1786,101 @@ html.theme-light .mermaid svg .cluster rect {
/* Edge lines: stroke only (a filled edge path would look like a polygon) */ /* Edge lines: stroke only (a filled edge path would look like a polygon) */
html.theme-dark .mermaid svg .edgePaths path { html.theme-dark .mermaid svg .edgePaths path {
fill: none !important; fill: none !important;
stroke: #a99b7a !important; stroke: #8f7a67 !important;
} }
html.theme-light .mermaid svg .edgePaths path { html.theme-light .mermaid svg .edgePaths path {
fill: none !important; fill: none !important;
stroke: #7d8794 !important; stroke: #76756f !important;
} }
/* Arrowheads (markers): filled triangles */ /* Arrowheads (markers): filled triangles */
html.theme-dark .mermaid svg marker.flowchart-v2, html.theme-dark .mermaid svg marker.flowchart-v2,
html.theme-dark .mermaid svg .arrowMarkerPath { html.theme-dark .mermaid svg .arrowMarkerPath {
fill: #a99b7a !important; fill: #8f7a67 !important;
stroke: #a99b7a !important; stroke: #8f7a67 !important;
} }
html.theme-light .mermaid svg marker.flowchart-v2, html.theme-light .mermaid svg marker.flowchart-v2,
html.theme-light .mermaid svg .arrowMarkerPath { html.theme-light .mermaid svg .arrowMarkerPath {
fill: #7d8794 !important; fill: #76756f !important;
stroke: #7d8794 !important; stroke: #76756f !important;
} }
/* Edge labels: HTML text inside a foreignObject (div.labelBkg > span.edgeLabel); /* Edge labels: HTML text inside a foreignObject (div.labelBkg > span.edgeLabel);
the label panel background lives on the g.edgeLabel element itself */ the label panel background lives on the g.edgeLabel element itself */
html.theme-dark .mermaid svg g.edgeLabel { html.theme-dark .mermaid svg g.edgeLabel {
background: #1b1b1b !important; background: #1d150f !important;
fill: #efebdc !important; fill: #f0e2d0 !important;
color: #efebdc !important; color: #f0e2d0 !important;
} }
html.theme-dark .mermaid svg .edgeLabel .labelBkg { html.theme-dark .mermaid svg .edgeLabel .labelBkg {
fill: #1b1b1b !important; fill: #1d150f !important;
background: #1b1b1b !important; background: #1d150f !important;
color: #efebdc !important; color: #f0e2d0 !important;
} }
html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel { html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel {
fill: #efebdc !important; fill: #f0e2d0 !important;
color: #efebdc !important; color: #f0e2d0 !important;
background: #1b1b1b !important; background: #1d150f !important;
} }
html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel p { html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel p {
fill: #efebdc !important; fill: #f0e2d0 !important;
color: #efebdc !important; color: #f0e2d0 !important;
background: #1b1b1b !important; background: #1d150f !important;
} }
html.theme-light .mermaid svg g.edgeLabel { html.theme-light .mermaid svg g.edgeLabel {
background: #d0d6b4 !important; background: #eae6c9 !important;
fill: #1c2d28 !important; fill: #2D1A1D !important;
color: #1c2d28 !important; color: #2D1A1D !important;
} }
html.theme-light .mermaid svg .edgeLabel .labelBkg { html.theme-light .mermaid svg .edgeLabel .labelBkg {
fill: #d0d6b4 !important; fill: #eae6c9 !important;
background: #d0d6b4 !important; background: #eae6c9 !important;
color: #1c2d28 !important; color: #2D1A1D !important;
} }
html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel { html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel {
fill: #1c2d28 !important; fill: #2D1A1D !important;
color: #1c2d28 !important; color: #2D1A1D !important;
background: #d0d6b4 !important; background: #eae6c9 !important;
} }
html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel p { html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel p {
fill: #1c2d28 !important; fill: #2D1A1D !important;
color: #1c2d28 !important; color: #2D1A1D !important;
background: #d0d6b4 !important; background: #eae6c9 !important;
} }
/* Subgraph cluster border + label */ /* Subgraph cluster border + label */
html.theme-dark .mermaid svg .cluster rect { html.theme-dark .mermaid svg .cluster rect {
stroke: #2e2e2e !important; stroke: #3a2a20 !important;
fill: rgba(27, 27, 27, 0.35) !important; fill: rgba(27, 27, 27, 0.35) !important;
} }
html.theme-light .mermaid svg .cluster rect { html.theme-light .mermaid svg .cluster rect {
stroke: #c3c9a6 !important; stroke: #c5c1a6 !important;
fill: rgba(208, 214, 180, 0.40) !important; fill: rgba(208, 214, 180, 0.40) !important;
} }
html.theme-dark .mermaid svg .cluster .nodeLabel, html.theme-dark .mermaid svg .cluster .nodeLabel,
html.theme-dark .mermaid svg .cluster-label text { html.theme-dark .mermaid svg .cluster-label text {
fill: #a99b7a !important; fill: #8f7a67 !important;
color: #a99b7a !important; color: #8f7a67 !important;
} }
html.theme-light .mermaid svg .cluster .nodeLabel, html.theme-light .mermaid svg .cluster .nodeLabel,
html.theme-light .mermaid svg .cluster-label text { html.theme-light .mermaid svg .cluster-label text {
fill: #556753 !important; fill: #4f6b00 !important;
color: #556753 !important; color: #4f6b00 !important;
} }
/* ---------- G-code / Zusatz-Scopes (name = G/M-Codes, attr = Parameter) ---------- */ /* ---------- G-code / Zusatz-Scopes (name = G/M-Codes, attr = Parameter) ---------- */
.hljs-name { color: #E1CE98; } .hljs-name { color: #ffda92; }
.hljs-attr { color: #77838a; } .hljs-attr { color: #cf90a2; }
html.theme-light .hljs-name { color: #4c6c94; } html.theme-light .hljs-name { color: #8e2d53; }
html.theme-light .hljs-attr { color: #556753; } html.theme-light .hljs-attr { color: #4f6b00; }