From e4bc6ead61c5cf098e780490b9ea20187e0d4519 Mon Sep 17 00:00:00 2001 From: Sandro Date: Mon, 2 Nov 2026 18:45:18 +0100 Subject: [PATCH 1/2] fix(ui): no white strip next to the page in Chrome Chrome paints an empty scrollbar gutter white and takes the page scrollbar's style from body, not html. It now always shows the page scrollbar (an empty track where nothing scrolls), styled via body::-webkit-scrollbar with the header and page colours; the header's translucent bottom line is a layer of its own. Firefox keeps the gutter. Co-Authored-By: Claude Opus 5.5 --- frontend/src/index.css | 45 ++++++++++++++++++++++++++++++++++-------- 1 file changed, 37 insertions(+), 8 deletions(-) diff --git a/frontend/src/index.css b/frontend/src/index.css index e52234d..889ecf3 100644 --- a/frontend/src/index.css +++ b/frontend/src/index.css @@ -35,19 +35,36 @@ html { scrollbar-gutter: stable; } +/* Chrome paints an empty gutter (page without scrollbar) plain white, ignoring the page background. There + the scrollbar is always shown instead: without anything to scroll it is an empty track, coloured like + the header and page by body::-webkit-scrollbar below. Firefox keeps the gutter, which it paints with the + html background. */ +@supports selector(::-webkit-scrollbar) { + html { + overflow-y: scroll; + } +} +/* Header colour down to the header's height (--app-header-h, set by App), then the page colour. The header's + bottom line is its own layer on top, since the theme gives it as a translucent colour. Defined on body: + Chrome resolves variables for the page scrollbar from there (html sees it through inheritance too). */ +:root, +body { + --header-gutter-bg: linear-gradient( + to bottom, + transparent calc(var(--app-header-h, 0px) - 1px), + var(--border-color) calc(var(--app-header-h, 0px) - 1px), + var(--border-color) var(--app-header-h, 0px), + transparent var(--app-header-h, 0px) + ), + linear-gradient(to bottom, var(--bg-panel) var(--app-header-h, 0px), var(--bg-app) var(--app-header-h, 0px)); +} /* The gutter shows the page background; on the desktop it carries the header colour (and its bottom line) down to the header's height (--app-header-h, set by App), fixed like the sticky header, so the header seems to run to the window edge */ @media (min-width: 768px) { html { - background: linear-gradient( - to bottom, - var(--bg-panel) calc(var(--app-header-h, 0px) - 1px), - var(--border-color) calc(var(--app-header-h, 0px) - 1px), - var(--border-color) var(--app-header-h, 0px), - var(--bg-app) var(--app-header-h, 0px) - ) - fixed; + background: var(--header-gutter-bg); + background-attachment: fixed; } } @@ -69,6 +86,18 @@ body { background: transparent; } +/* Chrome takes the page scrollbar's style from body (html:: does not apply) and paints white behind a + transparent track, where Firefox shows the html background: the page scrollbar gets the same + background as html above, on the desktop with the header colour on top */ +body::-webkit-scrollbar { + background: var(--bg-app); +} +@media (min-width: 768px) { + body::-webkit-scrollbar { + background: var(--header-gutter-bg); + } +} + ::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: var(--radius-btn); From c31eed5a3a6109a8905d44c05f90631801de0fb8 Mon Sep 17 00:00:00 2001 From: Sandro Date: Mon, 2 Nov 2026 18:46:09 +0100 Subject: [PATCH 2/2] chore: release v0.59.3 Co-Authored-By: Claude Opus 5.5 --- CHANGELOG.md | 8 +++++++- README.md | 2 +- frontend/package-lock.json | 4 ++-- frontend/package.json | 2 +- 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d865fab..e029955 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.59.3] - 2026-11-02 + +### Fixed +- Chrome: Rechts neben der Seite stand seit 0.59.1 ein weißer Streifen, auf Seiten ohne Scrollbalken über die ganze Höhe. Der Streifen hat jetzt die Farben von Kopfleiste und Seite, und der Scrollbalken der Seite ist auch im dunklen Theme sichtbar. + ## [0.59.2] - 2026-11-02 ### Fixed @@ -864,7 +869,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.59.2...dev +[Unreleased]: https://git.dsit.me/sandrodach/MindSift/compare/v0.59.3...dev +[0.59.3]: https://git.dsit.me/sandrodach/MindSift/compare/v0.59.2...v0.59.3 [0.59.2]: https://git.dsit.me/sandrodach/MindSift/compare/v0.59.1...v0.59.2 [0.59.1]: https://git.dsit.me/sandrodach/MindSift/compare/v0.59.0...v0.59.1 [0.59.0]: https://git.dsit.me/sandrodach/MindSift/compare/v0.58.0...v0.59.0 diff --git a/README.md b/README.md index 086e319..780f83c 100644 --- a/README.md +++ b/README.md @@ -6,7 +6,7 @@ [![Self-Hosted](https://img.shields.io/badge/100%25-Self--Hosted-2563eb?style=flat-square)](#) [![Docker](https://img.shields.io/badge/Deployment-Single%20Container-2496ed?style=flat-square&logo=docker&logoColor=white)](#-schnellstart) [![SQLite](https://img.shields.io/badge/Daten-SQLite-003b57?style=flat-square&logo=sqlite&logoColor=white)](#-deine-daten-gehören-dir) -[![Version](https://img.shields.io/badge/Version-v0.59.2-16a34a?style=flat-square)](CHANGELOG.md) +[![Version](https://img.shields.io/badge/Version-v0.59.3-16a34a?style=flat-square)](CHANGELOG.md) **MindSift** ist eine selbst gehostete Schaltstelle für spontane Gedanken, Aufgaben mit Kanban-Board, hierarchische Outliner-Notizen, die mehrere Personen gleichzeitig bearbeiten können, und gemeinsame Listen. Alles läuft als ein einzelner Container mit eingebetteter SQLite-Datenbank, auf deinem eigenen Server. diff --git a/frontend/package-lock.json b/frontend/package-lock.json index edd0bc5..f61c721 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -1,12 +1,12 @@ { "name": "mindsift-frontend", - "version": "0.59.2", + "version": "0.59.3", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "mindsift-frontend", - "version": "0.59.2", + "version": "0.59.3", "license": "AGPL-3.0-only", "dependencies": { "@fontsource-variable/inter": "5.3.0", diff --git a/frontend/package.json b/frontend/package.json index 880892d..74d6e48 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -1,7 +1,7 @@ { "name": "mindsift-frontend", "private": true, - "version": "0.59.2", + "version": "0.59.3", "license": "AGPL-3.0-only", "type": "module", "scripts": {