Use the editor background for the scrollbar track background

Marshall Bowers created 2 years ago

Change summary

crates/theme2/src/themes/andromeda.rs         |  2 
crates/theme2/src/themes/ayu.rs               |  6 +-
crates/theme2/src/themes/dracula.rs           |  1 
crates/theme2/src/themes/night_owl.rs         |  4 +-
crates/theme2/src/themes/noctis.rs            | 22 +++++-----
crates/theme2/src/themes/nord.rs              |  2 
crates/theme2/src/themes/palenight.rs         |  6 +-
crates/theme2/src/themes/rose_pine.rs         |  6 +-
crates/theme2/src/themes/solarized.rs         |  2 +
crates/theme2/src/themes/synthwave_84.rs      |  2 
crates/theme_importer/src/vscode/converter.rs | 40 +++++++-------------
crates/theme_importer/src/vscode/theme.rs     |  7 +++
12 files changed, 49 insertions(+), 51 deletions(-)

Detailed changes

crates/theme2/src/themes/andromeda.rs

@@ -259,7 +259,7 @@ pub fn andromeda() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x3a3f4c77).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x3a3f4caa).into()),
                         scrollbar_thumb_border: Some(rgba(0x3a3f4c77).into()),
-                        scrollbar_track_background: Some(rgba(0x23262eff).into()),
+                        scrollbar_track_background: Some(rgba(0x262a33ff).into()),
                         scrollbar_track_border: Some(rgba(0x23262eff).into()),
                         editor_background: Some(rgba(0x262a33ff).into()),
                         editor_gutter_background: Some(rgba(0x262a33ff).into()),

crates/theme2/src/themes/ayu.rs

@@ -44,7 +44,7 @@ pub fn ayu() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x8a919966).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x8a919999).into()),
                         scrollbar_thumb_border: Some(rgba(0x8a919966).into()),
-                        scrollbar_track_background: Some(rgba(0x6b7d8f00).into()),
+                        scrollbar_track_background: Some(rgba(0xf8f9faff).into()),
                         scrollbar_track_border: Some(rgba(0x6b7d8f00).into()),
                         editor_background: Some(rgba(0xf8f9faff).into()),
                         editor_gutter_background: Some(rgba(0xf8f9faff).into()),
@@ -350,7 +350,7 @@ pub fn ayu() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x707a8c66).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x707a8c99).into()),
                         scrollbar_thumb_border: Some(rgba(0x707a8c66).into()),
-                        scrollbar_track_background: Some(rgba(0x171b2400).into()),
+                        scrollbar_track_background: Some(rgba(0x1f2430ff).into()),
                         scrollbar_track_border: Some(rgba(0x171b2400).into()),
                         editor_background: Some(rgba(0x1f2430ff).into()),
                         editor_gutter_background: Some(rgba(0x1f2430ff).into()),
@@ -656,7 +656,7 @@ pub fn ayu() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x565b6666).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x565b6699).into()),
                         scrollbar_thumb_border: Some(rgba(0x565b6666).into()),
-                        scrollbar_track_background: Some(rgba(0x1e232b00).into()),
+                        scrollbar_track_background: Some(rgba(0x0b0e14ff).into()),
                         scrollbar_track_border: Some(rgba(0x1e232b00).into()),
                         editor_background: Some(rgba(0x0b0e14ff).into()),
                         editor_gutter_background: Some(rgba(0x0b0e14ff).into()),

crates/theme2/src/themes/dracula.rs

@@ -41,6 +41,7 @@ pub fn dracula() -> UserThemeFamily {
                     tab_bar_background: Some(rgba(0x191a21ff).into()),
                     tab_inactive_background: Some(rgba(0x21222cff).into()),
                     tab_active_background: Some(rgba(0x282a36ff).into()),
+                    scrollbar_track_background: Some(rgba(0x282a36ff).into()),
                     editor_background: Some(rgba(0x282a36ff).into()),
                     editor_gutter_background: Some(rgba(0x282a36ff).into()),
                     editor_line_number: Some(rgba(0x6272a4ff).into()),

crates/theme2/src/themes/night_owl.rs

@@ -45,7 +45,7 @@ pub fn night_owl() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x084d8180).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x084d8180).into()),
                         scrollbar_thumb_border: Some(rgba(0x084d8180).into()),
-                        scrollbar_track_background: Some(rgba(0x010b14ff).into()),
+                        scrollbar_track_background: Some(rgba(0x011627ff).into()),
                         scrollbar_track_border: Some(rgba(0x010b14ff).into()),
                         editor_background: Some(rgba(0x011627ff).into()),
                         editor_gutter_background: Some(rgba(0x011627ff).into()),
