chore: release v0.23.7

CHANGELOG.md

@@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.23.7] - 2026-04-22
+
+### Fixed
+- Navigation: sidebar logo now uses the official `docs/logo.svg` artwork (house + chimney on gradient background) instead of a generic Lucide home icon; gradient colors are driven by CSS tokens
+
 ## [0.23.6] - 2026-04-22
 
 ### Changed

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "oikos",
-  "version": "0.23.6",
+  "version": "0.23.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "oikos",
-      "version": "0.23.6",
+      "version": "0.23.7",
       "license": "MIT",
       "dependencies": {
         "bcrypt": "^6.0.0",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "oikos",
-  "version": "0.23.6",
+  "version": "0.23.7",
   "description": "Self-hosted family planner - calendar, tasks, shopping, meal planning, budget and more. Private, open-source, no subscription.",
   "main": "server/index.js",
   "type": "module",

public/router.js

@@ -303,23 +303,42 @@ function renderAppShell(container) {
   const sidebarLogo = document.createElement('div');
   sidebarLogo.className = 'nav-sidebar__logo';
 
-  // SVG-Logomark: Haus-Symbol (Lucide "home" path, 24×24 viewBox)
+  // SVG-Logomark aus docs/logo.svg — Gradient via CSS-Tokens
   const logomark = document.createElement('div');
   logomark.className = 'nav-sidebar__logomark';
   logomark.setAttribute('aria-hidden', 'true');
-  const logoSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+  const SVG_NS = 'http://www.w3.org/2000/svg';
-  logoSvg.setAttribute('viewBox', '0 0 24 24');
+  const logoSvg = document.createElementNS(SVG_NS, 'svg');
+  logoSvg.setAttribute('viewBox', '0 0 160 160');
   logoSvg.setAttribute('fill', 'none');
-  logoSvg.setAttribute('stroke', 'currentColor');
+  const defs = document.createElementNS(SVG_NS, 'defs');
-  logoSvg.setAttribute('stroke-width', '2.5');
+  const grad = document.createElementNS(SVG_NS, 'linearGradient');
-  logoSvg.setAttribute('stroke-linecap', 'round');
+  grad.setAttribute('id', 'oikos-logo-bg');
-  logoSvg.setAttribute('stroke-linejoin', 'round');
+  grad.setAttribute('x1', '0'); grad.setAttribute('y1', '0');
-  const housePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+  grad.setAttribute('x2', '160'); grad.setAttribute('y2', '160');
-  housePath.setAttribute('d', 'M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z');
+  grad.setAttribute('gradientUnits', 'userSpaceOnUse');
-  const doorPath = document.createElementNS('http://www.w3.org/2000/svg', 'polyline');
+  const stop0 = document.createElementNS(SVG_NS, 'stop');
-  doorPath.setAttribute('points', '9 22 9 12 15 12 15 22');
+  stop0.setAttribute('offset', '0%');
+  stop0.style.stopColor = 'var(--color-accent)';
+  const stop1 = document.createElementNS(SVG_NS, 'stop');
+  stop1.setAttribute('offset', '100%');
+  stop1.style.stopColor = 'var(--color-accent-secondary)';
+  grad.appendChild(stop0); grad.appendChild(stop1);
+  defs.appendChild(grad);
+  logoSvg.appendChild(defs);
+  const bgRect = document.createElementNS(SVG_NS, 'rect');
+  bgRect.setAttribute('width', '160'); bgRect.setAttribute('height', '160');
+  bgRect.setAttribute('rx', '36'); bgRect.setAttribute('fill', 'url(#oikos-logo-bg)');
+  logoSvg.appendChild(bgRect);
+  const housePath = document.createElementNS(SVG_NS, 'path');
+  housePath.setAttribute('d', 'M80 36L36 72V120C36 122.2 37.8 124 40 124H68V96H92V124H120C122.2 124 124 122.2 124 120V72L80 36Z');
+  housePath.setAttribute('fill', 'white');
   logoSvg.appendChild(housePath);
-  logoSvg.appendChild(doorPath);
+  const chimney = document.createElementNS(SVG_NS, 'rect');
+  chimney.setAttribute('x', '100'); chimney.setAttribute('y', '46');
+  chimney.setAttribute('width', '12'); chimney.setAttribute('height', '22');
+  chimney.setAttribute('rx', '2'); chimney.setAttribute('fill', 'white');
+  logoSvg.appendChild(chimney);
   logomark.appendChild(logoSvg);
   sidebarLogo.appendChild(logomark);
 

public/styles/layout.css

@@ -546,22 +546,17 @@
     flex-shrink: 0;
   }
 
-  /* SVG-Logomark (via DOM API in router.js injiziert) */
+  /* SVG-Logomark (via DOM API in router.js injiziert, Gradient im SVG selbst) */
   .nav-sidebar__logomark {
     width: var(--target-sm);
     height: var(--target-sm);
-    border-radius: var(--radius-sm);
-    background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-accent-secondary) 100%);
-    color: var(--color-text-on-accent);
-    display: flex;
-    align-items: center;
-    justify-content: center;
     flex-shrink: 0;
   }
 
   .nav-sidebar__logomark svg {
-    width: 16px;
+    width: 100%;
-    height: 16px;
+    height: 100%;
+    display: block;
   }
 
   /* Logo-Text verstecken im collapsed-Modus */
@@ -667,6 +662,7 @@
   .nav-sidebar__logomark {
     width: 28px;
     height: 28px;
+    flex-shrink: 0;
   }
 
   .nav-sidebar__logo > span {