From 914171274b992b026b37fe3fa787964637aa044b Mon Sep 17 00:00:00 2001 From: trilium-share-gruvbox Date: Mon, 7 Sep 2026 21:33:22 +0200 Subject: [PATCH] Add Solarized and Tokyo Night blog themes with palettes and docs --- README.md | 14 +- THIRD_PARTY_LICENSES.md | 12 +- assets/palette-solarized.png | Bin 0 -> 24461 bytes assets/palette-tokyonight.png | Bin 0 -> 23941 bytes docs/switch-blog-theme.md | 2 + theme/blog_share_theme_solarized.css | 1891 +++++++++++++++++++++++++ theme/blog_share_theme_tokyonight.css | 1891 +++++++++++++++++++++++++ 7 files changed, 3806 insertions(+), 4 deletions(-) create mode 100644 assets/palette-solarized.png create mode 100644 assets/palette-tokyonight.png create mode 100644 theme/blog_share_theme_solarized.css create mode 100644 theme/blog_share_theme_tokyonight.css diff --git a/README.md b/README.md index 247322a..dfb39de 100644 --- a/README.md +++ b/README.md @@ -28,12 +28,16 @@ pointing the `shareCss` relation at the matching note – see | Theme | File | Palette (dark / light) | Source | |---|---|---|---| | **Coffee** (active by default) | `theme/blog_share_theme_coffee.css` | espresso `#1d150f` / latte-cream `#f0e2d0`, caramel `#e0a15c` · cream `#E8E3C3` / ink `#2D1A1D`, berry `#8e2d53` | [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (MIT) | -| **Harbor** | `theme/blog_share_theme_harbor.css` | near-black `#1b1b1b` / cream `#efebdc`, coral `#e75a50` · paper `#dfe4c4` / ink `#1c2d28`, nord-blue `#5e81ac` | [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (MIT) | +| **Harbor** | `theme/blog_share_theme_harbor.css` | near-black `#1b1b1b` / cream `#efebdc`, coral `#e75a50` · paper `#dfe4c4` / ink `#1c2d28`, nord-blue `#5e81ac` | [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbordark-theme) (MIT) | | **Gruvbox** | `theme/blog_share_theme_gruvbox.css` | bg `#282828` / fg `#ebdbb2`, accents red/green/yellow/blue | [morhetz/gruvbox](https://github.com/morhetz/gruvbox) (MIT) | +| **Solarized** | `theme/blog_share_theme_solarized.css` | bg `#002b36` / fg `#839496`, blue `#268bd2` cyan `#2aa198` · bg `#fdf6e3` / fg `#657b83` | [Solarized by Ethan Schoonover](https://ethanschoonover.com/solarized/) (MIT) | +| **Tokyo Night** | `theme/blog_share_theme_tokyonight.css` | storm `#24283b` / fg `#c0caf5`, blue `#7aa2f7` · day `#e1e2e7` / fg `#3760bf` | [tokyonight.nvim](https://github.com/folke/tokyonight.nvim) (Apache-2.0) | ![Coffee palette](assets/palette-coffee.png) ![Harbor palette](assets/palette-harbor.png) ![Gruvbox palette](assets/palette-gruvbox.png) +![Solarized palette](assets/palette-solarized.png) +![Tokyo Night palette](assets/palette-tokyonight.png) ## Features @@ -83,6 +87,8 @@ pointing the `shareCss` relation at the matching note – see | `theme/blog_share_theme_coffee.css` | Coffee / Coffee Latte share theme (active by default) | code, `text/css` | | `theme/blog_share_theme_harbor.css` | Harbor / Harbordark share theme | code, `text/css` | | `theme/blog_share_theme_gruvbox.css` | Gruvbox light/dark share theme | code, `text/css` | +| `theme/blog_share_theme_solarized.css` | Solarized dark/light share theme | code, `text/css` | +| `theme/blog_share_theme_tokyonight.css` | Tokyo Night (storm/day) share theme | code, `text/css` | | `theme/favicon.svg` | default site favicon | code (SVG) | | `theme/cookie.woff2` | "Cookie" font for the Buy me a coffee button | file, `font/woff2` | | `lib/highlight.js` | vendored highlight.js | code, `application/javascript` | @@ -143,6 +149,8 @@ Under **`.blog`** create one code note per file, using the file name as the note | `blog_share_theme_coffee.css` | `theme/blog_share_theme_coffee.css` | `text/css` | | `blog_share_theme_harbor.css` | `theme/blog_share_theme_harbor.css` | `text/css` | | `blog_share_theme_gruvbox.css` | `theme/blog_share_theme_gruvbox.css` | `text/css` | +| `blog_share_theme_solarized.css` | `theme/blog_share_theme_solarized.css` | `text/css` | +| `blog_share_theme_tokyonight.css` | `theme/blog_share_theme_tokyonight.css` | `text/css` | | `favicon` | `theme/favicon.svg` | – (SVG) | | `Cookie` | `theme/cookie.woff2` | `font/woff2` (file note) | | `highlight.js` | `lib/highlight.js` | `application/javascript` | @@ -315,7 +323,7 @@ server { ## Customisation -- **Theme**: pick one of `theme/blog_share_theme_{coffee,harbor,gruvbox}.css` and point the blog's +- **Theme**: pick one of `theme/blog_share_theme_{coffee,harbor,gruvbox,solarized,tokyonight}.css` and point the blog's `shareCss` relation at it – see [`docs/switch-blog-theme.md`](docs/switch-blog-theme.md). Each theme ships dark + light via `html.theme-light/dark`. The 3D viewer and Mermaid rendering read the theme's CSS variables, so they adapt automatically to whichever theme is active. @@ -330,6 +338,6 @@ This project is licensed under the **GNU General Public License v3.0** – see [ The repository also contains third-party assets that keep their own licenses: `lib/highlight.js` (BSD-3-Clause), `lib/hljs_line_numbers.js` (MIT), -`theme/cookie.woff2` (SIL OFL 1.1), the three palette images `assets/palette-*.png` (MIT) and the embedded +`theme/cookie.woff2` (SIL OFL 1.1), the palette images `assets/palette-*.png` (MIT) and the embedded Trilium logo in `scripts/bmc_button.js` (AGPL-3.0). See [`THIRD_PARTY_LICENSES.md`](THIRD_PARTY_LICENSES.md) for details. \ No newline at end of file diff --git a/THIRD_PARTY_LICENSES.md b/THIRD_PARTY_LICENSES.md index 2dfb65b..1872d7b 100644 --- a/THIRD_PARTY_LICENSES.md +++ b/THIRD_PARTY_LICENSES.md @@ -14,6 +14,10 @@ The following files in this repository are **not** covered by the GPL-3.0 and ke | `theme/blog_share_theme_coffee.css` | Coffee / Coffee Latte color scheme from [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (repo: MIT) | [MIT](#mit-license) | | `theme/blog_share_theme_harbor.css` | Harbor / 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_gruvbox.css` | Gruvbox color scheme from [morhetz/gruvbox](https://github.com/morhetz/gruvbox) (repo: MIT) | [MIT](#mit-license) | +| `theme/blog_share_theme_solarized.css` | Solarized color scheme by [Ethan Schoonover](https://ethanschoonover.com/solarized/) | [MIT](#mit-license) | +| `theme/blog_share_theme_tokyonight.css` | Tokyo Night color scheme from [folke/tokyonight.nvim](https://github.com/folke/tokyonight.nvim) | [Apache-2.0](#apache-2.0) | +| `assets/palette-solarized.png` | Solarized palette image (Ethan Schoonover) | [MIT](#mit-license) | +| `assets/palette-tokyonight.png` | Tokyo Night palette image from [folke/tokyonight.nvim](https://github.com/folke/tokyonight.nvim) | [Apache-2.0](#apache-2.0) | | `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-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) | @@ -98,4 +102,10 @@ the WASM blob is loaded at runtime by `scripts/3d_model_viewer.js` and is not st The Trilium logo embedded in `scripts/bmc_button.js` belongs to the Trilium / TriliumNext project and is used under the terms of the GNU Affero General -Public License v3.0 (). \ No newline at end of file +Public License v3.0 (). +## Apache-2.0 + +The Tokyo Night color scheme (in `theme/blog_share_theme_tokyonight.css` and +`assets/palette-tokyonight.png`) is derived from +[tokyonight.nvim](https://github.com/folke/tokyonight.nvim) and used under the +Apache License 2.0 (). diff --git a/assets/palette-solarized.png b/assets/palette-solarized.png new file mode 100644 index 0000000000000000000000000000000000000000..5269e14727b8111f29253c547adda0f24dc21909 GIT binary patch literal 24461 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∾z?o~5gVEc$k!xo6jY(f1xjTnxu8s|@>k+# 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 Co6&s$ literal 0 HcmV?d00001 diff --git a/docs/switch-blog-theme.md b/docs/switch-blog-theme.md index 7847be3..654ee59 100644 --- a/docs/switch-blog-theme.md +++ b/docs/switch-blog-theme.md @@ -12,6 +12,8 @@ note IDs are given for reference. | 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** overlays and **Mermaid** rendering. The 3D viewer reads the theme's CSS variables diff --git a/theme/blog_share_theme_solarized.css b/theme/blog_share_theme_solarized.css new file mode 100644 index 0000000..6eb209a --- /dev/null +++ b/theme/blog_share_theme_solarized.css @@ -0,0 +1,1891 @@ +/* + * Solarized Share Theme (light/dark) + * Solarized by Ethan Schoonover (https://ethanschoonover.com/solarized/, MIT) + */ + +/* + * Harbor Share Theme for Richard's Blog (Trilium Public Share) + * Light: Harbor (paper #fdf6e3 / ink #657b83, accent #268bd2) + * Dark: Harbordark (#002b36 / #839496, accent #268bd2) + * Based on https://github.com/HANCORE-linux/omarchy-harbor-theme (MIT) + */ + +html.theme-light { + --background-primary: #fdf6e3; + --background-secondary: #eee8d5; + --background-highlight: #93a1a1; + --background-active: #268bd2; + --blog-card-bg: #eee8d5; + --scrollbar-thumb: #93a1a1; + --scrollbar-hover: #93a1a1; + --scrollbar-track: #eee8d5; + --text-primary: #657b83; + --text-heading: #657b83; + --text-menu: #586e75; + --text-link: #268bd2; + --text-menu-active: #fdf6e3; + color-scheme: light; +} + +html.theme-dark { + --background-primary: #002b36; + --background-secondary: #073642; + --background-highlight: #073642; + --background-active: #268bd2; + --blog-card-bg: #073642; + --scrollbar-thumb: #073642; + --scrollbar-hover: #073642; + --scrollbar-track: #002b36; + --text-primary: #839496; + --text-heading: #839496; + --text-menu: #859900; + --text-link: #268bd2; + --text-menu-active: #002b36; + color-scheme: dark; +} + +body { + font-family: "Inter", "Montserrat", "Lucida Grande", "Lucida Sans Unicode", arial, sans-serif; +} + +/* ---------- Header: Logo durch Laptop-Emoji ---------- */ +#header-logo img { + display: none; +} + +#header-logo::before { + content: "💻"; + font-size: 1.5em; + line-height: 1; + margin-right: 8px; + display: inline-block; + vertical-align: middle; +} + +/* ---------- Buy Me a Coffee (original, lokal) ---------- */ +@font-face { + font-family: "Cookie"; + src: url(/api/notes/__COOKIE_FONT_ID__/download) format("woff2"); + font-weight: 400; + font-display: swap; +} + +#bmc-links { + margin-top: auto; + padding: 8px 25px 4px; + background: var(--background-secondary); + display: flex; + flex-direction: column; + gap: 2px; +} + +.bmc-link { + display: flex; + align-items: center; + gap: 8px; + padding: 4px 6px 4px 24px; + border-radius: 6px; + color: var(--text-heading); + text-decoration: none; + font-size: 0.9em; + transition: background-color 150ms ease, color 150ms ease; +} + +.bmc-link:hover { + background: var(--background-highlight); + color: var(--text-heading); + text-decoration: none; +} + +.bmc-link .tn-icon { + color: var(--text-link); +} + +/* ---------- Menu: wie Footer-Links gestalten ---------- */ +#menu a { + color: var(--text-heading); + gap: 8px; + font-size: 0.9em; + padding: 4px 6px; + border-color: transparent; + transition: background-color 150ms ease, color 150ms ease; +} + +#menu a:hover { + background: var(--background-highlight); + color: var(--text-heading); + border-color: transparent; + text-decoration: none; +} + +#menu a.active { + background: var(--background-active); + color: var(--background-secondary); + border-color: transparent; +} + +#menu .tn-icon { + color: var(--text-link); +} + +#bmc-wrap { + padding: 8px 14px 14px; + background: var(--background-secondary); + border-top: 1px solid var(--background-highlight); +} + +.bmc-btn { + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + width: 100%; + box-sizing: border-box; + padding: 6px 12px 8px; + border-radius: 8px; + background: #fabd2f; + color: #657b83; + border: 2px solid #657b83; + font-family: "Cookie", "Brush Script MT", cursive; + font-size: 1.4em; + line-height: 1.1; + text-decoration: none; + transition: background-color 150ms ease, transform 150ms ease; +} + +.bmc-btn:hover { + background: #cb4b16; + color: #657b83; + text-decoration: none; + transform: translateY(-1px); +} + +.bmc-btn .bmc-emoji { + font-size: 1.15em; +} + +.bmc-copyright { + margin-top: 8px; + font-size: 0.75em; + color: var(--text-menu); + display: flex; + align-items: center; + justify-content: center; + gap: 4px; + flex-wrap: wrap; +} + +.bmc-powered { + display: inline-flex; + align-items: center; + gap: 3px; + color: var(--text-menu); + text-decoration: none; + transition: color 150ms ease; +} + +.bmc-powered:hover { + color: var(--text-link); + text-decoration: none; +} + +.powered-logo { + width: 1em; + height: 1em; + display: inline-block; +} + +/* ---------- Reading time ---------- */ +.reading-time { + font-size: 0.8em; + color: var(--text-menu); + margin: -0.9em 0 1.25em; +} + +/* ---------- Blog pagination ---------- */ +.blog-pagination { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + margin: 1.5em 0 0; + padding-top: 1em; + border-top: 1px solid var(--background-highlight); +} + +.blog-pagination .blog-page-num { + font-size: 0.85em; + color: var(--text-menu); +} + +/* ---------- Share footer navigation (built-in prev/next) ausblenden ---------- */ +#content-footer .navigation { + display: none; +} + +/* ---------- Prev/Next ---------- */ +.blog-prevnext { + display: flex; + justify-content: space-between; + gap: 12px; + margin: 1.5em 0 0; + padding-top: 1em; + border-top: 1px solid var(--background-highlight); +} + +.blog-pn { + display: flex; + flex-direction: column; + gap: 2px; + max-width: 45%; + color: var(--text-heading); + text-decoration: none; + transition: color 150ms ease; +} + +.blog-pn.next { + margin-left: auto; + align-items: flex-end; + text-align: right; +} + +.blog-pn-label { + font-size: 0.72em; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--text-menu); +} + +.blog-pn:hover { + color: var(--text-link); + text-decoration: none; +} + +.blog-pn.empty { + display: none; +} + +/* ---------- Search ---------- */ +.blog-search { + margin: 0.5em 0 1em; +} + +.blog-search-input { + width: 100%; + box-sizing: border-box; + padding: 10px 14px; + border-radius: 8px; + border: 1px solid var(--background-highlight); + background: var(--background-secondary); + color: var(--text-heading); + font-size: 1em; +} + +.blog-search-input:focus { + outline: none; + border-color: var(--text-link); +} + +.blog-search-list { + list-style: none; + padding: 0; + margin: 1em 0 0; +} + +.blog-search-hit { + display: flex; + flex-direction: column; + gap: 2px; + padding: 8px 12px; + border-radius: 8px; + border: 1px solid var(--background-highlight); + background: var(--blog-card-bg); + color: var(--text-heading); + text-decoration: none; + margin-bottom: 8px; + transition: border-color 150ms ease; +} + +.blog-search-hit:hover { + border-color: var(--text-link); + text-decoration: none; +} + +.blog-search-path { + font-size: 0.8em; + color: var(--text-menu); +} + +.blog-search-none { + color: var(--text-menu); +} + +/* ---------- Header-Suche (ersetzt eingebaute) ---------- */ +.search-item { + position: relative; +} + +.blog-search-header-input { + flex: 1; + min-width: 0; + padding: 6px 10px 6px 32px; + border-radius: 6px; + border: 1px solid rgba(131, 148, 150, 0.55); + background: rgba(131, 148, 150, 0.10); + color: var(--text-heading); + font-size: 0.9em; + transition: border-color 150ms ease, box-shadow 150ms ease; +} + +html.theme-light .blog-search-header-input { + border-color: #268bd2; + background: rgba(38, 107, 210, 0.10); +} + +.blog-search-header-input:focus { + outline: none; + border-color: #839496; + box-shadow: 0 0 0 2px rgba(131, 148, 150, 0.20); +} + +html.theme-light .blog-search-header-input:focus { + border-color: #268bd2; + box-shadow: 0 0 0 2px rgba(38, 107, 210, 0.15); +} + +.search-item .search-icon { + color: rgba(131, 148, 150, 0.85); +} + +html.theme-light .search-item .search-icon { + color: #268bd2; +} + +.tn-image { + width: 18px; + height: 18px; + border-radius: 4px; + flex-shrink: 0; + vertical-align: middle; +} + +.tn-image-svg { + color: var(--text-link); +} + +.title-image { + width: 34px; + height: 34px; + border-radius: 6px; + vertical-align: middle; + margin-right: 10px; +} + +.note-fallback { + margin: 1em 0; + overflow: hidden; +} + +.note-fallback-link { + font-size: 0.9em; +} + +.mermaid-fallback { + margin: 1em 0; +} + +.mermaid-render { + margin: 1em 0; + padding: 14px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow-x: auto; +} + +.mermaid-render svg { + max-width: 100%; + height: auto; +} + +.mermaid-source { + margin: 12px 0 0; + text-align: center; +} + +.mermaid-source summary { + cursor: pointer; + font-size: 0.85em; + color: var(--text-menu); + user-select: none; + padding: 4px 10px; + border: 1px solid var(--background-highlight); + border-radius: 6px; + display: inline-block; + background: var(--background-secondary); +} + +.mermaid-source summary:hover { + color: var(--text-heading); + border-color: var(--text-link); +} + +.mermaid-source pre { + width: min(100%, 820px); + margin: 8px auto 0; + text-align: left; + position: relative; + overflow: hidden; +} + +#content .mermaid-source .hljs-ln { + width: 100%; +} + +/* ---------- Rendered widgets: mind map + excalidraw ---------- */ +.mindmap-render, +.excalidraw-render { + margin: 1em 0; + padding: 14px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow-x: auto; +} + +.mindmap-svg { + display: block; + width: 100%; + height: auto; +} + +.excalidraw-svg { + display: block; + max-width: 100%; + height: auto; +} + +.mindmap-render svg text { + user-select: none; +} + +.blog-search-overlay { + display: none; + position: absolute; + top: calc(100% + 4px); + left: 0; + right: 0; + z-index: 50; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow: hidden; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); +} + +.blog-search-overlay.open { + display: block; +} + +.blog-search-overlay-hit { + display: flex; + flex-direction: column; + gap: 1px; + padding: 7px 10px; + color: var(--text-heading); + text-decoration: none; + font-size: 0.85em; + border-bottom: 1px solid var(--background-highlight); +} + +.blog-search-overlay-hit:last-child { + border-bottom: none; +} + +.blog-search-overlay-hit:hover { + background: var(--background-highlight); + text-decoration: none; +} + +.blog-search-overlay-hit .s { + font-size: 0.75em; + color: var(--text-menu); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.blog-search-overlay .blog-search-none { + padding: 8px 10px; + font-size: 0.85em; +} + +#main { + max-width: min(92vw, 1200px); +} + +#site-header { + padding-bottom: 10px; +} + +#title { + font-family: "JetBrains Mono", "Montserrat", monospace; + letter-spacing: -0.02em; +} + +body.is-garden #title { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; +} + +body.is-garden #title .note-state { + margin-left: auto; + flex-shrink: 0; +} + +body.is-garden #content h1#title { + background-color: rgba(133, 153, 0, 0.30) !important; + border-bottom-color: rgba(133, 153, 0, 0.60) !important; +} + +html.theme-light body.is-garden #content h1#title { + background-color: rgba(88, 110, 117, 0.15) !important; + border-bottom-color: rgba(88, 110, 117, 0.40) !important; +} + +/* ---------- Blog index (generated article list) ---------- */ +.blog-post { + padding: 1.2em 1.4em; + margin-bottom: 1.25em; + border: 1px solid var(--background-highlight); + border-radius: 10px; + background: var(--blog-card-bg); + transition: border-color 150ms ease, box-shadow 150ms ease; + cursor: pointer; +} + +.blog-post:last-child { + margin-bottom: 0; +} + +.blog-post:hover { + border-color: var(--text-link); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18); +} + +#content .blog-post:first-of-type { + margin-top: 1.5em; +} + +/* ---------- Blog post thumbnails (Bild links, Teaser rechts) ---------- */ +.blog-post-inner { + display: flex; + gap: 16px; + align-items: stretch; +} + +.blog-thumb-link { + flex: 0 0 auto; + width: min(256px, 35%); + text-decoration: none; +} + +.blog-thumb { + display: block; + width: 100%; + height: 100%; + max-height: 256px; + object-fit: cover; + border-radius: 8px; + border: 1px solid var(--background-highlight); +} + +.blog-post-body { + flex: 1; + min-width: 0; +} + +.blog-post-title { + margin: 0 0 0.25em; +} + +.blog-post-title a { + color: var(--text-heading); + text-decoration: none; + transition: color 150ms ease; +} + +.blog-post-title a:hover { + color: var(--text-link); + text-decoration: none; +} + +.blog-post-meta { + display: flex; + gap: 12px; + font-size: 0.85em; + color: var(--text-menu); + margin-bottom: 0.5em; +} + +.blog-post-date { + font-variant-numeric: tabular-nums; + opacity: 0.85; +} + +.blog-post-category { + background: var(--background-highlight); + border-radius: 8px; + padding: 1px 10px; + color: var(--text-heading); + font-weight: 600; +} + +.blog-post-summary { + margin: 0 0 0.5em; + color: var(--text-primary); +} + +.blog-post-tags { + display: flex; + flex-wrap: wrap; + gap: 6px; +} + +.tag { + font-size: 0.78em; + color: var(--text-link); + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + padding: 1px 8px; +} + +a.tag { + text-decoration: none; + transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; +} + +a.tag:hover { + background: var(--background-highlight); + border-color: var(--text-link); + color: var(--text-heading); + text-decoration: none; +} + +/* ---------- Article meta (date/category on individual pages) ---------- */ +.article-meta { + display: flex; + gap: 12px; + font-size: 0.9em; + color: var(--text-menu); + margin-bottom: 1em; + padding-bottom: 1em; + border-bottom: 1px solid var(--background-highlight); +} + +/* ---------- Headings (h2-h6) - Harbor header boxes ---------- */ +html.theme-dark { + --header-h2-bg: rgba(38, 107, 210, 0.30); + --header-h2-border: rgba(38, 107, 210, 0.6); + --header-h3-bg: rgba(133, 153, 0, 0.25); + --header-h3-border: rgba(133, 153, 0, 0.6); + --header-h4-bg: rgba(181, 137, 0, 0.22); + --header-h4-border: rgba(181, 137, 0, 0.55); + --header-h5-bg: rgba(131, 148, 150, 0.25); + --header-h5-border: rgba(131, 148, 150, 0.6); + --header-h6-bg: rgba(229, 137, 128, 0.25); + --header-h6-border: rgba(229, 137, 128, 0.6); + --header-h1-bg: rgba(220, 50, 47, 0.30); + --header-h1-border: rgba(220, 50, 47, 0.6); +} + +html.theme-light { + --header-h2-bg: rgba(38, 107, 210, 0.18); + --header-h2-border: rgba(38, 107, 210, 0.45); + --header-h3-bg: rgba(88, 110, 117, 0.14); + --header-h3-border: rgba(88, 110, 117, 0.38); + --header-h4-bg: rgba(203, 75, 22, 0.14); + --header-h4-border: rgba(203, 75, 22, 0.38); + --header-h5-bg: rgba(211, 54, 130, 0.12); + --header-h5-border: rgba(211, 54, 130, 0.35); + --header-h6-bg: rgba(42, 161, 152, 0.12); + --header-h6-border: rgba(42, 161, 152, 0.35); + --header-h1-bg: rgba(220, 50, 47, 0.14); + --header-h1-border: rgba(220, 50, 47, 0.40); +} + +#content h1 { + background-color: var(--header-h1-bg); + border-bottom: 2px solid var(--header-h1-border); + border-radius: 4px; + padding: 0.3em 0.4em; + font-size: 1.6em; + font-weight: 700; + margin-top: 1.5em; + margin-bottom: 1.25em; +} + +#content h2 { + background-color: var(--header-h2-bg); + border-bottom: 2px solid var(--header-h2-border); + border-radius: 4px; + padding: 0.25em 0.4em; +} + +#content h3 { + background-color: var(--header-h3-bg); + border-bottom: 2px solid var(--header-h3-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#content h4 { + background-color: var(--header-h4-bg); + border-bottom: 2px solid var(--header-h4-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#content h5 { + background-color: var(--header-h5-bg); + border-bottom: 2px solid var(--header-h5-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#content h6 { + background-color: var(--header-h6-bg); + border-bottom: 2px solid var(--header-h6-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#childLinks { + display: none; +} + +#index { + display: none; +} + +/* ---------- Code blocks - Harbordark (always, also in light mode) ---------- */ +.ck-content pre, +#content pre { + background-color: #073642; + color: #839496; + border: 1px solid #073642; + border-radius: 8px; +} + +.ck-content code, +#content code { + background-color: #073642; + color: #839496; + border-color: #073642; + border-radius: 8px; + padding: 0.1em 0.35em; +} + +html.theme-light .ck-content pre, +html.theme-light #content pre { + background-color: #eee8d5; + color: #657b83; + border-color: #93a1a1; +} + +html.theme-light .ck-content code, +html.theme-light #content code { + background-color: #eee8d5; + color: #657b83; + border-color: #93a1a1; +} + +/* ---------- Eingebettete Bilder: Radius wie Code-Blöcke (8px) ---------- */ +#content figure.image { + margin: 1.25em auto; +} + +#content figure img, +#content img:not(.blog-thumb) { + border-radius: 8px; +} + +/* ---------- 3D model viewer (STL / STEP) ---------- */ +.model-viewer { + position: relative; + box-sizing: border-box; + width: calc(100vw - 24px); + margin: 1em 0; + margin-left: calc(50% - (100vw - 24px) / 2); + background: #002b36; + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow: hidden; +} + +.model-viewer.model-viewer-inline { + width: 100%; + margin-left: 0; +} + +.model-viewer-data { + position: absolute; + top: 8px; + right: 10px; + z-index: 3; + display: none; + font-size: 0.75em; + color: #859900; + background: rgba(0, 43, 54, 0.85); + border: 1px solid #073642; + border-radius: 6px; + padding: 2px 10px; + font-variant-numeric: tabular-nums; + pointer-events: none; +} + +.model-viewer-canvas { + position: relative; + width: 100%; + height: min(70vh, 900px); + min-height: 420px; +} + +.model-viewer-status { + position: absolute; + inset: 0; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + padding: 48px; + box-sizing: border-box; + color: #859900; + font-size: 0.9em; +} + +.model-viewer-status.error { + color: #dc322f; +} + +.model-viewer-progress { + position: absolute; + left: 0; + right: 0; + bottom: 40px; + height: 6px; + width: min(60%, 480px); + margin: 0 auto; + background: #073642; + border-radius: 3px; + overflow: hidden; +} + +.model-viewer-progress-fill { + height: 100%; + width: 0; + background: #b58900; + border-radius: 3px; + transition: width 150ms ease; +} + +.model-viewer-progress-fill.indeterminate { + width: 40%; + animation: model-progress 1.1s ease-in-out infinite; +} + +@keyframes model-progress { + 0% { transform: translateX(-100%); } + 100% { transform: translateX(250%); } +} + +.model-viewer-hint { + position: absolute; + top: 8px; + left: 10px; + font-size: 0.75em; + color: #859900; + z-index: 2; + pointer-events: none; +} + +.model-viewer-caption { + font-size: 0.85em; + font-style: italic; + color: var(--text-menu); + text-align: center; + padding: 4px 12px; + background: var(--background-secondary); + border-top: 1px solid var(--background-highlight); +} + +.model-viewer canvas { + display: block; + width: 100%; + height: 100%; +} + +/* ---------- 3D-Viewer: theme-bewusste Overlays ---------- */ +html.theme-light .model-viewer { + background: #eee8d5; +} +html.theme-light .model-viewer-status, +html.theme-light .model-viewer-hint, +html.theme-light .model-viewer-data { + color: #657b83; +} +html.theme-light .model-viewer-data { + background: rgba(253, 246, 227, 0.85); + border-color: #93a1a1; +} +html.theme-light .model-viewer-status.error { + color: #dc322f; +} +html.theme-light .model-viewer-progress { + background: #93a1a1; +} +html.theme-light .model-viewer-progress-fill { + background: #268bd2; +} + +/* ---------- Bildunterschriften (Harbor) ---------- */ +#content figcaption { + font-size: 0.85em; + font-style: italic; + color: var(--text-menu); + text-align: center; + margin-top: 8px; + padding: 4px 12px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + display: inline-block; +} + +.hljs { + background: #073642; + color: #839496; +} + +.hljs-comment, +.hljs-quote { + color: #586e75; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-subst { + color: #dc322f; +} + +.hljs-number, +.hljs-literal, +.hljs-variable, +.hljs-template-variable, +.hljs-tag .hljs-attr { + color: #268bd2; +} + +.hljs-string, +.hljs-doctag { + color: #859900; +} + +.hljs-title, +.hljs-section, +.hljs-selector-id { + color: #b58900; +} + +.hljs-type, +.hljs-class .hljs-title, +.hljs-attribute { + color: #839496; +} + +.hljs-symbol, +.hljs-bullet, +.hljs-link, +.hljs-meta, +.hljs-deletion, +.hljs-addition { + color: #268bd2; +} + +.hljs-built_in, +.hljs-builtin-name, +.hljs-params { + color: #839496; +} + +.hljs-emphasis { + font-style: italic; +} + +.hljs-strong { + font-weight: bold; +} +/* ---------- Light mode: Harbor light highlighter ---------- */ +html.theme-light .hljs, +html.theme-light pre code.hljs { + background: #eee8d5 !important; + color: #657b83; +} + +html.theme-light .hljs-comment, +html.theme-light .hljs-quote { + color: #93a1a1; +} + +html.theme-light .hljs-keyword, +html.theme-light .hljs-selector-tag, +html.theme-light .hljs-subst { + color: #dc322f; +} + +html.theme-light .hljs-number, +html.theme-light .hljs-literal, +html.theme-light .hljs-variable, +html.theme-light .hljs-template-variable, +html.theme-light .hljs-tag .hljs-attr { + color: #d33682; +} + +html.theme-light .hljs-string, +html.theme-light .hljs-doctag { + color: #586e75; +} + +html.theme-light .hljs-title, +html.theme-light .hljs-section, +html.theme-light .hljs-selector-id { + color: #cb4b16; +} + +html.theme-light .hljs-type, +html.theme-light .hljs-class .hljs-title, +html.theme-light .hljs-attribute { + color: #268bd2; +} + +html.theme-light .hljs-symbol, +html.theme-light .hljs-bullet, +html.theme-light .hljs-link, +html.theme-light .hljs-meta, +html.theme-light .hljs-deletion, +html.theme-light .hljs-addition { + color: #d33682; +} + +html.theme-light .hljs-built_in, +html.theme-light .hljs-builtin-name, +html.theme-light .hljs-params { + color: #2aa198; +} + +html.theme-light .hljs-regexp, +html.theme-light .hljs-operator, +html.theme-light .hljs-selector-attr, +html.theme-light .hljs-selector-pseudo, +html.theme-light .hljs-selector-class, +html.theme-light .hljs-template-tag { + color: #d33682; +} + +html.theme-light .hljs-name, +html.theme-light .hljs-tag { + color: #268bd2; +} + +html.theme-light .hljs-meta .hljs-string { + color: #586e75; +} +/* ---------- Admonitions (Trilium-style, gefüllt) ---------- */ +.admonition { + --accent-color: var(--background-highlight); + --admonition-bg: var(--background-secondary); + border: 1px solid var(--accent-color); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); + background: var(--admonition-bg); + border-radius: 0.5em; + padding: 1em; + padding-inline-start: 2.5em; + margin: 1.25em 0; + position: relative; + overflow: hidden; +} + +html.theme-dark .admonition.note { --admonition-bg: rgba(38, 107, 210, 0.16); } +html.theme-dark .admonition.tip { --admonition-bg: rgba(88, 110, 117, 0.16); } +html.theme-dark .admonition.important { --admonition-bg: rgba(211, 54, 130, 0.18); } +html.theme-dark .admonition.caution { --admonition-bg: rgba(220, 50, 47, 0.16); } +html.theme-dark .admonition.warning { --admonition-bg: rgba(203, 75, 22, 0.16); } +html.theme-dark .admonition { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); } + +html.theme-light .admonition.note { --admonition-bg: rgba(38, 107, 210, 0.18); } +html.theme-light .admonition.tip { --admonition-bg: rgba(88, 110, 117, 0.16); } +html.theme-light .admonition.important { --admonition-bg: rgba(211, 54, 130, 0.16); } +html.theme-light .admonition.caution { --admonition-bg: rgba(220, 50, 47, 0.16); } +html.theme-light .admonition.warning { --admonition-bg: rgba(203, 75, 22, 0.20); } + +.admonition p:last-child { + margin-bottom: 0; +} + +.admonition p, +.admonition h2 { + margin-top: 0; +} + +.admonition.note { --accent-color: #268bd2; } +.admonition.tip { --accent-color: #586e75; } +.admonition.important { --accent-color: #d33682; } +.admonition.caution { --accent-color: #dc322f; } +.admonition.warning { --accent-color: #cb4b16; } + +.admonition::before { + color: var(--accent-color); + font-family: boxicons !important; + position: absolute; + top: 1em; + inset-inline-start: 1em; +} + +.admonition.note::before { content: "\eb21"; } +.admonition.tip::before { content: "\ea0d"; } +.admonition.important::before { content: "\ea7c"; } +.admonition.caution::before { content: "\eac7"; } +.admonition.warning::before { content: "\eac5"; } +/* ---------- Tables (Harbor, theme-aware) ---------- */ +html.theme-dark { + --table-header-bg: rgba(38, 107, 210, 0.20); + --table-header-text: #839496; + --table-header-border: rgba(38, 107, 210, 0.45); + --table-stripe: rgba(255, 255, 255, 0.04); + --table-hover: rgba(38, 107, 210, 0.12); + --table-rowlabel-bg: rgba(255, 255, 255, 0.05); + --table-rowlabel-text: #839496; +} + +html.theme-light { + --table-header-bg: rgba(38, 107, 210, 0.16); + --table-header-text: #657b83; + --table-header-border: rgba(38, 107, 210, 0.40); + --table-stripe: rgba(0, 0, 0, 0.04); + --table-hover: rgba(38, 107, 210, 0.12); + --table-rowlabel-bg: rgba(0, 0, 0, 0.05); + --table-rowlabel-text: #657b83; +} + +.ck-content table, +#content table { + border-collapse: separate; + border-spacing: 0; + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow: hidden; + margin: 1em 0; +} + +.ck-content table th, +.ck-content table td, +#content table th, +#content table td { + border: none; + border-bottom: 1px solid var(--background-highlight); + border-right: 1px solid var(--background-highlight); + padding: 8px 12px; + text-align: left; + background-color: transparent !important; +} + +.ck-content table th:last-child, +.ck-content table td:last-child, +#content table th:last-child, +#content table td:last-child { + border-right: none; +} + +.ck-content table tr:last-child td, +#content table tr:last-child td { + border-bottom: none; +} + +.ck-content table thead th, +#content table thead th { + background-color: var(--table-header-bg) !important; + color: var(--table-header-text); + font-weight: 700; + border-bottom: 2px solid var(--table-header-border); +} + +.ck-content table tbody td:first-child, +#content table tbody td:first-child { + background-color: var(--table-rowlabel-bg) !important; + color: var(--table-rowlabel-text); + font-weight: 600; + white-space: nowrap; +} + +.ck-content table tbody tr:nth-child(even) td:not(:first-child), +#content table tbody tr:nth-child(even) td:not(:first-child) { + background-color: var(--table-stripe) !important; +} + +.ck-content table tbody tr:hover td, +#content table tbody tr:hover td { + background-color: rgba(38, 107, 210, 0.10) !important; +} + +.ck-content table .col-hover, +#content table .col-hover { + background-color: rgba(38, 107, 210, 0.10) !important; +} + +.ck-content table tbody tr:hover td.col-hover, +.ck-content table thead th.col-hover, +#content table tbody tr:hover td.col-hover, +#content table thead th.col-hover { + background-color: rgba(38, 107, 210, 0.18) !important; +} +/* ---------- Category subcategories ---------- */ +.blog-subcategories { + display: flex; + flex-wrap: wrap; + gap: 8px; + margin: 0 0 1.25em; +} + +.blog-subcategory { + display: inline-flex; + align-items: center; + gap: 6px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + padding: 4px 12px; + color: var(--text-heading); + text-decoration: none; + font-weight: 600; + transition: background-color 150ms ease, border-color 150ms ease; +} + +.blog-subcategory i { + color: var(--text-link); +} + +.blog-subcategory:hover { + background: var(--background-highlight); + border-color: var(--text-link); + color: var(--text-heading); + text-decoration: none; +} +/* ---------- Digital Garden note table ---------- */ +.blog-garden-table { + width: 100%; +} + +.blog-garden-table tbody td:first-child { + background: transparent !important; + font-weight: normal; +} + +.note-type { + display: inline-block; + font-size: 0.8em; + padding: 2px 10px; + border-radius: 8px; + background: var(--background-highlight); + color: var(--text-heading); + font-weight: 600; + text-transform: capitalize; + white-space: nowrap; +} +/* ---------- Digital Garden rows: clickable + sage hover ---------- */ +.blog-garden-table tbody tr { + cursor: pointer; +} + +#content .blog-garden-table tbody tr:hover td, +#content .blog-garden-table .col-hover { + background-color: rgba(133, 153, 0, 0.15) !important; +} + +#content .blog-garden-table tbody tr:hover td.col-hover { + background-color: rgba(133, 153, 0, 0.25) !important; +} +.note-state { + display: inline-flex; + align-items: center; + gap: 5px; + font-size: 0.8em; + padding: 2px 10px; + border-radius: 8px; + background: rgba(133, 153, 0, 0.20); + color: var(--text-heading); + font-weight: 600; + white-space: nowrap; +} + +.note-state i { + color: #859900; +} + +.note-state.state-draft { + background: rgba(101, 123, 131, 0.22); +} + +.note-state.state-draft i { + color: #657b83; +} + +.note-state.state-review { + background: rgba(131, 148, 150, 0.25); +} + +.note-state.state-review i { + color: #839496; +} + +.note-state.state-unknown { + background: rgba(220, 50, 47, 0.18); +} + +.note-state.state-unknown i { + color: #dc322f; +} + +/* ---------- Peppige Garden-Badges (dark) ---------- */ +html.theme-dark .note-state { + background: rgba(133, 153, 0, 0.40); + border: 1px solid #859900; + color: #002b36; +} +html.theme-dark .note-state i { + color: #002b36; +} +html.theme-dark .note-state.state-draft { + background: rgba(220, 50, 47, 0.85); + border-color: #dc322f; + color: #002b36; +} +html.theme-dark .note-state.state-draft i { + color: #002b36; +} +html.theme-dark .note-state.state-review { + background: rgba(38, 107, 210, 0.85); + border-color: #268bd2; + color: #002b36; +} +html.theme-dark .note-state.state-review i { + color: #002b36; +} +html.theme-dark .note-state.state-unknown { + background: rgba(181, 137, 0, 0.85); + border-color: #b58900; + color: #002b36; +} +html.theme-dark .note-state.state-unknown i { + color: #002b36; +} + +/* ---------- Peppige Garden-Badges (light) ---------- */ +html.theme-light .note-state { + background: rgba(88, 110, 117, 0.85); + border: 1px solid #586e75; + color: #fdf6e3; +} +html.theme-light .note-state i { + color: #fdf6e3; +} +html.theme-light .note-state.state-draft { + background: rgba(203, 75, 22, 0.95); + border-color: #cb4b16; + color: #657b83; +} +html.theme-light .note-state.state-draft i { + color: #657b83; +} +html.theme-light .note-state.state-review { + background: rgba(38, 107, 210, 0.95); + border-color: #268bd2; + color: #fdf6e3; +} +html.theme-light .note-state.state-review i { + color: #fdf6e3; +} +html.theme-light .note-state.state-unknown { + background: rgba(220, 50, 47, 0.95); + border-color: #dc322f; + color: #fdf6e3; +} +html.theme-light .note-state.state-unknown i { + color: #fdf6e3; +} +/* ---------- Code notes: always Harbordark like code boxes ---------- */ +#content.type-code pre { + background-color: #073642 !important; + color: #839496; + border: 1px solid #073642; + border-radius: 8px; + padding: 1em; + margin: 1em 0; +} + +#content.type-code code { + background-color: transparent !important; + color: #839496; + border: 0; +} + +html.theme-light #content.type-code pre { + background-color: #eee8d5 !important; + color: #657b83; + border-color: #93a1a1; +} + +html.theme-light #content.type-code code { + color: #657b83; +} +/* ---------- Code: line numbers + copy button ---------- */ +pre.code-processed { + position: relative; + display: flex; + align-items: flex-start; + line-height: 1.6; +} + +pre.code-processed .code-wrap { + flex: 1; + min-width: 0; + overflow-x: auto; + border-radius: 8px; +} + +pre.code-processed .code-wrap code { + display: block; + line-height: inherit; + padding: 0; + margin: 0; +} + +pre.code-processed .code-lines { + flex-shrink: 0; + user-select: none; + text-align: right; + padding: 0 12px 0 0; + margin: 0 12px 0 0; + border-right: 1px solid var(--background-highlight); + color: var(--text-menu); + white-space: pre; + font-family: "JetBrains Mono", Consolas, monospace; + font-size: 1em; + line-height: inherit; +} + +pre.code-processed .code-copy-btn, +.mermaid-source pre .code-copy-btn { + position: absolute; + top: 6px; + right: 6px; + z-index: 2; + font-size: 0.75em; + padding: 2px 10px; + border-radius: 6px; + border: 1px solid var(--background-highlight); + background: var(--background-secondary); + color: var(--text-heading); + cursor: pointer; + opacity: 0.6; + transition: opacity 150ms ease; +} + +pre.code-processed:hover .code-copy-btn, +.mermaid-source pre:hover .code-copy-btn { + opacity: 1; +} + +pre.code-processed .code-copy-btn:hover, +.mermaid-source pre .code-copy-btn:hover { + border-color: var(--text-link); + opacity: 1; +} +/* ---------- highlight.js line numbers ---------- */ +#content .hljs-ln { + border-collapse: collapse; + border: none !important; + box-shadow: none; + border-radius: 8px; + margin: 0; + width: auto; + line-height: 1.4; +} + +#content .hljs-ln td, +#content .hljs-ln th { + border: none !important; + background-color: transparent !important; + padding: 0; +} + +#content .hljs-ln tbody td:first-child, +#content .hljs-ln thead th:first-child { + background-color: transparent !important; +} + +#content .hljs-ln tbody tr:nth-child(even) td { + background-color: transparent !important; +} + +#content .hljs-ln .col-hover { + background-color: transparent !important; +} + +#content .hljs-ln tbody tr:hover td, +#content .hljs-ln tbody tr:hover td.col-hover { + background-color: rgba(38, 107, 210, 0.08) !important; +} + +html.theme-light #content .hljs-ln tbody tr:hover td, +html.theme-light #content .hljs-ln tbody tr:hover td.col-hover { + background-color: rgba(38, 107, 210, 0.08) !important; +} + +.hljs-ln-numbers { + user-select: none; + text-align: right; + padding-right: 12px !important; + padding-left: 4px; + border-right: 1px solid var(--background-highlight) !important; + color: var(--text-menu); + white-space: nowrap; + vertical-align: top; + font-family: "JetBrains Mono", Consolas, monospace; +} + +.hljs-ln-code { + padding-left: 12px !important; + white-space: pre; + vertical-align: top; +} +/* ---------- Scrollbars (Harbor) ---------- */ +::-webkit-scrollbar { + width: 12px; + height: 12px; +} + +::-webkit-scrollbar-track { + background: var(--scrollbar-track); +} + +::-webkit-scrollbar-thumb { + background: var(--scrollbar-thumb); + border-radius: 6px; +} + +::-webkit-scrollbar-thumb:hover { + background: var(--scrollbar-hover); +} + +* { + scrollbar-width: thin; + scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track); +} + +/* ---------- Code boxes: scrollbars ---------- */ +pre, +pre.code-processed .code-wrap, +.hljs-ln-code { + scrollbar-color: #073642 #002b36; +} + +pre::-webkit-scrollbar-thumb, +pre.code-processed .code-wrap::-webkit-scrollbar-thumb, +.hljs-ln-code::-webkit-scrollbar-thumb { + background: #073642; +} + +pre::-webkit-scrollbar-thumb:hover, +pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover, +.hljs-ln-code::-webkit-scrollbar-thumb:hover { + background: #073642; +} + +pre::-webkit-scrollbar-track, +pre.code-processed .code-wrap::-webkit-scrollbar-track, +.hljs-ln-code::-webkit-scrollbar-track { + background: #002b36; +} + +html.theme-light pre, +html.theme-light pre.code-processed .code-wrap, +html.theme-light .hljs-ln-code { + scrollbar-color: #93a1a1 #eee8d5; +} + +html.theme-light pre::-webkit-scrollbar-thumb, +html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb, +html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb { + background: #93a1a1; +} + +html.theme-light pre::-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 { + background: #93a1a1; +} + +html.theme-light pre::-webkit-scrollbar-track, +html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-track, +html.theme-light .hljs-ln-code::-webkit-scrollbar-track { + background: #eee8d5; +} + +/* ---------- Link icons / markers: internal links without arrow, external links keep a marker ---------- */ +#content a::after, +#content a::before, +#content-footer .navigation a::after, +#content-footer .navigation a::before, +a.next::after, +a.previous::before, +.bmc-btn::after, +.bmc-btn::before, +.bmc-powered::after, +.bmc-powered::before { + content: none !important; +} + +#content a[href^="http://"]:not([href^="https://YOUR-INSTANCE.example.com"])::after, +#content a[href^="https://"]:not([href^="https://YOUR-INSTANCE.example.com"])::after { + content: " ↗" !important; + display: inline-block; + margin-left: 3px; + font-size: 0.85em; + color: var(--text-link); +} + +/* inline text links (in paragraphs/lists): colour only */ +#content p a:not([class]), +#content li a:not([class]) { + color: var(--text-link); + text-decoration: none; + background: transparent; + border: 0; + padding: 0; + border-radius: 0; +} + +#content p a:not([class]):hover, +#content li a:not([class]):hover { + color: var(--text-heading); + background: transparent; +} + +/* action links as buttons (subtle tint, noticeable on hover) */ +.blog-pn { + padding: 6px 14px; + border: 1px solid rgba(38, 107, 210, 0.30); + border-radius: 8px; + background: rgba(38, 107, 210, 0.08); + transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; +} + +html.theme-light .blog-pn { + border-color: rgba(38, 107, 210, 0.30); + background: rgba(38, 107, 210, 0.08); +} + +.blog-pn:hover { + background: rgba(38, 107, 210, 0.18); + border-color: #268bd2; +} + +html.theme-light .blog-pn:hover { + background: rgba(38, 107, 210, 0.15); + border-color: #268bd2; +} + +/* ---------- Mermaid diagrams - Harbor, theme-following ---------- */ +/* + * The blog renders inline Mermaid diagrams with the default theme, so the + * generated SVG carries light-blue node fills that clash with Harbor. + * Override the SVG element colours here; the selectors hang off + * html.theme-dark / html.theme-light, so the diagrams follow the theme + * toggle automatically without re-rendering. + */ + +.mermaid { + margin: 1.25em auto; + overflow-x: auto; + background: transparent; +} + +.mermaid svg { + max-width: 100%; + height: auto; +} + +/* Text in node labels and titles */ +html.theme-dark .mermaid svg text, +html.theme-dark .mermaid svg tspan, +html.theme-dark .mermaid svg .nodeLabel, +html.theme-dark .mermaid svg .edgeLabel p { + fill: #839496 !important; + color: #839496 !important; +} + +html.theme-light .mermaid svg text, +html.theme-light .mermaid svg tspan, +html.theme-light .mermaid svg .nodeLabel, +html.theme-light .mermaid svg .edgeLabel p { + fill: #657b83 !important; + color: #657b83 !important; +} + +/* Graph/node title */ +html.theme-dark .mermaid svg .titleText text, +html.theme-dark .mermaid svg .node .label .nodeLabel { + fill: #839496 !important; + color: #839496 !important; +} + +html.theme-light .mermaid svg .titleText text, +html.theme-light .mermaid svg .node .label .nodeLabel { + fill: #657b83 !important; + color: #657b83 !important; +} + +/* Node shapes (rectangles, rounded boxes, ellipses, diamonds) */ +html.theme-dark .mermaid svg .node rect, +html.theme-dark .mermaid svg .node polygon, +html.theme-dark .mermaid svg .node circle, +html.theme-dark .mermaid svg .node ellipse, +html.theme-dark .mermaid svg .node path, +html.theme-dark .mermaid svg .cluster rect { + fill: #073642 !important; + stroke: #839496 !important; +} + +html.theme-light .mermaid svg .node rect, +html.theme-light .mermaid svg .node polygon, +html.theme-light .mermaid svg .node circle, +html.theme-light .mermaid svg .node ellipse, +html.theme-light .mermaid svg .node path, +html.theme-light .mermaid svg .cluster rect { + fill: #eee8d5 !important; + stroke: #268bd2 !important; +} + +/* Rounded corners on rectangular node boxes and subgraph clusters (8 px, like the blog cards) */ +html.theme-dark .mermaid svg .node rect, +html.theme-light .mermaid svg .node rect, +html.theme-dark .mermaid svg .cluster rect, +html.theme-light .mermaid svg .cluster rect { + rx: 8px !important; + ry: 8px !important; +} + +/* Edge lines: stroke only (a filled edge path would look like a polygon) */ +html.theme-dark .mermaid svg .edgePaths path { + fill: none !important; + stroke: #859900 !important; +} + +html.theme-light .mermaid svg .edgePaths path { + fill: none !important; + stroke: #93a1a1 !important; +} + +/* Arrowheads (markers): filled triangles */ +html.theme-dark .mermaid svg marker.flowchart-v2, +html.theme-dark .mermaid svg .arrowMarkerPath { + fill: #859900 !important; + stroke: #859900 !important; +} + +html.theme-light .mermaid svg marker.flowchart-v2, +html.theme-light .mermaid svg .arrowMarkerPath { + fill: #93a1a1 !important; + stroke: #93a1a1 !important; +} + +/* Edge labels: HTML text inside a foreignObject (div.labelBkg > span.edgeLabel); + the label panel background lives on the g.edgeLabel element itself */ +html.theme-dark .mermaid svg g.edgeLabel { + background: #002b36 !important; + fill: #839496 !important; + color: #839496 !important; +} + +html.theme-dark .mermaid svg .edgeLabel .labelBkg { + fill: #002b36 !important; + background: #002b36 !important; + color: #839496 !important; +} + +html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel { + fill: #839496 !important; + color: #839496 !important; + background: #002b36 !important; +} + +html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel p { + fill: #839496 !important; + color: #839496 !important; + background: #002b36 !important; +} + +html.theme-light .mermaid svg g.edgeLabel { + background: #eee8d5 !important; + fill: #657b83 !important; + color: #657b83 !important; +} + +html.theme-light .mermaid svg .edgeLabel .labelBkg { + fill: #eee8d5 !important; + background: #eee8d5 !important; + color: #657b83 !important; +} + +html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel { + fill: #657b83 !important; + color: #657b83 !important; + background: #eee8d5 !important; +} + +html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel p { + fill: #657b83 !important; + color: #657b83 !important; + background: #eee8d5 !important; +} + +/* Subgraph cluster border + label */ +html.theme-dark .mermaid svg .cluster rect { + stroke: #073642 !important; + fill: rgba(0, 43, 54, 0.35) !important; +} + +html.theme-light .mermaid svg .cluster rect { + stroke: #93a1a1 !important; + fill: rgba(238, 232, 213, 0.40) !important; +} + +html.theme-dark .mermaid svg .cluster .nodeLabel, +html.theme-dark .mermaid svg .cluster-label text { + fill: #859900 !important; + color: #859900 !important; +} + +html.theme-light .mermaid svg .cluster .nodeLabel, +html.theme-light .mermaid svg .cluster-label text { + fill: #586e75 !important; + color: #586e75 !important; +} +/* ---------- G-code / Zusatz-Scopes (name = G/M-Codes, attr = Parameter) ---------- */ +.hljs-name { color: #b58900; } +.hljs-attr { color: #839496; } +html.theme-light .hljs-name { color: #268bd2; } +html.theme-light .hljs-attr { color: #586e75; } \ No newline at end of file diff --git a/theme/blog_share_theme_tokyonight.css b/theme/blog_share_theme_tokyonight.css new file mode 100644 index 0000000..0a6059b --- /dev/null +++ b/theme/blog_share_theme_tokyonight.css @@ -0,0 +1,1891 @@ +/* + * Tokyo Night Share Theme (light/dark) + * Based on tokyonight.nvim (https://github.com/folke/tokyonight.nvim, Apache-2.0) + */ + +/* + * Harbor Share Theme for Richard's Blog (Trilium Public Share) + * Light: Harbor (paper #e1e2e7 / ink #3760bf, accent #2e7de9) + * Dark: Harbordark (#24283b / #c0caf5, accent #7aa2f7) + * Based on https://github.com/HANCORE-linux/omarchy-harbor-theme (MIT) + */ + +html.theme-light { + --background-primary: #e1e2e7; + --background-secondary: #cfc9c2; + --background-highlight: #c4c6dd; + --background-active: #2e7de9; + --blog-card-bg: #cfc9c2; + --scrollbar-thumb: #c4c6dd; + --scrollbar-hover: #9aa5ce; + --scrollbar-track: #cfc9c2; + --text-primary: #3760bf; + --text-heading: #3760bf; + --text-menu: #a0a6c2; + --text-link: #2e7de9; + --text-menu-active: #e1e2e7; + color-scheme: light; +} + +html.theme-dark { + --background-primary: #24283b; + --background-secondary: #1a1b26; + --background-highlight: #292e42; + --background-active: #7aa2f7; + --blog-card-bg: #1a1b26; + --scrollbar-thumb: #292e42; + --scrollbar-hover: #292e42; + --scrollbar-track: #24283b; + --text-primary: #c0caf5; + --text-heading: #c0caf5; + --text-menu: #9ece6a; + --text-link: #7aa2f7; + --text-menu-active: #24283b; + color-scheme: dark; +} + +body { + font-family: "Inter", "Montserrat", "Lucida Grande", "Lucida Sans Unicode", arial, sans-serif; +} + +/* ---------- Header: Logo durch Laptop-Emoji ---------- */ +#header-logo img { + display: none; +} + +#header-logo::before { + content: "💻"; + font-size: 1.5em; + line-height: 1; + margin-right: 8px; + display: inline-block; + vertical-align: middle; +} + +/* ---------- Buy Me a Coffee (original, lokal) ---------- */ +@font-face { + font-family: "Cookie"; + src: url(/api/notes/__COOKIE_FONT_ID__/download) format("woff2"); + font-weight: 400; + font-display: swap; +} + +#bmc-links { + margin-top: auto; + padding: 8px 25px 4px; + background: var(--background-secondary); + display: flex; + flex-direction: column; + gap: 2px; +} + +.bmc-link { + display: flex; + align-items: center; + gap: 8px; + padding: 4px 6px 4px 24px; + border-radius: 6px; + color: var(--text-heading); + text-decoration: none; + font-size: 0.9em; + transition: background-color 150ms ease, color 150ms ease; +} + +.bmc-link:hover { + background: var(--background-highlight); + color: var(--text-heading); + text-decoration: none; +} + +.bmc-link .tn-icon { + color: var(--text-link); +} + +/* ---------- Menu: wie Footer-Links gestalten ---------- */ +#menu a { + color: var(--text-heading); + gap: 8px; + font-size: 0.9em; + padding: 4px 6px; + border-color: transparent; + transition: background-color 150ms ease, color 150ms ease; +} + +#menu a:hover { + background: var(--background-highlight); + color: var(--text-heading); + border-color: transparent; + text-decoration: none; +} + +#menu a.active { + background: var(--background-active); + color: var(--background-secondary); + border-color: transparent; +} + +#menu .tn-icon { + color: var(--text-link); +} + +#bmc-wrap { + padding: 8px 14px 14px; + background: var(--background-secondary); + border-top: 1px solid var(--background-highlight); +} + +.bmc-btn { + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + width: 100%; + box-sizing: border-box; + padding: 6px 12px 8px; + border-radius: 8px; + background: #fabd2f; + color: #3760bf; + border: 2px solid #3760bf; + font-family: "Cookie", "Brush Script MT", cursive; + font-size: 1.4em; + line-height: 1.1; + text-decoration: none; + transition: background-color 150ms ease, transform 150ms ease; +} + +.bmc-btn:hover { + background: #b15c00; + color: #3760bf; + text-decoration: none; + transform: translateY(-1px); +} + +.bmc-btn .bmc-emoji { + font-size: 1.15em; +} + +.bmc-copyright { + margin-top: 8px; + font-size: 0.75em; + color: var(--text-menu); + display: flex; + align-items: center; + justify-content: center; + gap: 4px; + flex-wrap: wrap; +} + +.bmc-powered { + display: inline-flex; + align-items: center; + gap: 3px; + color: var(--text-menu); + text-decoration: none; + transition: color 150ms ease; +} + +.bmc-powered:hover { + color: var(--text-link); + text-decoration: none; +} + +.powered-logo { + width: 1em; + height: 1em; + display: inline-block; +} + +/* ---------- Reading time ---------- */ +.reading-time { + font-size: 0.8em; + color: var(--text-menu); + margin: -0.9em 0 1.25em; +} + +/* ---------- Blog pagination ---------- */ +.blog-pagination { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + margin: 1.5em 0 0; + padding-top: 1em; + border-top: 1px solid var(--background-highlight); +} + +.blog-pagination .blog-page-num { + font-size: 0.85em; + color: var(--text-menu); +} + +/* ---------- Share footer navigation (built-in prev/next) ausblenden ---------- */ +#content-footer .navigation { + display: none; +} + +/* ---------- Prev/Next ---------- */ +.blog-prevnext { + display: flex; + justify-content: space-between; + gap: 12px; + margin: 1.5em 0 0; + padding-top: 1em; + border-top: 1px solid var(--background-highlight); +} + +.blog-pn { + display: flex; + flex-direction: column; + gap: 2px; + max-width: 45%; + color: var(--text-heading); + text-decoration: none; + transition: color 150ms ease; +} + +.blog-pn.next { + margin-left: auto; + align-items: flex-end; + text-align: right; +} + +.blog-pn-label { + font-size: 0.72em; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--text-menu); +} + +.blog-pn:hover { + color: var(--text-link); + text-decoration: none; +} + +.blog-pn.empty { + display: none; +} + +/* ---------- Search ---------- */ +.blog-search { + margin: 0.5em 0 1em; +} + +.blog-search-input { + width: 100%; + box-sizing: border-box; + padding: 10px 14px; + border-radius: 8px; + border: 1px solid var(--background-highlight); + background: var(--background-secondary); + color: var(--text-heading); + font-size: 1em; +} + +.blog-search-input:focus { + outline: none; + border-color: var(--text-link); +} + +.blog-search-list { + list-style: none; + padding: 0; + margin: 1em 0 0; +} + +.blog-search-hit { + display: flex; + flex-direction: column; + gap: 2px; + padding: 8px 12px; + border-radius: 8px; + border: 1px solid var(--background-highlight); + background: var(--blog-card-bg); + color: var(--text-heading); + text-decoration: none; + margin-bottom: 8px; + transition: border-color 150ms ease; +} + +.blog-search-hit:hover { + border-color: var(--text-link); + text-decoration: none; +} + +.blog-search-path { + font-size: 0.8em; + color: var(--text-menu); +} + +.blog-search-none { + color: var(--text-menu); +} + +/* ---------- Header-Suche (ersetzt eingebaute) ---------- */ +.search-item { + position: relative; +} + +.blog-search-header-input { + flex: 1; + min-width: 0; + padding: 6px 10px 6px 32px; + border-radius: 6px; + border: 1px solid rgba(169, 177, 214, 0.55); + background: rgba(169, 177, 214, 0.10); + color: var(--text-heading); + font-size: 0.9em; + transition: border-color 150ms ease, box-shadow 150ms ease; +} + +html.theme-light .blog-search-header-input { + border-color: #2e7de9; + background: rgba(46, 125, 233, 0.10); +} + +.blog-search-header-input:focus { + outline: none; + border-color: #a9b1d6; + box-shadow: 0 0 0 2px rgba(169, 177, 214, 0.20); +} + +html.theme-light .blog-search-header-input:focus { + border-color: #2e7de9; + box-shadow: 0 0 0 2px rgba(46, 125, 233, 0.15); +} + +.search-item .search-icon { + color: rgba(169, 177, 214, 0.85); +} + +html.theme-light .search-item .search-icon { + color: #2e7de9; +} + +.tn-image { + width: 18px; + height: 18px; + border-radius: 4px; + flex-shrink: 0; + vertical-align: middle; +} + +.tn-image-svg { + color: var(--text-link); +} + +.title-image { + width: 34px; + height: 34px; + border-radius: 6px; + vertical-align: middle; + margin-right: 10px; +} + +.note-fallback { + margin: 1em 0; + overflow: hidden; +} + +.note-fallback-link { + font-size: 0.9em; +} + +.mermaid-fallback { + margin: 1em 0; +} + +.mermaid-render { + margin: 1em 0; + padding: 14px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow-x: auto; +} + +.mermaid-render svg { + max-width: 100%; + height: auto; +} + +.mermaid-source { + margin: 12px 0 0; + text-align: center; +} + +.mermaid-source summary { + cursor: pointer; + font-size: 0.85em; + color: var(--text-menu); + user-select: none; + padding: 4px 10px; + border: 1px solid var(--background-highlight); + border-radius: 6px; + display: inline-block; + background: var(--background-secondary); +} + +.mermaid-source summary:hover { + color: var(--text-heading); + border-color: var(--text-link); +} + +.mermaid-source pre { + width: min(100%, 820px); + margin: 8px auto 0; + text-align: left; + position: relative; + overflow: hidden; +} + +#content .mermaid-source .hljs-ln { + width: 100%; +} + +/* ---------- Rendered widgets: mind map + excalidraw ---------- */ +.mindmap-render, +.excalidraw-render { + margin: 1em 0; + padding: 14px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow-x: auto; +} + +.mindmap-svg { + display: block; + width: 100%; + height: auto; +} + +.excalidraw-svg { + display: block; + max-width: 100%; + height: auto; +} + +.mindmap-render svg text { + user-select: none; +} + +.blog-search-overlay { + display: none; + position: absolute; + top: calc(100% + 4px); + left: 0; + right: 0; + z-index: 50; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow: hidden; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); +} + +.blog-search-overlay.open { + display: block; +} + +.blog-search-overlay-hit { + display: flex; + flex-direction: column; + gap: 1px; + padding: 7px 10px; + color: var(--text-heading); + text-decoration: none; + font-size: 0.85em; + border-bottom: 1px solid var(--background-highlight); +} + +.blog-search-overlay-hit:last-child { + border-bottom: none; +} + +.blog-search-overlay-hit:hover { + background: var(--background-highlight); + text-decoration: none; +} + +.blog-search-overlay-hit .s { + font-size: 0.75em; + color: var(--text-menu); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.blog-search-overlay .blog-search-none { + padding: 8px 10px; + font-size: 0.85em; +} + +#main { + max-width: min(92vw, 1200px); +} + +#site-header { + padding-bottom: 10px; +} + +#title { + font-family: "JetBrains Mono", "Montserrat", monospace; + letter-spacing: -0.02em; +} + +body.is-garden #title { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; +} + +body.is-garden #title .note-state { + margin-left: auto; + flex-shrink: 0; +} + +body.is-garden #content h1#title { + background-color: rgba(158, 206, 106, 0.30) !important; + border-bottom-color: rgba(158, 206, 106, 0.60) !important; +} + +html.theme-light body.is-garden #content h1#title { + background-color: rgba(160, 166, 194, 0.15) !important; + border-bottom-color: rgba(160, 166, 194, 0.40) !important; +} + +/* ---------- Blog index (generated article list) ---------- */ +.blog-post { + padding: 1.2em 1.4em; + margin-bottom: 1.25em; + border: 1px solid var(--background-highlight); + border-radius: 10px; + background: var(--blog-card-bg); + transition: border-color 150ms ease, box-shadow 150ms ease; + cursor: pointer; +} + +.blog-post:last-child { + margin-bottom: 0; +} + +.blog-post:hover { + border-color: var(--text-link); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18); +} + +#content .blog-post:first-of-type { + margin-top: 1.5em; +} + +/* ---------- Blog post thumbnails (Bild links, Teaser rechts) ---------- */ +.blog-post-inner { + display: flex; + gap: 16px; + align-items: stretch; +} + +.blog-thumb-link { + flex: 0 0 auto; + width: min(256px, 35%); + text-decoration: none; +} + +.blog-thumb { + display: block; + width: 100%; + height: 100%; + max-height: 256px; + object-fit: cover; + border-radius: 8px; + border: 1px solid var(--background-highlight); +} + +.blog-post-body { + flex: 1; + min-width: 0; +} + +.blog-post-title { + margin: 0 0 0.25em; +} + +.blog-post-title a { + color: var(--text-heading); + text-decoration: none; + transition: color 150ms ease; +} + +.blog-post-title a:hover { + color: var(--text-link); + text-decoration: none; +} + +.blog-post-meta { + display: flex; + gap: 12px; + font-size: 0.85em; + color: var(--text-menu); + margin-bottom: 0.5em; +} + +.blog-post-date { + font-variant-numeric: tabular-nums; + opacity: 0.85; +} + +.blog-post-category { + background: var(--background-highlight); + border-radius: 8px; + padding: 1px 10px; + color: var(--text-heading); + font-weight: 600; +} + +.blog-post-summary { + margin: 0 0 0.5em; + color: var(--text-primary); +} + +.blog-post-tags { + display: flex; + flex-wrap: wrap; + gap: 6px; +} + +.tag { + font-size: 0.78em; + color: var(--text-link); + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + padding: 1px 8px; +} + +a.tag { + text-decoration: none; + transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; +} + +a.tag:hover { + background: var(--background-highlight); + border-color: var(--text-link); + color: var(--text-heading); + text-decoration: none; +} + +/* ---------- Article meta (date/category on individual pages) ---------- */ +.article-meta { + display: flex; + gap: 12px; + font-size: 0.9em; + color: var(--text-menu); + margin-bottom: 1em; + padding-bottom: 1em; + border-bottom: 1px solid var(--background-highlight); +} + +/* ---------- Headings (h2-h6) - Harbor header boxes ---------- */ +html.theme-dark { + --header-h2-bg: rgba(122, 162, 247, 0.30); + --header-h2-border: rgba(122, 162, 247, 0.6); + --header-h3-bg: rgba(158, 206, 106, 0.25); + --header-h3-border: rgba(158, 206, 106, 0.6); + --header-h4-bg: rgba(224, 175, 104, 0.22); + --header-h4-border: rgba(224, 175, 104, 0.55); + --header-h5-bg: rgba(169, 177, 214, 0.25); + --header-h5-border: rgba(169, 177, 214, 0.6); + --header-h6-bg: rgba(229, 137, 128, 0.25); + --header-h6-border: rgba(229, 137, 128, 0.6); + --header-h1-bg: rgba(247, 118, 142, 0.30); + --header-h1-border: rgba(247, 118, 142, 0.6); +} + +html.theme-light { + --header-h2-bg: rgba(122, 162, 247, 0.18); + --header-h2-border: rgba(122, 162, 247, 0.45); + --header-h3-bg: rgba(160, 166, 194, 0.14); + --header-h3-border: rgba(160, 166, 194, 0.38); + --header-h4-bg: rgba(177, 92, 0, 0.14); + --header-h4-border: rgba(177, 92, 0, 0.38); + --header-h5-bg: rgba(152, 84, 241, 0.12); + --header-h5-border: rgba(152, 84, 241, 0.35); + --header-h6-bg: rgba(13, 185, 215, 0.12); + --header-h6-border: rgba(13, 185, 215, 0.35); + --header-h1-bg: rgba(245, 42, 101, 0.14); + --header-h1-border: rgba(245, 42, 101, 0.40); +} + +#content h1 { + background-color: var(--header-h1-bg); + border-bottom: 2px solid var(--header-h1-border); + border-radius: 4px; + padding: 0.3em 0.4em; + font-size: 1.6em; + font-weight: 700; + margin-top: 1.5em; + margin-bottom: 1.25em; +} + +#content h2 { + background-color: var(--header-h2-bg); + border-bottom: 2px solid var(--header-h2-border); + border-radius: 4px; + padding: 0.25em 0.4em; +} + +#content h3 { + background-color: var(--header-h3-bg); + border-bottom: 2px solid var(--header-h3-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#content h4 { + background-color: var(--header-h4-bg); + border-bottom: 2px solid var(--header-h4-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#content h5 { + background-color: var(--header-h5-bg); + border-bottom: 2px solid var(--header-h5-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#content h6 { + background-color: var(--header-h6-bg); + border-bottom: 2px solid var(--header-h6-border); + border-radius: 4px; + padding: 0.2em 0.35em; +} + +#childLinks { + display: none; +} + +#index { + display: none; +} + +/* ---------- Code blocks - Harbordark (always, also in light mode) ---------- */ +.ck-content pre, +#content pre { + background-color: #1a1b26; + color: #c0caf5; + border: 1px solid #292e42; + border-radius: 8px; +} + +.ck-content code, +#content code { + background-color: #292e42; + color: #c0caf5; + border-color: #292e42; + border-radius: 8px; + padding: 0.1em 0.35em; +} + +html.theme-light .ck-content pre, +html.theme-light #content pre { + background-color: #e1e2e7; + color: #3760bf; + border-color: #c4c6dd; +} + +html.theme-light .ck-content code, +html.theme-light #content code { + background-color: #e1e2e7; + color: #3760bf; + border-color: #9aa5ce; +} + +/* ---------- Eingebettete Bilder: Radius wie Code-Blöcke (8px) ---------- */ +#content figure.image { + margin: 1.25em auto; +} + +#content figure img, +#content img:not(.blog-thumb) { + border-radius: 8px; +} + +/* ---------- 3D model viewer (STL / STEP) ---------- */ +.model-viewer { + position: relative; + box-sizing: border-box; + width: calc(100vw - 24px); + margin: 1em 0; + margin-left: calc(50% - (100vw - 24px) / 2); + background: #24283b; + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow: hidden; +} + +.model-viewer.model-viewer-inline { + width: 100%; + margin-left: 0; +} + +.model-viewer-data { + position: absolute; + top: 8px; + right: 10px; + z-index: 3; + display: none; + font-size: 0.75em; + color: #9ece6a; + background: rgba(26, 27, 38, 0.85); + border: 1px solid #292e42; + border-radius: 6px; + padding: 2px 10px; + font-variant-numeric: tabular-nums; + pointer-events: none; +} + +.model-viewer-canvas { + position: relative; + width: 100%; + height: min(70vh, 900px); + min-height: 420px; +} + +.model-viewer-status { + position: absolute; + inset: 0; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + padding: 48px; + box-sizing: border-box; + color: #9ece6a; + font-size: 0.9em; +} + +.model-viewer-status.error { + color: #f7768e; +} + +.model-viewer-progress { + position: absolute; + left: 0; + right: 0; + bottom: 40px; + height: 6px; + width: min(60%, 480px); + margin: 0 auto; + background: #292e42; + border-radius: 3px; + overflow: hidden; +} + +.model-viewer-progress-fill { + height: 100%; + width: 0; + background: #e0af68; + border-radius: 3px; + transition: width 150ms ease; +} + +.model-viewer-progress-fill.indeterminate { + width: 40%; + animation: model-progress 1.1s ease-in-out infinite; +} + +@keyframes model-progress { + 0% { transform: translateX(-100%); } + 100% { transform: translateX(250%); } +} + +.model-viewer-hint { + position: absolute; + top: 8px; + left: 10px; + font-size: 0.75em; + color: #9ece6a; + z-index: 2; + pointer-events: none; +} + +.model-viewer-caption { + font-size: 0.85em; + font-style: italic; + color: var(--text-menu); + text-align: center; + padding: 4px 12px; + background: var(--background-secondary); + border-top: 1px solid var(--background-highlight); +} + +.model-viewer canvas { + display: block; + width: 100%; + height: 100%; +} + +/* ---------- 3D-Viewer: theme-bewusste Overlays ---------- */ +html.theme-light .model-viewer { + background: #e1e2e7; +} +html.theme-light .model-viewer-status, +html.theme-light .model-viewer-hint, +html.theme-light .model-viewer-data { + color: #3760bf; +} +html.theme-light .model-viewer-data { + background: rgba(225, 226, 231, 0.85); + border-color: #c4c6dd; +} +html.theme-light .model-viewer-status.error { + color: #f52a65; +} +html.theme-light .model-viewer-progress { + background: #c4c6dd; +} +html.theme-light .model-viewer-progress-fill { + background: #2e7de9; +} + +/* ---------- Bildunterschriften (Harbor) ---------- */ +#content figcaption { + font-size: 0.85em; + font-style: italic; + color: var(--text-menu); + text-align: center; + margin-top: 8px; + padding: 4px 12px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + display: inline-block; +} + +.hljs { + background: #1a1b26; + color: #c0caf5; +} + +.hljs-comment, +.hljs-quote { + color: #565f89; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-subst { + color: #f7768e; +} + +.hljs-number, +.hljs-literal, +.hljs-variable, +.hljs-template-variable, +.hljs-tag .hljs-attr { + color: #7aa2f7; +} + +.hljs-string, +.hljs-doctag { + color: #9ece6a; +} + +.hljs-title, +.hljs-section, +.hljs-selector-id { + color: #e0af68; +} + +.hljs-type, +.hljs-class .hljs-title, +.hljs-attribute { + color: #a9b1d6; +} + +.hljs-symbol, +.hljs-bullet, +.hljs-link, +.hljs-meta, +.hljs-deletion, +.hljs-addition { + color: #7aa2f7; +} + +.hljs-built_in, +.hljs-builtin-name, +.hljs-params { + color: #a9b1d6; +} + +.hljs-emphasis { + font-style: italic; +} + +.hljs-strong { + font-weight: bold; +} +/* ---------- Light mode: Harbor light highlighter ---------- */ +html.theme-light .hljs, +html.theme-light pre code.hljs { + background: #e1e2e7 !important; + color: #3760bf; +} + +html.theme-light .hljs-comment, +html.theme-light .hljs-quote { + color: #9aa5ce; +} + +html.theme-light .hljs-keyword, +html.theme-light .hljs-selector-tag, +html.theme-light .hljs-subst { + color: #f52a65; +} + +html.theme-light .hljs-number, +html.theme-light .hljs-literal, +html.theme-light .hljs-variable, +html.theme-light .hljs-template-variable, +html.theme-light .hljs-tag .hljs-attr { + color: #9854f1; +} + +html.theme-light .hljs-string, +html.theme-light .hljs-doctag { + color: #a0a6c2; +} + +html.theme-light .hljs-title, +html.theme-light .hljs-section, +html.theme-light .hljs-selector-id { + color: #b15c00; +} + +html.theme-light .hljs-type, +html.theme-light .hljs-class .hljs-title, +html.theme-light .hljs-attribute { + color: #2e7de9; +} + +html.theme-light .hljs-symbol, +html.theme-light .hljs-bullet, +html.theme-light .hljs-link, +html.theme-light .hljs-meta, +html.theme-light .hljs-deletion, +html.theme-light .hljs-addition { + color: #9854f1; +} + +html.theme-light .hljs-built_in, +html.theme-light .hljs-builtin-name, +html.theme-light .hljs-params { + color: #0db9d7; +} + +html.theme-light .hljs-regexp, +html.theme-light .hljs-operator, +html.theme-light .hljs-selector-attr, +html.theme-light .hljs-selector-pseudo, +html.theme-light .hljs-selector-class, +html.theme-light .hljs-template-tag { + color: #9854f1; +} + +html.theme-light .hljs-name, +html.theme-light .hljs-tag { + color: #2e7de9; +} + +html.theme-light .hljs-meta .hljs-string { + color: #a0a6c2; +} +/* ---------- Admonitions (Trilium-style, gefüllt) ---------- */ +.admonition { + --accent-color: var(--background-highlight); + --admonition-bg: var(--background-secondary); + border: 1px solid var(--accent-color); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); + background: var(--admonition-bg); + border-radius: 0.5em; + padding: 1em; + padding-inline-start: 2.5em; + margin: 1.25em 0; + position: relative; + overflow: hidden; +} + +html.theme-dark .admonition.note { --admonition-bg: rgba(46, 125, 233, 0.16); } +html.theme-dark .admonition.tip { --admonition-bg: rgba(160, 166, 194, 0.16); } +html.theme-dark .admonition.important { --admonition-bg: rgba(152, 84, 241, 0.18); } +html.theme-dark .admonition.caution { --admonition-bg: rgba(245, 42, 101, 0.16); } +html.theme-dark .admonition.warning { --admonition-bg: rgba(177, 92, 0, 0.16); } +html.theme-dark .admonition { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); } + +html.theme-light .admonition.note { --admonition-bg: rgba(46, 125, 233, 0.18); } +html.theme-light .admonition.tip { --admonition-bg: rgba(160, 166, 194, 0.16); } +html.theme-light .admonition.important { --admonition-bg: rgba(152, 84, 241, 0.16); } +html.theme-light .admonition.caution { --admonition-bg: rgba(245, 42, 101, 0.16); } +html.theme-light .admonition.warning { --admonition-bg: rgba(177, 92, 0, 0.20); } + +.admonition p:last-child { + margin-bottom: 0; +} + +.admonition p, +.admonition h2 { + margin-top: 0; +} + +.admonition.note { --accent-color: #2e7de9; } +.admonition.tip { --accent-color: #a0a6c2; } +.admonition.important { --accent-color: #9854f1; } +.admonition.caution { --accent-color: #f52a65; } +.admonition.warning { --accent-color: #b15c00; } + +.admonition::before { + color: var(--accent-color); + font-family: boxicons !important; + position: absolute; + top: 1em; + inset-inline-start: 1em; +} + +.admonition.note::before { content: "\eb21"; } +.admonition.tip::before { content: "\ea0d"; } +.admonition.important::before { content: "\ea7c"; } +.admonition.caution::before { content: "\eac7"; } +.admonition.warning::before { content: "\eac5"; } +/* ---------- Tables (Harbor, theme-aware) ---------- */ +html.theme-dark { + --table-header-bg: rgba(122, 162, 247, 0.20); + --table-header-text: #c0caf5; + --table-header-border: rgba(122, 162, 247, 0.45); + --table-stripe: rgba(255, 255, 255, 0.04); + --table-hover: rgba(122, 162, 247, 0.12); + --table-rowlabel-bg: rgba(255, 255, 255, 0.05); + --table-rowlabel-text: #c0caf5; +} + +html.theme-light { + --table-header-bg: rgba(122, 162, 247, 0.16); + --table-header-text: #3760bf; + --table-header-border: rgba(122, 162, 247, 0.40); + --table-stripe: rgba(0, 0, 0, 0.04); + --table-hover: rgba(122, 162, 247, 0.12); + --table-rowlabel-bg: rgba(0, 0, 0, 0.05); + --table-rowlabel-text: #3760bf; +} + +.ck-content table, +#content table { + border-collapse: separate; + border-spacing: 0; + border: 1px solid var(--background-highlight); + border-radius: 8px; + overflow: hidden; + margin: 1em 0; +} + +.ck-content table th, +.ck-content table td, +#content table th, +#content table td { + border: none; + border-bottom: 1px solid var(--background-highlight); + border-right: 1px solid var(--background-highlight); + padding: 8px 12px; + text-align: left; + background-color: transparent !important; +} + +.ck-content table th:last-child, +.ck-content table td:last-child, +#content table th:last-child, +#content table td:last-child { + border-right: none; +} + +.ck-content table tr:last-child td, +#content table tr:last-child td { + border-bottom: none; +} + +.ck-content table thead th, +#content table thead th { + background-color: var(--table-header-bg) !important; + color: var(--table-header-text); + font-weight: 700; + border-bottom: 2px solid var(--table-header-border); +} + +.ck-content table tbody td:first-child, +#content table tbody td:first-child { + background-color: var(--table-rowlabel-bg) !important; + color: var(--table-rowlabel-text); + font-weight: 600; + white-space: nowrap; +} + +.ck-content table tbody tr:nth-child(even) td:not(:first-child), +#content table tbody tr:nth-child(even) td:not(:first-child) { + background-color: var(--table-stripe) !important; +} + +.ck-content table tbody tr:hover td, +#content table tbody tr:hover td { + background-color: rgba(122, 162, 247, 0.10) !important; +} + +.ck-content table .col-hover, +#content table .col-hover { + background-color: rgba(122, 162, 247, 0.10) !important; +} + +.ck-content table tbody tr:hover td.col-hover, +.ck-content table thead th.col-hover, +#content table tbody tr:hover td.col-hover, +#content table thead th.col-hover { + background-color: rgba(122, 162, 247, 0.18) !important; +} +/* ---------- Category subcategories ---------- */ +.blog-subcategories { + display: flex; + flex-wrap: wrap; + gap: 8px; + margin: 0 0 1.25em; +} + +.blog-subcategory { + display: inline-flex; + align-items: center; + gap: 6px; + background: var(--background-secondary); + border: 1px solid var(--background-highlight); + border-radius: 8px; + padding: 4px 12px; + color: var(--text-heading); + text-decoration: none; + font-weight: 600; + transition: background-color 150ms ease, border-color 150ms ease; +} + +.blog-subcategory i { + color: var(--text-link); +} + +.blog-subcategory:hover { + background: var(--background-highlight); + border-color: var(--text-link); + color: var(--text-heading); + text-decoration: none; +} +/* ---------- Digital Garden note table ---------- */ +.blog-garden-table { + width: 100%; +} + +.blog-garden-table tbody td:first-child { + background: transparent !important; + font-weight: normal; +} + +.note-type { + display: inline-block; + font-size: 0.8em; + padding: 2px 10px; + border-radius: 8px; + background: var(--background-highlight); + color: var(--text-heading); + font-weight: 600; + text-transform: capitalize; + white-space: nowrap; +} +/* ---------- Digital Garden rows: clickable + sage hover ---------- */ +.blog-garden-table tbody tr { + cursor: pointer; +} + +#content .blog-garden-table tbody tr:hover td, +#content .blog-garden-table .col-hover { + background-color: rgba(158, 206, 106, 0.15) !important; +} + +#content .blog-garden-table tbody tr:hover td.col-hover { + background-color: rgba(158, 206, 106, 0.25) !important; +} +.note-state { + display: inline-flex; + align-items: center; + gap: 5px; + font-size: 0.8em; + padding: 2px 10px; + border-radius: 8px; + background: rgba(158, 206, 106, 0.20); + color: var(--text-heading); + font-weight: 600; + white-space: nowrap; +} + +.note-state i { + color: #9ece6a; +} + +.note-state.state-draft { + background: rgba(84, 92, 126, 0.22); +} + +.note-state.state-draft i { + color: #9aa5ce; +} + +.note-state.state-review { + background: rgba(169, 177, 214, 0.25); +} + +.note-state.state-review i { + color: #a9b1d6; +} + +.note-state.state-unknown { + background: rgba(247, 118, 142, 0.18); +} + +.note-state.state-unknown i { + color: #f7768e; +} + +/* ---------- Peppige Garden-Badges (dark) ---------- */ +html.theme-dark .note-state { + background: rgba(158, 206, 106, 0.40); + border: 1px solid #9ece6a; + color: #24283b; +} +html.theme-dark .note-state i { + color: #24283b; +} +html.theme-dark .note-state.state-draft { + background: rgba(247, 118, 142, 0.85); + border-color: #f7768e; + color: #24283b; +} +html.theme-dark .note-state.state-draft i { + color: #24283b; +} +html.theme-dark .note-state.state-review { + background: rgba(46, 125, 233, 0.85); + border-color: #7aa2f7; + color: #24283b; +} +html.theme-dark .note-state.state-review i { + color: #24283b; +} +html.theme-dark .note-state.state-unknown { + background: rgba(224, 175, 104, 0.85); + border-color: #e0af68; + color: #24283b; +} +html.theme-dark .note-state.state-unknown i { + color: #24283b; +} + +/* ---------- Peppige Garden-Badges (light) ---------- */ +html.theme-light .note-state { + background: rgba(160, 166, 194, 0.85); + border: 1px solid #a0a6c2; + color: #e1e2e7; +} +html.theme-light .note-state i { + color: #e1e2e7; +} +html.theme-light .note-state.state-draft { + background: rgba(177, 92, 0, 0.95); + border-color: #b15c00; + color: #3760bf; +} +html.theme-light .note-state.state-draft i { + color: #3760bf; +} +html.theme-light .note-state.state-review { + background: rgba(122, 162, 247, 0.95); + border-color: #2e7de9; + color: #e1e2e7; +} +html.theme-light .note-state.state-review i { + color: #e1e2e7; +} +html.theme-light .note-state.state-unknown { + background: rgba(245, 42, 101, 0.95); + border-color: #f52a65; + color: #e1e2e7; +} +html.theme-light .note-state.state-unknown i { + color: #e1e2e7; +} +/* ---------- Code notes: always Harbordark like code boxes ---------- */ +#content.type-code pre { + background-color: #1a1b26 !important; + color: #c0caf5; + border: 1px solid #292e42; + border-radius: 8px; + padding: 1em; + margin: 1em 0; +} + +#content.type-code code { + background-color: transparent !important; + color: #c0caf5; + border: 0; +} + +html.theme-light #content.type-code pre { + background-color: #e1e2e7 !important; + color: #3760bf; + border-color: #c4c6dd; +} + +html.theme-light #content.type-code code { + color: #3760bf; +} +/* ---------- Code: line numbers + copy button ---------- */ +pre.code-processed { + position: relative; + display: flex; + align-items: flex-start; + line-height: 1.6; +} + +pre.code-processed .code-wrap { + flex: 1; + min-width: 0; + overflow-x: auto; + border-radius: 8px; +} + +pre.code-processed .code-wrap code { + display: block; + line-height: inherit; + padding: 0; + margin: 0; +} + +pre.code-processed .code-lines { + flex-shrink: 0; + user-select: none; + text-align: right; + padding: 0 12px 0 0; + margin: 0 12px 0 0; + border-right: 1px solid var(--background-highlight); + color: var(--text-menu); + white-space: pre; + font-family: "JetBrains Mono", Consolas, monospace; + font-size: 1em; + line-height: inherit; +} + +pre.code-processed .code-copy-btn, +.mermaid-source pre .code-copy-btn { + position: absolute; + top: 6px; + right: 6px; + z-index: 2; + font-size: 0.75em; + padding: 2px 10px; + border-radius: 6px; + border: 1px solid var(--background-highlight); + background: var(--background-secondary); + color: var(--text-heading); + cursor: pointer; + opacity: 0.6; + transition: opacity 150ms ease; +} + +pre.code-processed:hover .code-copy-btn, +.mermaid-source pre:hover .code-copy-btn { + opacity: 1; +} + +pre.code-processed .code-copy-btn:hover, +.mermaid-source pre .code-copy-btn:hover { + border-color: var(--text-link); + opacity: 1; +} +/* ---------- highlight.js line numbers ---------- */ +#content .hljs-ln { + border-collapse: collapse; + border: none !important; + box-shadow: none; + border-radius: 8px; + margin: 0; + width: auto; + line-height: 1.4; +} + +#content .hljs-ln td, +#content .hljs-ln th { + border: none !important; + background-color: transparent !important; + padding: 0; +} + +#content .hljs-ln tbody td:first-child, +#content .hljs-ln thead th:first-child { + background-color: transparent !important; +} + +#content .hljs-ln tbody tr:nth-child(even) td { + background-color: transparent !important; +} + +#content .hljs-ln .col-hover { + background-color: transparent !important; +} + +#content .hljs-ln tbody tr:hover td, +#content .hljs-ln tbody tr:hover td.col-hover { + background-color: rgba(122, 162, 247, 0.08) !important; +} + +html.theme-light #content .hljs-ln tbody tr:hover td, +html.theme-light #content .hljs-ln tbody tr:hover td.col-hover { + background-color: rgba(122, 162, 247, 0.08) !important; +} + +.hljs-ln-numbers { + user-select: none; + text-align: right; + padding-right: 12px !important; + padding-left: 4px; + border-right: 1px solid var(--background-highlight) !important; + color: var(--text-menu); + white-space: nowrap; + vertical-align: top; + font-family: "JetBrains Mono", Consolas, monospace; +} + +.hljs-ln-code { + padding-left: 12px !important; + white-space: pre; + vertical-align: top; +} +/* ---------- Scrollbars (Harbor) ---------- */ +::-webkit-scrollbar { + width: 12px; + height: 12px; +} + +::-webkit-scrollbar-track { + background: var(--scrollbar-track); +} + +::-webkit-scrollbar-thumb { + background: var(--scrollbar-thumb); + border-radius: 6px; +} + +::-webkit-scrollbar-thumb:hover { + background: var(--scrollbar-hover); +} + +* { + scrollbar-width: thin; + scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track); +} + +/* ---------- Code boxes: scrollbars ---------- */ +pre, +pre.code-processed .code-wrap, +.hljs-ln-code { + scrollbar-color: #292e42 #24283b; +} + +pre::-webkit-scrollbar-thumb, +pre.code-processed .code-wrap::-webkit-scrollbar-thumb, +.hljs-ln-code::-webkit-scrollbar-thumb { + background: #292e42; +} + +pre::-webkit-scrollbar-thumb:hover, +pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover, +.hljs-ln-code::-webkit-scrollbar-thumb:hover { + background: #292e42; +} + +pre::-webkit-scrollbar-track, +pre.code-processed .code-wrap::-webkit-scrollbar-track, +.hljs-ln-code::-webkit-scrollbar-track { + background: #24283b; +} + +html.theme-light pre, +html.theme-light pre.code-processed .code-wrap, +html.theme-light .hljs-ln-code { + scrollbar-color: #9aa5ce #cfc9c2; +} + +html.theme-light pre::-webkit-scrollbar-thumb, +html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb, +html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb { + background: #9aa5ce; +} + +html.theme-light pre::-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 { + background: #c4c6dd; +} + +html.theme-light pre::-webkit-scrollbar-track, +html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-track, +html.theme-light .hljs-ln-code::-webkit-scrollbar-track { + background: #cfc9c2; +} + +/* ---------- Link icons / markers: internal links without arrow, external links keep a marker ---------- */ +#content a::after, +#content a::before, +#content-footer .navigation a::after, +#content-footer .navigation a::before, +a.next::after, +a.previous::before, +.bmc-btn::after, +.bmc-btn::before, +.bmc-powered::after, +.bmc-powered::before { + content: none !important; +} + +#content a[href^="http://"]:not([href^="https://YOUR-INSTANCE.example.com"])::after, +#content a[href^="https://"]:not([href^="https://YOUR-INSTANCE.example.com"])::after { + content: " ↗" !important; + display: inline-block; + margin-left: 3px; + font-size: 0.85em; + color: var(--text-link); +} + +/* inline text links (in paragraphs/lists): colour only */ +#content p a:not([class]), +#content li a:not([class]) { + color: var(--text-link); + text-decoration: none; + background: transparent; + border: 0; + padding: 0; + border-radius: 0; +} + +#content p a:not([class]):hover, +#content li a:not([class]):hover { + color: var(--text-heading); + background: transparent; +} + +/* action links as buttons (subtle tint, noticeable on hover) */ +.blog-pn { + padding: 6px 14px; + border: 1px solid rgba(122, 162, 247, 0.30); + border-radius: 8px; + background: rgba(122, 162, 247, 0.08); + transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; +} + +html.theme-light .blog-pn { + border-color: rgba(46, 125, 233, 0.30); + background: rgba(46, 125, 233, 0.08); +} + +.blog-pn:hover { + background: rgba(122, 162, 247, 0.18); + border-color: #7aa2f7; +} + +html.theme-light .blog-pn:hover { + background: rgba(46, 125, 233, 0.15); + border-color: #2e7de9; +} + +/* ---------- Mermaid diagrams - Harbor, theme-following ---------- */ +/* + * The blog renders inline Mermaid diagrams with the default theme, so the + * generated SVG carries light-blue node fills that clash with Harbor. + * Override the SVG element colours here; the selectors hang off + * html.theme-dark / html.theme-light, so the diagrams follow the theme + * toggle automatically without re-rendering. + */ + +.mermaid { + margin: 1.25em auto; + overflow-x: auto; + background: transparent; +} + +.mermaid svg { + max-width: 100%; + height: auto; +} + +/* Text in node labels and titles */ +html.theme-dark .mermaid svg text, +html.theme-dark .mermaid svg tspan, +html.theme-dark .mermaid svg .nodeLabel, +html.theme-dark .mermaid svg .edgeLabel p { + fill: #c0caf5 !important; + color: #c0caf5 !important; +} + +html.theme-light .mermaid svg text, +html.theme-light .mermaid svg tspan, +html.theme-light .mermaid svg .nodeLabel, +html.theme-light .mermaid svg .edgeLabel p { + fill: #3760bf !important; + color: #3760bf !important; +} + +/* Graph/node title */ +html.theme-dark .mermaid svg .titleText text, +html.theme-dark .mermaid svg .node .label .nodeLabel { + fill: #c0caf5 !important; + color: #c0caf5 !important; +} + +html.theme-light .mermaid svg .titleText text, +html.theme-light .mermaid svg .node .label .nodeLabel { + fill: #3760bf !important; + color: #3760bf !important; +} + +/* Node shapes (rectangles, rounded boxes, ellipses, diamonds) */ +html.theme-dark .mermaid svg .node rect, +html.theme-dark .mermaid svg .node polygon, +html.theme-dark .mermaid svg .node circle, +html.theme-dark .mermaid svg .node ellipse, +html.theme-dark .mermaid svg .node path, +html.theme-dark .mermaid svg .cluster rect { + fill: #1a1b26 !important; + stroke: #a9b1d6 !important; +} + +html.theme-light .mermaid svg .node rect, +html.theme-light .mermaid svg .node polygon, +html.theme-light .mermaid svg .node circle, +html.theme-light .mermaid svg .node ellipse, +html.theme-light .mermaid svg .node path, +html.theme-light .mermaid svg .cluster rect { + fill: #cfc9c2 !important; + stroke: #2e7de9 !important; +} + +/* Rounded corners on rectangular node boxes and subgraph clusters (8 px, like the blog cards) */ +html.theme-dark .mermaid svg .node rect, +html.theme-light .mermaid svg .node rect, +html.theme-dark .mermaid svg .cluster rect, +html.theme-light .mermaid svg .cluster rect { + rx: 8px !important; + ry: 8px !important; +} + +/* Edge lines: stroke only (a filled edge path would look like a polygon) */ +html.theme-dark .mermaid svg .edgePaths path { + fill: none !important; + stroke: #9ece6a !important; +} + +html.theme-light .mermaid svg .edgePaths path { + fill: none !important; + stroke: #9aa5ce !important; +} + +/* Arrowheads (markers): filled triangles */ +html.theme-dark .mermaid svg marker.flowchart-v2, +html.theme-dark .mermaid svg .arrowMarkerPath { + fill: #9ece6a !important; + stroke: #9ece6a !important; +} + +html.theme-light .mermaid svg marker.flowchart-v2, +html.theme-light .mermaid svg .arrowMarkerPath { + fill: #9aa5ce !important; + stroke: #9aa5ce !important; +} + +/* Edge labels: HTML text inside a foreignObject (div.labelBkg > span.edgeLabel); + the label panel background lives on the g.edgeLabel element itself */ +html.theme-dark .mermaid svg g.edgeLabel { + background: #24283b !important; + fill: #c0caf5 !important; + color: #c0caf5 !important; +} + +html.theme-dark .mermaid svg .edgeLabel .labelBkg { + fill: #24283b !important; + background: #24283b !important; + color: #c0caf5 !important; +} + +html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel { + fill: #c0caf5 !important; + color: #c0caf5 !important; + background: #24283b !important; +} + +html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel p { + fill: #c0caf5 !important; + color: #c0caf5 !important; + background: #24283b !important; +} + +html.theme-light .mermaid svg g.edgeLabel { + background: #cfc9c2 !important; + fill: #3760bf !important; + color: #3760bf !important; +} + +html.theme-light .mermaid svg .edgeLabel .labelBkg { + fill: #cfc9c2 !important; + background: #cfc9c2 !important; + color: #3760bf !important; +} + +html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel { + fill: #3760bf !important; + color: #3760bf !important; + background: #cfc9c2 !important; +} + +html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel p { + fill: #3760bf !important; + color: #3760bf !important; + background: #cfc9c2 !important; +} + +/* Subgraph cluster border + label */ +html.theme-dark .mermaid svg .cluster rect { + stroke: #292e42 !important; + fill: rgba(26, 27, 38, 0.35) !important; +} + +html.theme-light .mermaid svg .cluster rect { + stroke: #c4c6dd !important; + fill: rgba(207, 201, 194, 0.40) !important; +} + +html.theme-dark .mermaid svg .cluster .nodeLabel, +html.theme-dark .mermaid svg .cluster-label text { + fill: #9ece6a !important; + color: #9ece6a !important; +} + +html.theme-light .mermaid svg .cluster .nodeLabel, +html.theme-light .mermaid svg .cluster-label text { + fill: #a0a6c2 !important; + color: #a0a6c2 !important; +} +/* ---------- G-code / Zusatz-Scopes (name = G/M-Codes, attr = Parameter) ---------- */ +.hljs-name { color: #e0af68; } +.hljs-attr { color: #a9b1d6; } +html.theme-light .hljs-name { color: #2e7de9; } +html.theme-light .hljs-attr { color: #a0a6c2; } \ No newline at end of file