From cb09c5d0dbe6d8124888c7d127a8400c71cc2ae5 Mon Sep 17 00:00:00 2001
From: Ulas Kalayci <ulas.kalayci@googlemail.com>
Date: Sun, 26 Apr 2026 08:25:26 +0200
Subject: [PATCH] chore: release v0.24.2

---
 CHANGELOG.md                | 8 ++++++++
 package-lock.json           | 4 ++--
 package.json                | 2 +-
 public/styles/dashboard.css | 6 +++---
 public/styles/reminders.css | 6 +++---
 public/styles/tokens.css    | 8 ++++++++
 6 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 035b5d2..193364f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.24.2] - 2026-04-26
+
+### Fixed
+- Design tokens: added missing `--shadow-xl` and `--shadow-xs` tokens (with dark mode variants) — resolves undefined CSS custom property references in kanban drag ghost and dashboard widget toggle
+- Design tokens: `--color-surface-raised` replaced with `--color-surface-hover` in `dashboard.css` — was undefined, causing unstyled hover states in the widget customizer
+- Design tokens: `--color-text` replaced with `--color-text-primary` in `dashboard.css` — was undefined, causing invisible text on hover in the widget customizer
+- Design tokens: hardcoded `font-weight` values (`700`, `500`, `600`) in `reminders.css` replaced with `--font-weight-bold`, `--font-weight-medium`, `--font-weight-semibold`
+
 ## [0.24.1] - 2026-04-25
 
 ### Fixed
diff --git a/package-lock.json b/package-lock.json
index eea26e8..885de36 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "oikos",
-  "version": "0.24.1",
+  "version": "0.24.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "oikos",
-      "version": "0.24.1",
+      "version": "0.24.2",
       "license": "MIT",
       "dependencies": {
         "bcrypt": "^6.0.0",
diff --git a/package.json b/package.json
index ae257c6..d93a3a6 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "oikos",
-  "version": "0.24.1",
+  "version": "0.24.2",
   "description": "Self-hosted family planner - calendar, tasks, shopping, meal planning, budget and more. Private, open-source, no subscription.",
   "main": "server/index.js",
   "type": "module",
diff --git a/public/styles/dashboard.css b/public/styles/dashboard.css
index 9f4977e..b943cb1 100644
--- a/public/styles/dashboard.css
+++ b/public/styles/dashboard.css
@@ -1125,7 +1125,7 @@
 }
 
 .customize-row:hover {
-  background-color: var(--color-surface-raised);
+  background-color: var(--color-surface-hover);
 }
 
 .customize-row__toggle {
@@ -1212,8 +1212,8 @@
 }
 
 .customize-row__btn:hover:not(:disabled) {
-  background-color: var(--color-surface-raised);
-  color: var(--color-text);
+  background-color: var(--color-surface-hover);
+  color: var(--color-text-primary);
 }
 
 .customize-row__btn:disabled {
diff --git a/public/styles/reminders.css b/public/styles/reminders.css
index 6038df7..a7f6cf2 100644
--- a/public/styles/reminders.css
+++ b/public/styles/reminders.css
@@ -19,7 +19,7 @@
   background: var(--color-priority-urgent);
   color: var(--color-text-on-accent);
   font-size: var(--text-2xs);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold);
   line-height: 16px;
   text-align: center;
   pointer-events: none;
@@ -57,7 +57,7 @@
 
 .toast__reminder-text span {
   font-size: var(--text-sm, 0.875rem);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -79,7 +79,7 @@
 
 .reminder-section__title {
   font-size: var(--text-sm, 0.875rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold);
   color: var(--color-text-primary);
 }
 
diff --git a/public/styles/tokens.css b/public/styles/tokens.css
index e49104c..fbcd122 100644
--- a/public/styles/tokens.css
+++ b/public/styles/tokens.css
@@ -244,6 +244,10 @@
   --shadow-md:  var(--_shadow-md);
   --_shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04);
   --shadow-lg:  var(--_shadow-lg);
+  --_shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.06);
+  --shadow-xl:  var(--_shadow-xl);
+  --_shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.08);
+  --shadow-xs:  var(--_shadow-xs);
 
   /* --------------------------------------------------------
    * 9. Border-Radien
@@ -542,6 +546,8 @@
     --_shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.25);
     --_shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
     --_shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.45);
+    --_shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.60), 0 4px 12px rgba(0, 0, 0, 0.25);
+    --_shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.30);
 
     --_glass-bg:               rgba(28, 28, 26, 0.75);
     --_glass-bg-hover:         rgba(38, 38, 36, 0.82);
@@ -647,6 +653,8 @@
     --_shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.25);
     --_shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
     --_shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.45);
+    --_shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.60), 0 4px 12px rgba(0, 0, 0, 0.25);
+    --_shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.30);
 
     /* Glass */
     --_glass-bg:              rgba(28, 28, 26, 0.75);