@@ -305,7 +305,7 @@ pub fn night_owl() -> UserThemeFamily {
                         tab_bar_background: Some(rgba(0xf0f0f0ff).into()),
                         tab_inactive_background: Some(rgba(0xf0f0f0ff).into()),
                         tab_active_background: Some(rgba(0xf6f6f6ff).into()),
-                        scrollbar_track_background: Some(rgba(0xccccccff).into()),
+                        scrollbar_track_background: Some(rgba(0xfbfbfbff).into()),
                         scrollbar_track_border: Some(rgba(0xccccccff).into()),
                         editor_background: Some(rgba(0xfbfbfbff).into()),
                         editor_gutter_background: Some(rgba(0xfbfbfbff).into()),

crates/theme2/src/themes/noctis.rs

@@ -45,7 +45,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x008ee633).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x008ee655).into()),
                         scrollbar_thumb_border: Some(rgba(0x008ee633).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x07273bff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x07273bff).into()),
                         editor_gutter_background: Some(rgba(0x07273bff).into()),
@@ -322,7 +322,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0xeb609133).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0xeb609144).into()),
                         scrollbar_thumb_border: Some(rgba(0xeb609133).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x322a2dff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x322a2dff).into()),
                         editor_gutter_background: Some(rgba(0x322a2dff).into()),
@@ -599,7 +599,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6a90955b).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x0099ad62).into()),
                         scrollbar_thumb_border: Some(rgba(0x6a90955b).into()),
-                        scrollbar_track_background: Some(rgba(0x00000055).into()),
+                        scrollbar_track_background: Some(rgba(0xf4f6f6ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000055).into()),
                         editor_background: Some(rgba(0xf4f6f6ff).into()),
                         editor_gutter_background: Some(rgba(0xf4f6f6ff).into()),
@@ -876,7 +876,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6a90955b).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x7060eb62).into()),
                         scrollbar_thumb_border: Some(rgba(0x6a90955b).into()),
-                        scrollbar_track_background: Some(rgba(0x00000055).into()),
+                        scrollbar_track_background: Some(rgba(0xf2f1f8ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000055).into()),
                         editor_background: Some(rgba(0xf2f1f8ff).into()),
                         editor_gutter_background: Some(rgba(0xf2f1f8ff).into()),
@@ -1153,7 +1153,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6a90955b).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x0099ad62).into()),
                         scrollbar_thumb_border: Some(rgba(0x6a90955b).into()),
-                        scrollbar_track_background: Some(rgba(0x00000055).into()),
+                        scrollbar_track_background: Some(rgba(0xfef8ecff).into()),
                         scrollbar_track_border: Some(rgba(0x00000055).into()),
                         editor_background: Some(rgba(0xfef8ecff).into()),
                         editor_gutter_background: Some(rgba(0xfef8ecff).into()),
@@ -1430,7 +1430,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x3f7fa633).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x3f7fa655).into()),
                         scrollbar_thumb_border: Some(rgba(0x3f7fa633).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x1b2932ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x1b2932ff).into()),
                         editor_gutter_background: Some(rgba(0x1b2932ff).into()),
@@ -1707,7 +1707,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6a90955b).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x169fb162).into()),
                         scrollbar_thumb_border: Some(rgba(0x6a90955b).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x052529ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x052529ff).into()),
                         editor_gutter_background: Some(rgba(0x052529ff).into()),
@@ -1984,7 +1984,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6a90955b).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x169fb162).into()),
                         scrollbar_thumb_border: Some(rgba(0x6a90955b).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x031417ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x031417ff).into()),
                         editor_gutter_background: Some(rgba(0x031417ff).into()),
@@ -2261,7 +2261,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6a90955b).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x169fb162).into()),
                         scrollbar_thumb_border: Some(rgba(0x6a90955b).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x031417ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x031417ff).into()),
                         editor_gutter_background: Some(rgba(0x031417ff).into()),
@@ -2538,7 +2538,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x7060eb33).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x7060eb55).into()),
                         scrollbar_thumb_border: Some(rgba(0x7060eb33).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x292640ff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x292640ff).into()),
                         editor_gutter_background: Some(rgba(0x292640ff).into()),
@@ -2815,7 +2815,7 @@ pub fn noctis() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0xa660eb33).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0xa660eb55).into()),
                         scrollbar_thumb_border: Some(rgba(0xa660eb33).into()),
-                        scrollbar_track_background: Some(rgba(0x00000044).into()),
+                        scrollbar_track_background: Some(rgba(0x30243dff).into()),
                         scrollbar_track_border: Some(rgba(0x00000044).into()),
                         editor_background: Some(rgba(0x30243dff).into()),
                         editor_gutter_background: Some(rgba(0x30243dff).into()),

crates/theme2/src/themes/nord.rs

