diff --git a/README.md b/README.md index 028d2e4..4c6d8bc 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,16 @@ -# Trilium Share – Harbor Blog System +# Trilium Share – Coffee Blog System [![License](https://img.shields.io/badge/License-GPL--3.0-fb4934)](LICENSE) [![Live demo](https://img.shields.io/badge/Live%20demo-richard.familie--zink.org-8ec07c)](https://richard.familie-zink.org) [![TriliumNext](https://img.shields.io/badge/TriliumNext-Public%20Share-83a598)](https://github.com/TriliumNext/Trilium) -[![Theme](https://img.shields.io/badge/Theme-Harbor-e75a50)](https://github.com/HANCORE-linux/omarchy-harbor-theme) +[![Theme](https://img.shields.io/badge/Theme-Coffee-e0a15c)](https://github.com/megabyte0x/omarchy-coffee-theme) [![Built with](https://img.shields.io/badge/Built%20with-Opencode-fe8019)](https://opencode.ai) [![Model](https://img.shields.io/badge/Model-Deepseek%20V4%20Flash-d3869b)](https://www.deepseek.com/) > **Note:** This theme and blog system was created with the help of > [**Opencode**](https://opencode.ai) and **Deepseek V4 Flash**. -A complete **public-share blog system + Harbor theme** for [TriliumNext](https://github.com/TriliumNext/Trilium). +A complete **public-share blog system + Coffee theme** for [TriliumNext](https://github.com/TriliumNext/Trilium). It turns a normal Trilium note tree into a themed, searchable blog with categories, an RSS feed, a sitemap, a digital garden (growth states) and client-side rendering of Mermaid, Excalidraw and mind-map notes. @@ -18,13 +18,13 @@ mind-map notes. Everything is driven by Trilium's built-in **Public Share** feature plus a few frontend/backend scripts – no external dependencies (except `highlight.js`, vendored in `lib/`). -![Harbor palette](assets/palette.png) +![Coffee palette](assets/palette.png) -*Palette from the [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (Harbor light / Harbordark) repository, MIT licensed.* +*Palette from the [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (Coffee / Coffee Latte) repository, MIT licensed.* ## Features -- Harbor light/dark theme for the share, with a theme toggle in the header. +- Coffee dark / Coffee Latte light theme for the share, with a theme toggle in the header. - Blog index, category pages, sub-categories, tags and tag overview. - **Menu sorting**: articles in the left menu are sorted by publication date (newest first) and labelled `Fri 2026-08-28 ` automatically. All date displays @@ -66,7 +66,7 @@ no external dependencies (except `highlight.js`, vendored in `lib/`). |---|---|---| | `blog_generator.js` | backend script that generates index, feed, sitemap, search data, category & tag pages | code, `application/javascript;env=backend` | | `blog_publish_manager.js` | backend script that mirrors notes between `Unpublished` and the blog | code, `application/javascript;env=backend` | -| `theme/blog_share_theme.css` | the Harbor share theme (Harbor light / Harbordark) | code, `text/css` | +| `theme/blog_share_theme.css` | the Coffee share theme (Coffee / Coffee Latte) | code, `text/css` | | `theme/favicon.svg` | default site favicon | code (SVG) | | `theme/cookie.woff2` | "Cookie" font for the Buy me a coffee button | file, `font/woff2` | | `lib/highlight.js` | vendored highlight.js | code, `application/javascript` | @@ -297,7 +297,7 @@ server { ## Customisation -- **Theme**: edit `theme/blog_share_theme.css` (Harbor light/dark via `html.theme-light/dark`). +- **Theme**: edit `theme/blog_share_theme.css` (Coffee / Coffee Latte via `html.theme-light/dark`). - **Buy me a coffee**: edit `scripts/bmc_button.js` (link, text, copyright) – the font is referenced via `__COOKIE_FONT_ID__`. - **Category logos**: copy the `examples/` icon + `ignis8_menu_icon.js` pattern to give a diff --git a/THIRD_PARTY_LICENSES.md b/THIRD_PARTY_LICENSES.md index 2734cdf..3826dbc 100644 --- a/THIRD_PARTY_LICENSES.md +++ b/THIRD_PARTY_LICENSES.md @@ -8,8 +8,8 @@ The following files in this repository are **not** covered by the GPL-3.0 and ke | `lib/highlight.js` | [Highlight.js](https://github.com/highlightjs/highlight.js) v11.9.0 | [BSD-3-Clause](#bsd-3-clause) | | `lib/hljs_line_numbers.js` | [highlightjs-line-numbers](https://github.com/yury-dymov/highlightjs-line-numbers) | [MIT](#mit-license) | | `theme/cookie.woff2` | "Cookie" font, © 2011 [Ania Kruk](https://fonts.google.com/specimen/Cookie) | [SIL Open Font License 1.1](https://openfontlicense.org/) | -| `assets/palette.png` | Harbor / Harbordark palette image generated from [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (repo: MIT) | [MIT](#mit-license) | -| `theme/blog_share_theme.css` | Harbor light / Harbordark color scheme from [HANCORE-linux/omarchy-harbor-theme](https://github.com/HANCORE-linux/omarchy-harbor-theme) (repo: MIT) | [MIT](#mit-license) | +| `assets/palette.png` | Coffee / Coffee Latte palette image generated from [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (repo: MIT) | [MIT](#mit-license) | +| `theme/blog_share_theme.css` | Coffee / Coffee Latte color scheme from [megabyte0x/omarchy-coffee-theme](https://github.com/megabyte0x/omarchy-coffee-theme) (repo: MIT) | [MIT](#mit-license) | | `lib/3d/three.min.js`, `lib/3d/OrbitControls.js`, `lib/3d/STLLoader.js` | [three.js](https://github.com/mrdoob/three.js) r128 | [MIT](#mit-license) | | `lib/3d/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) | diff --git a/assets/palette.png b/assets/palette.png index b5bf87b..e42e721 100644 Binary files a/assets/palette.png and b/assets/palette.png differ diff --git a/scripts/3d_model_viewer.js b/scripts/3d_model_viewer.js index f81b34d..77fc5d3 100644 --- a/scripts/3d_model_viewer.js +++ b/scripts/3d_model_viewer.js @@ -233,7 +233,7 @@ var renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setSize(initSize.w, initSize.h); var isLight = document.documentElement.classList.contains("theme-light"); - renderer.setClearColor(isLight ? 0xe8ecd0 : 0x1b1b1b, 1); + renderer.setClearColor(isLight ? 0xE8E3C3 : 0x1d150f, 1); var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera(45, initSize.w / initSize.h, 0.1, 1000000); @@ -309,7 +309,7 @@ geo.setAttribute("position", new THREE.Float32BufferAttribute(e.data.positions, 3)); if (e.data.indices) geo.setIndex(new THREE.BufferAttribute(e.data.indices, 1)); fixWinding(geo); - var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x5e81ac : 0x77838a, metalness: 0.2, roughness: 0.6, side: THREE.DoubleSide, flatShading: false }); + var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x8e2d53 : 0xe0a15c, metalness: 0.2, roughness: 0.6, side: THREE.DoubleSide, flatShading: false }); chunkGeometry(geo, group, mat); var tris = (e.data.indices && e.data.indices.length) ? e.data.indices.length / 3 : e.data.positions.length / 9; fit(); @@ -331,7 +331,7 @@ } else { var geo = new THREE.STLLoader().parse(data.buffer); geo.computeVertexNormals(); - var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x5e81ac : 0x77838a, metalness: 0.25, roughness: 0.55, flatShading: true }); + var mat = new THREE.MeshStandardMaterial({ color: isLight ? 0x8e2d53 : 0xe0a15c, metalness: 0.25, roughness: 0.55, flatShading: true }); group.add(new THREE.Mesh(geo, mat)); fit(); showCanvas(); diff --git a/theme/blog_share_theme.css b/theme/blog_share_theme.css index 08d4dc3..fc5d43a 100644 --- a/theme/blog_share_theme.css +++ b/theme/blog_share_theme.css @@ -1,41 +1,41 @@ /* - * Harbor Share Theme for Richard's Blog (Trilium Public Share) - * Light: Harbor (paper #dfe4c4 / ink #1c2d28, accent #5e81ac) - * Dark: Harbordark (#1b1b1b / #efebdc, accent #e75a50) - * Based on https://github.com/HANCORE-linux/omarchy-harbor-theme (MIT) + * Coffee Share Theme for Richard's Blog (Trilium Public Share) + * Light: Coffee Latte (cream #E8E3C3 / ink #2D1A1D, accent #8e2d53) + * Dark: Coffee (espresso #1d150f / latte-cream #f0e2d0, accent #e0a15c) + * Based on https://github.com/megabyte0x/omarchy-coffee-theme (MIT) */ html.theme-light { - --background-primary: #dfe4c4; - --background-secondary: #d0d6b4; - --background-highlight: #c3c9a6; - --background-active: #5e81ac; - --blog-card-bg: #d0d6b4; - --scrollbar-thumb: #c3c9a6; - --scrollbar-hover: #b3ba96; - --scrollbar-track: #d0d6b4; - --text-primary: #1c2d28; - --text-heading: #1c2d28; - --text-menu: #556753; - --text-link: #4c6c94; - --text-menu-active: #dfe4c4; + --background-primary: #E8E3C3; + --background-secondary: #eae6c9; + --background-highlight: #c5c1a6; + --background-active: #8e2d53; + --blog-card-bg: #eae6c9; + --scrollbar-thumb: #c5c1a6; + --scrollbar-hover: #aeaa92; + --scrollbar-track: #eae6c9; + --text-primary: #2D1A1D; + --text-heading: #2D1A1D; + --text-menu: #4f6b00; + --text-link: #8e2d53; + --text-menu-active: #E8E3C3; color-scheme: light; } html.theme-dark { - --background-primary: #1b1b1b; - --background-secondary: #232323; - --background-highlight: #2e2e2e; - --background-active: #e75a50; - --blog-card-bg: #262626; - --scrollbar-thumb: #2e2e2e; - --scrollbar-hover: #3f3f3f; - --scrollbar-track: #1b1b1b; - --text-primary: #efebdc; - --text-heading: #efebdc; - --text-menu: #a99b7a; - --text-link: #e58980; - --text-menu-active: #1b1b1b; + --background-primary: #1d150f; + --background-secondary: #2d2118; + --background-highlight: #3a2a20; + --background-active: #e0a15c; + --blog-card-bg: #35291f; + --scrollbar-thumb: #3a2a20; + --scrollbar-hover: #4a3a30; + --scrollbar-track: #1d150f; + --text-primary: #f0e2d0; + --text-heading: #f0e2d0; + --text-menu: #8f7a67; + --text-link: #ec8f89; + --text-menu-active: #1d150f; color-scheme: dark; } @@ -139,8 +139,8 @@ body { padding: 6px 12px 8px; border-radius: 8px; background: #fabd2f; - color: #1c2d28; - border: 2px solid #1c2d28; + color: #2D1A1D; + border: 2px solid #2D1A1D; font-family: "Cookie", "Brush Script MT", cursive; font-size: 1.4em; line-height: 1.1; @@ -149,8 +149,8 @@ body { } .bmc-btn:hover { - background: #dc8164; - color: #1c2d28; + background: #b25d76; + color: #2D1A1D; text-decoration: none; transform: translateY(-1px); } @@ -333,18 +333,18 @@ body { } html.theme-light .blog-search-header-input { - border-color: #4c6c94; + border-color: #8e2d53; background: rgba(76, 108, 148, 0.10); } .blog-search-header-input:focus { outline: none; - border-color: #77838a; + border-color: #cf90a2; box-shadow: 0 0 0 2px rgba(119, 131, 138, 0.20); } html.theme-light .blog-search-header-input:focus { - border-color: #4c6c94; + border-color: #8e2d53; box-shadow: 0 0 0 2px rgba(76, 108, 148, 0.15); } @@ -353,7 +353,7 @@ html.theme-light .blog-search-header-input:focus { } html.theme-light .search-item .search-icon { - color: #4c6c94; + color: #8e2d53; } .tn-image { @@ -769,33 +769,33 @@ html.theme-light { /* ---------- Code blocks - Harbordark (always, also in light mode) ---------- */ .ck-content pre, #content pre { - background-color: #222222; - color: #efebdc; - border: 1px solid #2e2e2e; + background-color: #2d2118; + color: #f0e2d0; + border: 1px solid #3a2a20; border-radius: 8px; } .ck-content code, #content code { - background-color: #2a2a2a; - color: #efebdc; - border-color: #3f3f3f; + background-color: #3a2a20; + color: #f0e2d0; + border-color: #4a3a30; border-radius: 8px; padding: 0.1em 0.35em; } html.theme-light .ck-content pre, html.theme-light #content pre { - background-color: #e8ecd0; - color: #1c2d28; - border-color: #c3c9a6; + background-color: #eae6c9; + color: #2D1A1D; + border-color: #c5c1a6; } html.theme-light .ck-content code, html.theme-light #content code { - background-color: #cdd3b0; - color: #1c2d28; - border-color: #b3ba96; + background-color: #dcd8b8; + color: #2D1A1D; + border-color: #aeaa92; } /* ---------- Eingebettete Bilder: Radius wie Code-Blöcke (8px) ---------- */ @@ -815,7 +815,7 @@ html.theme-light #content code { width: calc(100vw - 24px); margin: 1em 0; margin-left: calc(50% - (100vw - 24px) / 2); - background: #1b1b1b; + background: #1d150f; border: 1px solid var(--background-highlight); border-radius: 8px; overflow: hidden; @@ -833,9 +833,9 @@ html.theme-light #content code { z-index: 3; display: none; font-size: 0.75em; - color: #a99b7a; + color: #8f7a67; background: rgba(27, 27, 27, 0.85); - border: 1px solid #2e2e2e; + border: 1px solid #3a2a20; border-radius: 6px; padding: 2px 10px; font-variant-numeric: tabular-nums; @@ -858,12 +858,12 @@ html.theme-light #content code { text-align: center; padding: 48px; box-sizing: border-box; - color: #a99b7a; + color: #8f7a67; font-size: 0.9em; } .model-viewer-status.error { - color: #F44336; + color: #d78a6f; } .model-viewer-progress { @@ -874,7 +874,7 @@ html.theme-light #content code { height: 6px; width: min(60%, 480px); margin: 0 auto; - background: #2a2a2a; + background: #3a2a20; border-radius: 3px; overflow: hidden; } @@ -882,7 +882,7 @@ html.theme-light #content code { .model-viewer-progress-fill { height: 100%; width: 0; - background: #E1CE98; + background: #ffda92; border-radius: 3px; transition: width 150ms ease; } @@ -902,7 +902,7 @@ html.theme-light #content code { top: 8px; left: 10px; font-size: 0.75em; - color: #a99b7a; + color: #8f7a67; z-index: 2; pointer-events: none; } @@ -925,25 +925,25 @@ html.theme-light #content code { /* ---------- 3D-Viewer: theme-bewusste Overlays ---------- */ html.theme-light .model-viewer { - background: #e8ecd0; + background: #eae6c9; } html.theme-light .model-viewer-status, html.theme-light .model-viewer-hint, html.theme-light .model-viewer-data { - color: #1c2d28; + color: #2D1A1D; } html.theme-light .model-viewer-data { background: rgba(223, 228, 196, 0.85); - border-color: #c3c9a6; + border-color: #c5c1a6; } html.theme-light .model-viewer-status.error { - color: #b14752; + color: #a4405e; } html.theme-light .model-viewer-progress { - background: #c3c9a6; + background: #c5c1a6; } html.theme-light .model-viewer-progress-fill { - background: #5e81ac; + background: #8e2d53; } /* ---------- Bildunterschriften (Harbor) ---------- */ @@ -961,19 +961,19 @@ html.theme-light .model-viewer-progress-fill { } .hljs { - background: #222222; - color: #efebdc; + background: #2d2118; + color: #f0e2d0; } .hljs-comment, .hljs-quote { - color: #817f68; + color: #8f7a67; } .hljs-keyword, .hljs-selector-tag, .hljs-subst { - color: #F44336; + color: #d78a6f; } .hljs-number, @@ -981,24 +981,24 @@ html.theme-light .model-viewer-progress-fill { .hljs-variable, .hljs-template-variable, .hljs-tag .hljs-attr { - color: #e58980; + color: #ec8f89; } .hljs-string, .hljs-doctag { - color: #a99b7a; + color: #8f7a67; } .hljs-title, .hljs-section, .hljs-selector-id { - color: #E1CE98; + color: #ffda92; } .hljs-type, .hljs-class .hljs-title, .hljs-attribute { - color: #77838a; + color: #cf90a2; } .hljs-symbol, @@ -1007,13 +1007,13 @@ html.theme-light .model-viewer-progress-fill { .hljs-meta, .hljs-deletion, .hljs-addition { - color: #e58980; + color: #ec8f89; } .hljs-built_in, .hljs-builtin-name, .hljs-params { - color: #77838a; + color: #cf90a2; } .hljs-emphasis { @@ -1026,19 +1026,19 @@ html.theme-light .model-viewer-progress-fill { /* ---------- Light mode: Harbor light highlighter ---------- */ html.theme-light .hljs, html.theme-light pre code.hljs { - background: #e8ecd0 !important; - color: #1c2d28; + background: #eae6c9 !important; + color: #2D1A1D; } html.theme-light .hljs-comment, html.theme-light .hljs-quote { - color: #7d8794; + color: #76756f; } html.theme-light .hljs-keyword, html.theme-light .hljs-selector-tag, html.theme-light .hljs-subst { - color: #b14752; + color: #a4405e; } html.theme-light .hljs-number, @@ -1046,24 +1046,24 @@ html.theme-light .hljs-literal, html.theme-light .hljs-variable, html.theme-light .hljs-template-variable, html.theme-light .hljs-tag .hljs-attr { - color: #8a5b81; + color: #7a003b; } html.theme-light .hljs-string, html.theme-light .hljs-doctag { - color: #556753; + color: #4f6b00; } html.theme-light .hljs-title, html.theme-light .hljs-section, html.theme-light .hljs-selector-id { - color: #dc8164; + color: #b25d76; } html.theme-light .hljs-type, html.theme-light .hljs-class .hljs-title, html.theme-light .hljs-attribute { - color: #4c6c94; + color: #8e2d53; } html.theme-light .hljs-symbol, @@ -1072,13 +1072,13 @@ html.theme-light .hljs-link, html.theme-light .hljs-meta, html.theme-light .hljs-deletion, html.theme-light .hljs-addition { - color: #8a5b81; + color: #7a003b; } html.theme-light .hljs-built_in, html.theme-light .hljs-builtin-name, html.theme-light .hljs-params { - color: #3d727d; + color: #4f6b00; } html.theme-light .hljs-regexp, @@ -1087,16 +1087,16 @@ html.theme-light .hljs-selector-attr, html.theme-light .hljs-selector-pseudo, html.theme-light .hljs-selector-class, html.theme-light .hljs-template-tag { - color: #8a5b81; + color: #7a003b; } html.theme-light .hljs-name, html.theme-light .hljs-tag { - color: #4c6c94; + color: #8e2d53; } html.theme-light .hljs-meta .hljs-string { - color: #556753; + color: #4f6b00; } /* ---------- Admonitions (Trilium-style, gefüllt) ---------- */ .admonition { @@ -1135,11 +1135,11 @@ html.theme-light .admonition.warning { --admonition-bg: rgba(220, 129, 100, 0.20 margin-top: 0; } -.admonition.note { --accent-color: #4c6c94; } -.admonition.tip { --accent-color: #556753; } -.admonition.important { --accent-color: #8a5b81; } -.admonition.caution { --accent-color: #b14752; } -.admonition.warning { --accent-color: #dc8164; } +.admonition.note { --accent-color: #8e2d53; } +.admonition.tip { --accent-color: #4f6b00; } +.admonition.important { --accent-color: #7a003b; } +.admonition.caution { --accent-color: #a4405e; } +.admonition.warning { --accent-color: #b25d76; } .admonition::before { color: var(--accent-color); @@ -1157,22 +1157,22 @@ html.theme-light .admonition.warning { --admonition-bg: rgba(220, 129, 100, 0.20 /* ---------- Tables (Harbor, theme-aware) ---------- */ html.theme-dark { --table-header-bg: rgba(231, 90, 80, 0.20); - --table-header-text: #efebdc; + --table-header-text: #f0e2d0; --table-header-border: rgba(231, 90, 80, 0.45); --table-stripe: rgba(255, 255, 255, 0.04); --table-hover: rgba(231, 90, 80, 0.12); --table-rowlabel-bg: rgba(255, 255, 255, 0.05); - --table-rowlabel-text: #efebdc; + --table-rowlabel-text: #f0e2d0; } html.theme-light { --table-header-bg: rgba(94, 129, 172, 0.16); - --table-header-text: #1c2d28; + --table-header-text: #2D1A1D; --table-header-border: rgba(94, 129, 172, 0.40); --table-stripe: rgba(0, 0, 0, 0.04); --table-hover: rgba(94, 129, 172, 0.12); --table-rowlabel-bg: rgba(0, 0, 0, 0.05); - --table-rowlabel-text: #1c2d28; + --table-rowlabel-text: #2D1A1D; } .ck-content table, @@ -1326,7 +1326,7 @@ html.theme-light { } .note-state i { - color: #a99b7a; + color: #8f7a67; } .note-state.state-draft { @@ -1342,7 +1342,7 @@ html.theme-light { } .note-state.state-review i { - color: #77838a; + color: #cf90a2; } .note-state.state-unknown { @@ -1350,81 +1350,81 @@ html.theme-light { } .note-state.state-unknown i { - color: #F44336; + color: #d78a6f; } /* ---------- Peppige Garden-Badges (dark) ---------- */ html.theme-dark .note-state { background: rgba(169, 155, 122, 0.40); - border: 1px solid #a99b7a; - color: #1b1b1b; + border: 1px solid #8f7a67; + color: #1d150f; } html.theme-dark .note-state i { - color: #1b1b1b; + color: #1d150f; } html.theme-dark .note-state.state-draft { background: rgba(244, 67, 54, 0.85); - border-color: #ff8a7f; - color: #1b1b1b; + border-color: #e8a086; + color: #1d150f; } html.theme-dark .note-state.state-draft i { - color: #1b1b1b; + color: #1d150f; } html.theme-dark .note-state.state-review { background: rgba(76, 108, 148, 0.85); - border-color: #8fb4e0; - color: #1b1b1b; + border-color: #e0a3b3; + color: #1d150f; } html.theme-dark .note-state.state-review i { - color: #1b1b1b; + color: #1d150f; } html.theme-dark .note-state.state-unknown { background: rgba(225, 206, 152, 0.85); - border-color: #f2e4b8; - color: #1b1b1b; + border-color: #ffe0a0; + color: #1d150f; } html.theme-dark .note-state.state-unknown i { - color: #1b1b1b; + color: #1d150f; } /* ---------- Peppige Garden-Badges (light) ---------- */ html.theme-light .note-state { background: rgba(85, 103, 83, 0.85); - border: 1px solid #556753; - color: #dfe4c4; + border: 1px solid #4f6b00; + color: #E8E3C3; } html.theme-light .note-state i { - color: #dfe4c4; + color: #E8E3C3; } html.theme-light .note-state.state-draft { background: rgba(220, 129, 100, 0.95); - border-color: #b85f3f; - color: #1c2d28; + border-color: #8a3c2e; + color: #2D1A1D; } html.theme-light .note-state.state-draft i { - color: #1c2d28; + color: #2D1A1D; } html.theme-light .note-state.state-review { background: rgba(94, 129, 172, 0.95); - border-color: #3d5f8a; - color: #dfe4c4; + border-color: #6b2a3d; + color: #E8E3C3; } html.theme-light .note-state.state-review i { - color: #dfe4c4; + color: #E8E3C3; } html.theme-light .note-state.state-unknown { background: rgba(177, 71, 82, 0.95); - border-color: #8f3a40; - color: #dfe4c4; + border-color: #7a2b30; + color: #E8E3C3; } html.theme-light .note-state.state-unknown i { - color: #dfe4c4; + color: #E8E3C3; } /* ---------- Code notes: always Harbordark like code boxes ---------- */ #content.type-code pre { - background-color: #222222 !important; - color: #efebdc; - border: 1px solid #2e2e2e; + background-color: #2d2118 !important; + color: #f0e2d0; + border: 1px solid #3a2a20; border-radius: 8px; padding: 1em; margin: 1em 0; @@ -1432,18 +1432,18 @@ html.theme-light .note-state.state-unknown i { #content.type-code code { background-color: transparent !important; - color: #efebdc; + color: #f0e2d0; border: 0; } html.theme-light #content.type-code pre { - background-color: #e8ecd0 !important; - color: #1c2d28; - border-color: #c3c9a6; + background-color: #eae6c9 !important; + color: #2D1A1D; + border-color: #c5c1a6; } html.theme-light #content.type-code code { - color: #1c2d28; + color: #2D1A1D; } /* ---------- Code: line numbers + copy button ---------- */ pre.code-processed { @@ -1594,49 +1594,49 @@ html.theme-light #content .hljs-ln tbody tr:hover td.col-hover { pre, pre.code-processed .code-wrap, .hljs-ln-code { - scrollbar-color: #2e2e2e #1b1b1b; + scrollbar-color: #3a2a20 #1d150f; } pre::-webkit-scrollbar-thumb, pre.code-processed .code-wrap::-webkit-scrollbar-thumb, .hljs-ln-code::-webkit-scrollbar-thumb { - background: #2e2e2e; + background: #3a2a20; } pre::-webkit-scrollbar-thumb:hover, pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover, .hljs-ln-code::-webkit-scrollbar-thumb:hover { - background: #3f3f3f; + background: #4a3a30; } pre::-webkit-scrollbar-track, pre.code-processed .code-wrap::-webkit-scrollbar-track, .hljs-ln-code::-webkit-scrollbar-track { - background: #1b1b1b; + background: #1d150f; } html.theme-light pre, html.theme-light pre.code-processed .code-wrap, html.theme-light .hljs-ln-code { - scrollbar-color: #b3ba96 #d0d6b4; + scrollbar-color: #aeaa92 #eae6c9; } html.theme-light pre::-webkit-scrollbar-thumb, html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb, html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb { - background: #b3ba96; + background: #aeaa92; } html.theme-light pre::-webkit-scrollbar-thumb:hover, html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-thumb:hover, html.theme-light .hljs-ln-code::-webkit-scrollbar-thumb:hover { - background: #c3c9a6; + background: #c5c1a6; } html.theme-light pre::-webkit-scrollbar-track, html.theme-light pre.code-processed .code-wrap::-webkit-scrollbar-track, html.theme-light .hljs-ln-code::-webkit-scrollbar-track { - background: #d0d6b4; + background: #eae6c9; } /* ---------- Link icons / markers: internal links without arrow, external links keep a marker ---------- */ @@ -1695,12 +1695,12 @@ html.theme-light .blog-pn { .blog-pn:hover { background: rgba(231, 90, 80, 0.18); - border-color: #e75a50; + border-color: #e0a15c; } html.theme-light .blog-pn:hover { background: rgba(76, 108, 148, 0.15); - border-color: #4c6c94; + border-color: #8e2d53; } /* ---------- Mermaid diagrams - Harbor, theme-following ---------- */ @@ -1728,29 +1728,29 @@ html.theme-dark .mermaid svg text, html.theme-dark .mermaid svg tspan, html.theme-dark .mermaid svg .nodeLabel, html.theme-dark .mermaid svg .edgeLabel p { - fill: #efebdc !important; - color: #efebdc !important; + fill: #f0e2d0 !important; + color: #f0e2d0 !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: #1c2d28 !important; - color: #1c2d28 !important; + fill: #2D1A1D !important; + color: #2D1A1D !important; } /* Graph/node title */ html.theme-dark .mermaid svg .titleText text, html.theme-dark .mermaid svg .node .label .nodeLabel { - fill: #efebdc !important; - color: #efebdc !important; + fill: #f0e2d0 !important; + color: #f0e2d0 !important; } html.theme-light .mermaid svg .titleText text, html.theme-light .mermaid svg .node .label .nodeLabel { - fill: #1c2d28 !important; - color: #1c2d28 !important; + fill: #2D1A1D !important; + color: #2D1A1D !important; } /* Node shapes (rectangles, rounded boxes, ellipses, diamonds) */ @@ -1760,8 +1760,8 @@ html.theme-dark .mermaid svg .node circle, html.theme-dark .mermaid svg .node ellipse, html.theme-dark .mermaid svg .node path, html.theme-dark .mermaid svg .cluster rect { - fill: #232323 !important; - stroke: #77838a !important; + fill: #2d2118 !important; + stroke: #cf90a2 !important; } html.theme-light .mermaid svg .node rect, @@ -1770,8 +1770,8 @@ html.theme-light .mermaid svg .node circle, html.theme-light .mermaid svg .node ellipse, html.theme-light .mermaid svg .node path, html.theme-light .mermaid svg .cluster rect { - fill: #d0d6b4 !important; - stroke: #4c6c94 !important; + fill: #eae6c9 !important; + stroke: #8e2d53 !important; } /* Rounded corners on rectangular node boxes and subgraph clusters (8 px, like the blog cards) */ @@ -1786,101 +1786,101 @@ html.theme-light .mermaid svg .cluster rect { /* Edge lines: stroke only (a filled edge path would look like a polygon) */ html.theme-dark .mermaid svg .edgePaths path { fill: none !important; - stroke: #a99b7a !important; + stroke: #8f7a67 !important; } html.theme-light .mermaid svg .edgePaths path { fill: none !important; - stroke: #7d8794 !important; + stroke: #76756f !important; } /* Arrowheads (markers): filled triangles */ html.theme-dark .mermaid svg marker.flowchart-v2, html.theme-dark .mermaid svg .arrowMarkerPath { - fill: #a99b7a !important; - stroke: #a99b7a !important; + fill: #8f7a67 !important; + stroke: #8f7a67 !important; } html.theme-light .mermaid svg marker.flowchart-v2, html.theme-light .mermaid svg .arrowMarkerPath { - fill: #7d8794 !important; - stroke: #7d8794 !important; + fill: #76756f !important; + stroke: #76756f !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: #1b1b1b !important; - fill: #efebdc !important; - color: #efebdc !important; + background: #1d150f !important; + fill: #f0e2d0 !important; + color: #f0e2d0 !important; } html.theme-dark .mermaid svg .edgeLabel .labelBkg { - fill: #1b1b1b !important; - background: #1b1b1b !important; - color: #efebdc !important; + fill: #1d150f !important; + background: #1d150f !important; + color: #f0e2d0 !important; } html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel { - fill: #efebdc !important; - color: #efebdc !important; - background: #1b1b1b !important; + fill: #f0e2d0 !important; + color: #f0e2d0 !important; + background: #1d150f !important; } html.theme-dark .mermaid svg .edgeLabel .labelBkg .edgeLabel p { - fill: #efebdc !important; - color: #efebdc !important; - background: #1b1b1b !important; + fill: #f0e2d0 !important; + color: #f0e2d0 !important; + background: #1d150f !important; } html.theme-light .mermaid svg g.edgeLabel { - background: #d0d6b4 !important; - fill: #1c2d28 !important; - color: #1c2d28 !important; + background: #eae6c9 !important; + fill: #2D1A1D !important; + color: #2D1A1D !important; } html.theme-light .mermaid svg .edgeLabel .labelBkg { - fill: #d0d6b4 !important; - background: #d0d6b4 !important; - color: #1c2d28 !important; + fill: #eae6c9 !important; + background: #eae6c9 !important; + color: #2D1A1D !important; } html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel { - fill: #1c2d28 !important; - color: #1c2d28 !important; - background: #d0d6b4 !important; + fill: #2D1A1D !important; + color: #2D1A1D !important; + background: #eae6c9 !important; } html.theme-light .mermaid svg .edgeLabel .labelBkg .edgeLabel p { - fill: #1c2d28 !important; - color: #1c2d28 !important; - background: #d0d6b4 !important; + fill: #2D1A1D !important; + color: #2D1A1D !important; + background: #eae6c9 !important; } /* Subgraph cluster border + label */ html.theme-dark .mermaid svg .cluster rect { - stroke: #2e2e2e !important; + stroke: #3a2a20 !important; fill: rgba(27, 27, 27, 0.35) !important; } html.theme-light .mermaid svg .cluster rect { - stroke: #c3c9a6 !important; + stroke: #c5c1a6 !important; fill: rgba(208, 214, 180, 0.40) !important; } html.theme-dark .mermaid svg .cluster .nodeLabel, html.theme-dark .mermaid svg .cluster-label text { - fill: #a99b7a !important; - color: #a99b7a !important; + fill: #8f7a67 !important; + color: #8f7a67 !important; } html.theme-light .mermaid svg .cluster .nodeLabel, html.theme-light .mermaid svg .cluster-label text { - fill: #556753 !important; - color: #556753 !important; + fill: #4f6b00 !important; + color: #4f6b00 !important; } /* ---------- G-code / Zusatz-Scopes (name = G/M-Codes, attr = Parameter) ---------- */ -.hljs-name { color: #E1CE98; } -.hljs-attr { color: #77838a; } -html.theme-light .hljs-name { color: #4c6c94; } -html.theme-light .hljs-attr { color: #556753; } \ No newline at end of file +.hljs-name { color: #ffda92; } +.hljs-attr { color: #cf90a2; } +html.theme-light .hljs-name { color: #8e2d53; } +html.theme-light .hljs-attr { color: #4f6b00; } \ No newline at end of file