chore: release v0.24.4

CHANGELOG.md

@@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.24.4] - 2026-04-26
+
+### Added
+- Accessibility: `layout.css` now has a `@media (prefers-contrast: more)` block — ghost and secondary buttons get explicit borders, cards lose decorative shadows, form inputs get a 2px border, focus rings become thicker (3px, 4px offset), and active nav items get an underline as a colour-independent indicator
+
+### Fixed
+- Design tokens: corrected `--sidebar-width-expanded` comment from `1280px+` to `1440px+` to match the actual breakpoint in `layout.css`
+
 ## [0.24.3] - 2026-04-26
 
 ### Added

package-lock.json

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

package.json

@@ -1,6 +1,6 @@
 {
   "name": "oikos",
-  "version": "0.24.3",
+  "version": "0.24.4",
   "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/styles/layout.css

@@ -2025,6 +2025,52 @@ button svg { pointer-events: none; }
 /* Textarea: vertikale Größenänderung ist nutzbar */
 textarea.input { resize: vertical; }
 
+/* --------------------------------------------------------
+ * High Contrast (prefers-contrast: more)
+ * Tokens in tokens.css stellen bereits opake Glass-Werte bereit.
+ * Hier kommen komponentenspezifische Korrekturen hinzu.
+ * -------------------------------------------------------- */
+@media (prefers-contrast: more) {
+  /* Fokus: dicker und weiter versetzt */
+  :focus-visible {
+    outline-width: 3px;
+    outline-offset: 4px;
+  }
+
+  /* Ghost- und Secondary-Buttons: explizite Umrandung */
+  .btn--ghost,
+  .btn--secondary {
+    border: 1.5px solid currentColor;
+  }
+
+  .btn--ghost:hover {
+    background-color: var(--color-surface-3);
+  }
+
+  /* Karten: Schatten entfernen, Border verstärken */
+  .card {
+    box-shadow: none;
+    border: 1px solid var(--color-border);
+  }
+
+  .card--flat {
+    border-color: var(--color-text-secondary);
+  }
+
+  /* Formulareingaben: kräftigere Border */
+  .input,
+  .form-input {
+    border-color: var(--color-text-primary);
+    border-width: 2px;
+  }
+
+  /* Aktiver Nav-Eintrag: zusätzliche Unterstreichung als farb-unabhängiger Indikator */
+  .nav-item[aria-current="page"] {
+    text-decoration: underline;
+    text-underline-offset: 3px;
+  }
+}
+
 /* --------------------------------------------------------
  * Windows High Contrast / Forced Colors
  * -------------------------------------------------------- */

public/styles/tokens.css

@@ -324,7 +324,7 @@
   --nav-height-mobile: 56px;
   --nav-bottom-height: calc(var(--nav-height-mobile) + 12px); /* scroll (56px) + dots-indicator (12px) */
   --sidebar-width: 56px;             /* collapsed icon-only (1024–1279px) */
-  --sidebar-width-expanded: 220px;   /* full sidebar (1280px+), max 240px laut Spec */
+  --sidebar-width-expanded: 220px;   /* full sidebar (1440px+), max 240px laut Spec */
   --content-max-width: 1280px;
   --content-max-width-narrow: 720px;
   --cal-hour-height: 56px;