@@ -44,7 +44,7 @@ pub fn nord() -> UserThemeFamily {
                     scrollbar_thumb_background: Some(rgba(0x434c5e99).into()),
                     scrollbar_thumb_hover_background: Some(rgba(0x434c5eaa).into()),
                     scrollbar_thumb_border: Some(rgba(0x434c5e99).into()),
-                    scrollbar_track_background: Some(rgba(0x00000066).into()),
+                    scrollbar_track_background: Some(rgba(0x2e3440ff).into()),
                     scrollbar_track_border: Some(rgba(0x00000066).into()),
                     editor_background: Some(rgba(0x2e3440ff).into()),
                     editor_gutter_background: Some(rgba(0x2e3440ff).into()),

crates/theme2/src/themes/palenight.rs

@@ -45,7 +45,7 @@ pub fn palenight() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x694ca466).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x694ca4cc).into()),
                         scrollbar_thumb_border: Some(rgba(0x694ca466).into()),
-                        scrollbar_track_background: Some(rgba(0x292d3e00).into()),
+                        scrollbar_track_background: Some(rgba(0x292d3eff).into()),
                         scrollbar_track_border: Some(rgba(0x292d3e00).into()),
                         editor_background: Some(rgba(0x292d3eff).into()),
                         editor_gutter_background: Some(rgba(0x292d3eff).into()),
@@ -331,7 +331,7 @@ pub fn palenight() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x694ca466).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x694ca4cc).into()),
                         scrollbar_thumb_border: Some(rgba(0x694ca466).into()),
-                        scrollbar_track_background: Some(rgba(0x292d3e00).into()),
+                        scrollbar_track_background: Some(rgba(0x292d3eff).into()),
                         scrollbar_track_border: Some(rgba(0x292d3e00).into()),
                         editor_background: Some(rgba(0x292d3eff).into()),
                         editor_gutter_background: Some(rgba(0x292d3eff).into()),
@@ -617,7 +617,7 @@ pub fn palenight() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x694ca466).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x694ca4cc).into()),
                         scrollbar_thumb_border: Some(rgba(0x694ca466).into()),
-                        scrollbar_track_background: Some(rgba(0x292d3e00).into()),
+                        scrollbar_track_background: Some(rgba(0x292d3eff).into()),
                         scrollbar_track_border: Some(rgba(0x292d3e00).into()),
                         editor_background: Some(rgba(0x292d3eff).into()),
                         editor_gutter_background: Some(rgba(0x292d3eff).into()),

crates/theme2/src/themes/rose_pine.rs

@@ -45,7 +45,7 @@ pub fn rose_pine() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6e6a8633).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x6e6a8666).into()),
                         scrollbar_thumb_border: Some(rgba(0x6e6a8633).into()),
-                        scrollbar_track_background: Some(rgba(0x1f1d2e4d).into()),
+                        scrollbar_track_background: Some(rgba(0x191724ff).into()),
                         scrollbar_track_border: Some(rgba(0x1f1d2e4d).into()),
                         editor_background: Some(rgba(0x191724ff).into()),
                         editor_gutter_background: Some(rgba(0x191724ff).into()),
@@ -304,7 +304,7 @@ pub fn rose_pine() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x817c9c26).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x817c9c4d).into()),
                         scrollbar_thumb_border: Some(rgba(0x817c9c26).into()),
-                        scrollbar_track_background: Some(rgba(0x2a273f4d).into()),
+                        scrollbar_track_background: Some(rgba(0x232136ff).into()),
                         scrollbar_track_border: Some(rgba(0x2a273f4d).into()),
                         editor_background: Some(rgba(0x232136ff).into()),
                         editor_gutter_background: Some(rgba(0x232136ff).into()),
