From af6e411c85c0dea95db166ca920a645b22f03934 Mon Sep 17 00:00:00 2001
From: Sandro <mail@sandrodach.de>
Date: Fri, 30 Oct 2026 22:58:54 +0100
Subject: [PATCH] fix(workspace): even shading per level in the to-do groups

chore(release): v0.12.1

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 CHANGELOG.md                                  |  8 ++++++-
 frontend/package-lock.json                    |  4 ++--
 frontend/package.json                         |  2 +-
 .../src/features/workspace/WorkspaceView.tsx  | 24 ++++++++++---------
 4 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e6247eb..efcdc72 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,6 +6,11 @@ Das Format folgt [Keep a Changelog](https://keepachangelog.com/de/1.1.0/), die V
 
 ## [Unreleased]
 
+## [0.12.1] - 2026-10-30
+
+### Fixed
+- Workspace → To-Dos: Die Gruppierung (Ordner → Notiz) wird pro Ebene gleichmäßig abgestuft – im hellen Theme jede Ebene etwas dunkler, im dunklen etwas heller – statt zwischen grau und weiß hin und her zu springen.
+
 ## [0.12.0] - 2026-10-30
 
 ### Added
@@ -302,7 +307,8 @@ Das Format folgt [Keep a Changelog](https://keepachangelog.com/de/1.1.0/), die V
 - Geteilte Listen (Einkaufs-, Pack- und Checklisten) mit `#Kategorie`-Gruppierung, Mengenangaben und Echtzeit-Abhaken.
 - Benutzer-, Gruppen- und Admin-Verwaltung (Ersteinrichtungs-Assistent, Einladungscodes, Profilbilder, persönliche API-Keys & Webhook-Ingest `/api/v1/webhooks/ingest`, JSON-Datenexport) sowie CSS-Theme-Engine mit 4 Themes (`Dark`, `Light`, `High Contrast`, `Soft`) und PWA-Unterstützung.
 
-[Unreleased]: https://git.dsit.me/sandrodach/MindSift/compare/v0.12.0...dev
+[Unreleased]: https://git.dsit.me/sandrodach/MindSift/compare/v0.12.1...dev
+[0.12.1]: https://git.dsit.me/sandrodach/MindSift/compare/v0.12.0...v0.12.1
 [0.12.0]: https://git.dsit.me/sandrodach/MindSift/compare/v0.11.1...v0.12.0
 [0.11.1]: https://git.dsit.me/sandrodach/MindSift/compare/v0.11.0...v0.11.1
 [0.11.0]: https://git.dsit.me/sandrodach/MindSift/compare/v0.10.0...v0.11.0
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 615a271..6136aa2 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "mindsift-frontend",
-  "version": "0.12.0",
+  "version": "0.12.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "mindsift-frontend",
-      "version": "0.12.0",
+      "version": "0.12.1",
       "license": "Unlicense",
       "dependencies": {
         "@fontsource-variable/inter": "5.3.0",
diff --git a/frontend/package.json b/frontend/package.json
index c612a8f..80b0e40 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,7 +1,7 @@
 {
   "name": "mindsift-frontend",
   "private": true,
-  "version": "0.12.0",
+  "version": "0.12.1",
   "license": "Unlicense",
   "type": "module",
   "scripts": {
diff --git a/frontend/src/features/workspace/WorkspaceView.tsx b/frontend/src/features/workspace/WorkspaceView.tsx
index ca31126..91962a9 100644
--- a/frontend/src/features/workspace/WorkspaceView.tsx
+++ b/frontend/src/features/workspace/WorkspaceView.tsx
@@ -2370,7 +2370,9 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
             </div>
           </div>
         ) : subView === 'todos' ? (
-          <div className="flex-1 overflow-y-auto p-4 sm:p-6 lg:p-8 bg-canvas">
+          /* Each nesting level lays a light tint of the text colour on top: darker per level in
+             light themes, lighter per level in dark ones */
+          <div className="flex-1 overflow-y-auto p-4 sm:p-6 lg:p-8 bg-editor">
             <div className="w-full space-y-4">
               <div className="flex flex-col sm:flex-row sm:items-center justify-between border-b border-border pb-3 gap-2">
                 <div>
@@ -2384,7 +2386,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
 
                 <div className="flex flex-wrap items-center gap-2">
                   {/* View Grouping Selector (matching hashtag switcher style) */}
-                  <div className="flex items-center bg-canvas border border-border rounded-btn p-0.5 text-[11px]">
+                  <div className="flex items-center bg-main/[0.04] border border-border rounded-btn p-0.5 text-[11px]">
                     <button
                       type="button"
                       onClick={() => {
@@ -2437,7 +2439,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
 
               {/* Grouped Folders & To-Dos */}
               {allRollupTodos.length === 0 ? (
-                <div className="p-8 text-center text-muted text-xs space-y-1 border border-border rounded-card bg-panel">
+                <div className="p-8 text-center text-muted text-xs space-y-1 border border-border rounded-card bg-main/[0.03]">
                   <Sparkles className="w-6 h-6 text-accent mx-auto mb-1" />
                   <p className="font-semibold text-main">Keine To-Dos in Notizen gefunden!</p>
                   <p className="text-faint">
@@ -2446,11 +2448,11 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
                 </div>
               ) : todoGrouping === 'list' ? (
                 /* Flat list of all todos across notes */
-                <div className="border border-border rounded-card bg-panel p-2 space-y-1">
+                <div className="border border-border rounded-card bg-main/[0.03] p-2 space-y-1">
                   {allRollupTodos.map((item) => (
                     <div
                       key={`${item.doc.id}-${item.blockId}`}
-                      className="flex items-center justify-between gap-2 p-2 rounded-btn hover:bg-panel-elevated text-xs transition-colors group cursor-pointer"
+                      className="flex items-center justify-between gap-2 p-2 rounded-btn hover:bg-main/[0.06] text-xs transition-colors group cursor-pointer"
                     >
                       <div className="flex items-center gap-2 min-w-0 flex-1">
                         <button
@@ -2481,7 +2483,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
                       <div className="flex items-center gap-1.5 shrink-0">
                         <span
                           onClick={() => handleJumpToDocBlock(item.doc.id, item.blockId)}
-                          className="inline-flex items-center gap-1 text-[11px] px-2 py-0.5 rounded-btn bg-panel-elevated text-muted hover:text-main"
+                          className="inline-flex items-center gap-1 text-[11px] px-2 py-0.5 rounded-btn bg-main/[0.06] text-muted hover:text-main"
                           title={item.doc.title}
                         >
                           <span>{item.doc.icon || '📝'}</span>
@@ -2520,10 +2522,10 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
                     return (
                       <div
                         key={folderName}
-                        className="border border-border rounded-card bg-panel overflow-hidden"
+                        className="border border-border rounded-card bg-main/[0.03] overflow-hidden"
                       >
                         {/* Folder Header */}
-                        <div className="p-2 bg-panel border-b border-border flex items-center justify-between">
+                        <div className="p-2 border-b border-border flex items-center justify-between">
                           <div
                             onClick={() => {
                               setCollapsedTodoFolders((prev) => {
@@ -2550,7 +2552,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
                           <button
                             type="button"
                             onClick={() => setTodoFolderDrilldown(folderName)}
-                            className="text-[10px] text-muted hover:text-main px-1.5 py-0.5 rounded-btn hover:bg-panel-elevated cursor-pointer"
+                            className="text-[10px] text-muted hover:text-main px-1.5 py-0.5 rounded-btn hover:bg-main/[0.06] cursor-pointer"
                             title="Diesen Ordner isolieren"
                           >
                             Nur diesen Ordner
@@ -2566,7 +2568,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
                               return (
                                 <div
                                   key={doc.id}
-                                  className="border border-border/60 rounded-btn p-2 bg-panel-elevated/40 space-y-1.5"
+                                  className="border border-border/60 rounded-btn p-2 bg-main/[0.04] space-y-1.5"
                                 >
                                   <div className="flex items-center justify-between pb-1 border-b border-border/40">
                                     <div
@@ -2608,7 +2610,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
                                       {docItems.map((item) => (
                                         <div
                                           key={`${item.doc.id}-${item.blockId}`}
-                                          className="flex items-center justify-between gap-2 p-1 rounded-btn hover:bg-panel-elevated text-xs transition-colors group cursor-pointer"
+                                          className="flex items-center justify-between gap-2 p-1 rounded-btn hover:bg-main/[0.06] text-xs transition-colors group cursor-pointer"
                                         >
                                           <div className="flex items-center gap-2 min-w-0 flex-1">
                                             <button