theme: Add scrollbar_thumb_active_background color (#30177)

Follow-up to #28064

This PR adds the `scrollbar_thumb_active_background` to themes and uses
it for the editor scrollbars to color these whilst they are being
dragged. This way, we provide the best customizabiliy for the scrollbars
and enable theme authors to add good contrasts between all the three
states `ScrollbarThumbState::Idle`, `ScrollbarThumbState::Hovered` and
ScrollbarThumbState::Dragging`.

It also adds this to the VsCode theme importer so any future imported
themes will have this set as well.

Whenever the property is not set, I decided it is best to fall back to
the normal `thumb_background` for the time being, as this way the
distinction and contrast between hovered and active state is better than
having the same color for hovering and dragging the scrollbar.

Example with active color set via `experimental.theme_overrides` in the
settings:


https://github.com/user-attachments/assets/9934e75b-6e0a-4a41-90ba-bfffb89865e7

Release Notes:

- Added the `scrollbar.thumb.active_background` color to themes. Theme
authors can use this property in combination with
`scrollbar.thumb.hover_background` to customize the color of the editor
scrollbar thumbs while these are hovered or being dragged.
This commit is contained in:
Finn Evers 2025-05-07 22:15:32 +02:00 committed by GitHub
parent 607a9445fc
commit 9c1b2afa49
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 41 additions and 10 deletions

View file

@ -167,6 +167,10 @@ impl VsCodeThemeConverter {
.scrollbar_slider
.hover_background
.clone(),
scrollbar_thumb_active_background: vscode_colors
.scrollbar_slider
.active_background
.clone(),
scrollbar_thumb_border: vscode_scrollbar_slider_background.clone(),
scrollbar_track_background: vscode_editor_background.clone(),
scrollbar_track_border: vscode_colors.editor_overview_ruler.border.clone(),