@@ -563,7 +563,7 @@ pub fn rose_pine() -> UserThemeFamily {
                         scrollbar_thumb_background: Some(rgba(0x6e6a8614).into()),
                         scrollbar_thumb_hover_background: Some(rgba(0x6e6a8626).into()),
                         scrollbar_thumb_border: Some(rgba(0x6e6a8614).into()),
-                        scrollbar_track_background: Some(rgba(0xfffaf34d).into()),
+                        scrollbar_track_background: Some(rgba(0xfaf4edff).into()),
                         scrollbar_track_border: Some(rgba(0xfffaf34d).into()),
                         editor_background: Some(rgba(0xfaf4edff).into()),
                         editor_gutter_background: Some(rgba(0xfaf4edff).into()),

crates/theme2/src/themes/solarized.rs

@@ -41,6 +41,7 @@ pub fn solarized() -> UserThemeFamily {
                         tab_bar_background: Some(rgba(0x004052ff).into()),
                         tab_inactive_background: Some(rgba(0x004052ff).into()),
                         tab_active_background: Some(rgba(0x002b37ff).into()),
+                        scrollbar_track_background: Some(rgba(0x002b36ff).into()),
                         editor_background: Some(rgba(0x002b36ff).into()),
                         editor_gutter_background: Some(rgba(0x002b36ff).into()),
                         editor_line_number: Some(rgba(0x566c74ff).into()),
@@ -305,6 +306,7 @@ pub fn solarized() -> UserThemeFamily {
                         tab_bar_background: Some(rgba(0xd9d2c2ff).into()),
                         tab_inactive_background: Some(rgba(0xd3cbb7ff).into()),
                         tab_active_background: Some(rgba(0xfdf6e3ff).into()),
+                        scrollbar_track_background: Some(rgba(0xfdf6e3ff).into()),
                         editor_background: Some(rgba(0xfdf6e3ff).into()),
                         editor_gutter_background: Some(rgba(0xfdf6e3ff).into()),
                         editor_line_number: Some(rgba(0x9ca8a6ff).into()),

crates/theme2/src/themes/synthwave_84.rs

@@ -36,7 +36,7 @@ pub fn synthwave_84() -> UserThemeFamily {
                     scrollbar_thumb_background: Some(rgba(0x9d8bca30).into()),
                     scrollbar_thumb_hover_background: Some(rgba(0x9d8bca50).into()),
                     scrollbar_thumb_border: Some(rgba(0x9d8bca30).into()),
-                    scrollbar_track_background: Some(rgba(0x2a2139ff).into()),
+                    scrollbar_track_background: Some(rgba(0x262335ff).into()),
                     scrollbar_track_border: Some(rgba(0x2a2139ff).into()),
                     editor_background: Some(rgba(0x262335ff).into()),
                     editor_gutter_background: Some(rgba(0x262335ff).into()),

crates/theme_importer/src/vscode/converter.rs

@@ -122,13 +122,13 @@ impl VsCodeThemeConverter {
     fn convert_theme_colors(&self) -> Result<ThemeColorsRefinement> {
         let vscode_colors = &self.theme.colors;
 
-        let vscode_editor_background = vscode_colors
-            .editor_background
+        let vscode_panel_border = vscode_colors
+            .panel_border
             .as_ref()
             .traverse(|color| try_parse_color(&color))?;
 
-        let vscode_scrollbar_shadow = vscode_colors
-            .scrollbar_shadow
+        let vscode_editor_background = vscode_colors
+            .editor_background
             .as_ref()
             .traverse(|color| try_parse_color(&color))?;
 
@@ -138,30 +138,15 @@ impl VsCodeThemeConverter {
             .traverse(|color| try_parse_color(&color))?;
 
         Ok(ThemeColorsRefinement {
-            border: vscode_colors
-                .panel_border
-                .as_ref()
-                .traverse(|color| try_parse_color(&color))?,
-            border_variant: vscode_colors
-                .panel_border
-                .as_ref()
-                .traverse(|color| try_parse_color(&color))?,
+            border: vscode_panel_border,
+            border_variant: vscode_panel_border,
             border_focused: vscode_colors
                 .focus_border
                 .as_ref()
                 .traverse(|color| try_parse_color(&color))?,
-            border_disabled: vscode_colors
-                .panel_border
-                .as_ref()
-                .traverse(|color| try_parse_color(&color))?,
-            border_selected: vscode_colors
-                .panel_border
-                .as_ref()
-                .traverse(|color| try_parse_color(&color))?,
-            border_transparent: vscode_colors
-                .panel_border
-                .as_ref()
-                .traverse(|color| try_parse_color(&color))?,
+            border_disabled: vscode_panel_border,
+            border_selected: vscode_panel_border,
+            border_transparent: vscode_panel_border,
             elevated_surface_background: vscode_colors
                 .dropdown_background
                 .as_ref()
@@ -248,8 +233,11 @@ impl VsCodeThemeConverter {
                 .editor_foreground
                 .as_ref()
                 .traverse(|color| try_parse_color(&color))?,
-            scrollbar_track_background: vscode_scrollbar_shadow,
-            scrollbar_track_border: vscode_scrollbar_shadow,
+            scrollbar_track_background: vscode_editor_background,
+            scrollbar_track_border: vscode_colors
+                .scrollbar_shadow
+                .as_ref()
+                .traverse(|color| try_parse_color(&color))?,
             scrollbar_thumb_background: vscode_scrollbar_slider_background,
             scrollbar_thumb_border: vscode_scrollbar_slider_background,
             scrollbar_thumb_hover_background: vscode_colors

crates/theme_importer/src/vscode/theme.rs

@@ -1165,6 +1165,13 @@ pub struct VsCodeColors {
     )]
     pub status_bar_background: Option<String>,
 
+    #[serde(
+        default,
+        rename = "statusBar.border",
+        deserialize_with = "empty_string_as_none"
+    )]
+    pub status_bar_border: Option<String>,
+
     #[serde(
         default,
         rename = "statusBar.foreground",