psa-systems/mokosh-apps
Watch
9
0
Fork
You've already forked mokosh-apps
 0
Code Issues Pull requests 1 Projects Releases 14 Packages Wiki Activity Actions

feat(ui): themed global scrollbars (no more white trough on the dark/blue theme) #74

Merged
vas2000-work merged 2 commits from feat/themed-scrollbars into main 2026-06-05 23:10:01 +02:00
Conversation 0 Commits 2 Files changed 1 +43
vas2000-work commented 2026-06-05 22:54:57 +02:00
Owner
Copy link

The browser-default scrollbar is an opaque white trough that reads as a hard seam against the gray/blue theme, especially in dark mode.

Style scrollbars globally in the base layer to match the theme: transparent track, rounded gray thumb (gray-300 light / gray-600 dark, darkening to gray-400/500 on hover) with an inset padding-box border so it reads as a soft pill rather than a hard bar. Covers both the WebKit ::-webkit-scrollbar* pseudo-elements and Firefox scrollbar-width: thin + scrollbar-color. Reuses the existing .scrollbar-thin palette; the .scrollbar-thin / .scrollbar-hide utilities still override per element.

CSS-only - needs a Tailwind rebuild + a visual check (no Rust gate).

The browser-default scrollbar is an opaque white trough that reads as a hard seam against the gray/blue theme, especially in dark mode. Style scrollbars globally in the base layer to match the theme: transparent track, rounded gray thumb (gray-300 light / gray-600 dark, darkening to gray-400/500 on hover) with an inset padding-box border so it reads as a soft pill rather than a hard bar. Covers both the WebKit `::-webkit-scrollbar*` pseudo-elements and Firefox `scrollbar-width: thin` + `scrollbar-color`. Reuses the existing `.scrollbar-thin` palette; the `.scrollbar-thin` / `.scrollbar-hide` utilities still override per element. CSS-only - needs a Tailwind rebuild + a visual check (no Rust gate).
feat(ui): themed global scrollbars instead of the default white trough
All checks were successful
Check / clippy + fmt + tests (pull_request) Successful in 41s
Details
aa5b8b3e7d 
The browser-default scrollbar renders an opaque white trough that reads as a hard seam against the gray/blue theme, most jarring in dark mode. Style every scrollable element globally to match: a transparent track and a rounded gray thumb (gray-300/600, darkening to gray-400/500 on hover) with an inset padding-box border so it reads as a soft pill. Sets both the WebKit pseudo-elements and the Firefox scrollbar-width/scrollbar-color. The existing .scrollbar-thin / .scrollbar-hide utilities still override per element.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Merge branch 'main' into feat/themed-scrollbars
All checks were successful
Create release / Create release from merged PR (pull_request) Has been skipped
Details
Check / clippy + fmt + tests (pull_request) Successful in 1m0s
Details
1b8f9fefe3
vas2000-work deleted branch feat/themed-scrollbars 2026-06-05 23:10:01 +02:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
psa-systems/mokosh-apps!74
No description provided.