From b86468a5440aaff1044e2bf5f59f0ba58f0800a4 Mon Sep 17 00:00:00 2001 From: mrleemurray Date: Wed, 21 Jan 2026 18:17:22 +0000 Subject: [PATCH 1/4] theme: update border colors for consistency in 2026 Light theme --- extensions/theme-2026/themes/2026-light.json | 58 ++++++++++---------- extensions/theme-2026/themes/styles.css | 32 +++++++++-- 2 files changed, 55 insertions(+), 35 deletions(-) diff --git a/extensions/theme-2026/themes/2026-light.json b/extensions/theme-2026/themes/2026-light.json index 93d43d10d5b..17245099948 100644 --- a/extensions/theme-2026/themes/2026-light.json +++ b/extensions/theme-2026/themes/2026-light.json @@ -10,21 +10,21 @@ "icon.foreground": "#666666", "focusBorder": "#4466CCFF", "textBlockQuote.background": "#EDEDED", - "textBlockQuote.border": "#ECEDEEFF", + "textBlockQuote.border": "#E9EAEBFF", "textCodeBlock.background": "#EDEDED", "textLink.foreground": "#3457C0", "textLink.activeForeground": "#3355BA", "textPreformat.foreground": "#666666", - "textSeparator.foreground": "#EEEEEEFF", + "textSeparator.foreground": "#ebebebFF", "button.background": "#4466CC", "button.foreground": "#FFFFFF", "button.hoverBackground": "#3E61CA", - "button.border": "#ECEDEEFF", + "button.border": "#E9EAEBFF", "button.secondaryBackground": "#EDEDED", "button.secondaryForeground": "#202020", "button.secondaryHoverBackground": "#E6E6E6", "checkbox.background": "#EDEDED", - "checkbox.border": "#ECEDEEFF", + "checkbox.border": "#E9EAEBFF", "checkbox.foreground": "#202020", "dropdown.background": "#F9F9F9", "dropdown.border": "#D6D7D8", @@ -36,15 +36,15 @@ "input.placeholderForeground": "#999999", "inputOption.activeBackground": "#4466CC33", "inputOption.activeForeground": "#202020", - "inputOption.activeBorder": "#ECEDEEFF", + "inputOption.activeBorder": "#E9EAEBFF", "inputValidation.errorBackground": "#F9F9F9", - "inputValidation.errorBorder": "#ECEDEEFF", + "inputValidation.errorBorder": "#E9EAEBFF", "inputValidation.errorForeground": "#202020", "inputValidation.infoBackground": "#F9F9F9", - "inputValidation.infoBorder": "#ECEDEEFF", + "inputValidation.infoBorder": "#E9EAEBFF", "inputValidation.infoForeground": "#202020", "inputValidation.warningBackground": "#F9F9F9", - "inputValidation.warningBorder": "#ECEDEEFF", + "inputValidation.warningBorder": "#E9EAEBFF", "inputValidation.warningForeground": "#202020", "scrollbar.shadow": "#F5F6F84D", "scrollbarSlider.background": "#4466CC33", @@ -70,23 +70,23 @@ "activityBar.background": "#F9F9F9", "activityBar.foreground": "#202020", "activityBar.inactiveForeground": "#666666", - "activityBar.border": "#ECEDEEFF", - "activityBar.activeBorder": "#ECEDEEFF", + "activityBar.border": "#E9EAEBFF", + "activityBar.activeBorder": "#E9EAEBFF", "activityBar.activeFocusBorder": "#4466CCFF", "activityBarBadge.background": "#4466CC", "activityBarBadge.foreground": "#FFFFFF", "sideBar.background": "#F9F9F9", "sideBar.foreground": "#202020", - "sideBar.border": "#ECEDEEFF", + "sideBar.border": "#E9EAEBFF", "sideBarTitle.foreground": "#202020", "sideBarSectionHeader.background": "#F9F9F9", "sideBarSectionHeader.foreground": "#202020", - "sideBarSectionHeader.border": "#ECEDEEFF", + "sideBarSectionHeader.border": "#E9EAEBFF", "titleBar.activeBackground": "#F9F9F9", "titleBar.activeForeground": "#424242", "titleBar.inactiveBackground": "#F9F9F9", "titleBar.inactiveForeground": "#666666", - "titleBar.border": "#ECEDEEFF", + "titleBar.border": "#E9EAEBFF", "menubar.selectionBackground": "#EDEDED", "menubar.selectionForeground": "#202020", "menu.background": "#FCFCFC", @@ -94,7 +94,7 @@ "menu.selectionBackground": "#4466CC26", "menu.selectionForeground": "#202020", "menu.separatorBackground": "#F4F4F4", - "menu.border": "#ECEDEEFF", + "menu.border": "#E9EAEBFF", "commandCenter.foreground": "#202020", "commandCenter.activeForeground": "#202020", "commandCenter.background": "#F9F9F9", @@ -123,18 +123,18 @@ "editorRuler.foreground": "#F4F4F4", "editorCodeLens.foreground": "#666666", "editorBracketMatch.background": "#4466CC55", - "editorBracketMatch.border": "#ECEDEEFF", + "editorBracketMatch.border": "#E9EAEBFF", "editorWidget.background": "#FCFCFC", - "editorWidget.border": "#ECEDEEFF", + "editorWidget.border": "#E9EAEBFF", "editorWidget.foreground": "#202020", "editorSuggestWidget.background": "#FCFCFC", - "editorSuggestWidget.border": "#ECEDEEFF", + "editorSuggestWidget.border": "#E9EAEBFF", "editorSuggestWidget.foreground": "#202020", "editorSuggestWidget.highlightForeground": "#202020", "editorSuggestWidget.selectedBackground": "#4466CC26", "editorHoverWidget.background": "#FCFCFC55", - "editorHoverWidget.border": "#ECEDEEFF", - "peekView.border": "#ECEDEEFF", + "editorHoverWidget.border": "#E9EAEBFF", + "peekView.border": "#E9EAEBFF", "peekViewEditor.background": "#F9F9F9", "peekViewEditor.matchHighlightBackground": "#4466CC33", "peekViewResult.background": "#EDEDED", @@ -151,7 +151,7 @@ "editorGutter.deletedBackground": "#ad0707", "diffEditor.insertedTextBackground": "#587c0c26", "diffEditor.removedTextBackground": "#ad070726", - "editorOverviewRuler.border": "#ECEDEEFF", + "editorOverviewRuler.border": "#E9EAEBFF", "editorOverviewRuler.findMatchForeground": "#4466CC99", "editorOverviewRuler.modifiedForeground": "#007acc", "editorOverviewRuler.addedForeground": "#587c0c", @@ -159,13 +159,13 @@ "editorOverviewRuler.errorForeground": "#ad0707", "editorOverviewRuler.warningForeground": "#667309", "panel.background": "#F9F9F9", - "panel.border": "#ECEDEEFF", + "panel.border": "#E9EAEBFF", "panelTitle.activeBorder": "#4466CC", "panelTitle.activeForeground": "#202020", "panelTitle.inactiveForeground": "#666666", "statusBar.background": "#F9F9F9", "statusBar.foreground": "#202020", - "statusBar.border": "#ECEDEEFF", + "statusBar.border": "#E9EAEBFF", "statusBar.focusBorder": "#4466CCFF", "statusBar.debuggingBackground": "#4466CC", "statusBar.debuggingForeground": "#FFFFFF", @@ -181,8 +181,8 @@ "tab.activeForeground": "#202020", "tab.inactiveBackground": "#F9F9F9", "tab.inactiveForeground": "#666666", - "tab.border": "#ECEDEEFF", - "tab.lastPinnedBorder": "#ECEDEEFF", + "tab.border": "#E9EAEBFF", + "tab.lastPinnedBorder": "#E9EAEBFF", "tab.activeBorder": "#FBFBFD", "tab.hoverBackground": "#F2F2F2", "tab.hoverForeground": "#202020", @@ -191,24 +191,24 @@ "tab.unfocusedInactiveBackground": "#F9F9F9", "tab.unfocusedInactiveForeground": "#BBBBBB", "editorGroupHeader.tabsBackground": "#F9F9F9", - "editorGroupHeader.tabsBorder": "#ECEDEEFF", + "editorGroupHeader.tabsBorder": "#E9EAEBFF", "breadcrumb.foreground": "#666666", "breadcrumb.background": "#FDFDFD", "breadcrumb.focusForeground": "#202020", "breadcrumb.activeSelectionForeground": "#202020", "breadcrumbPicker.background": "#FCFCFC", - "notificationCenter.border": "#ECEDEEFF", + "notificationCenter.border": "#E9EAEBFF", "notificationCenterHeader.foreground": "#202020", "notificationCenterHeader.background": "#EDEDED", - "notificationToast.border": "#ECEDEEFF", + "notificationToast.border": "#E9EAEBFF", "notifications.foreground": "#202020", "notifications.background": "#FCFCFC", - "notifications.border": "#ECEDEEFF", + "notifications.border": "#E9EAEBFF", "notificationLink.foreground": "#4466CC", "extensionButton.prominentBackground": "#4466CC", "extensionButton.prominentForeground": "#FFFFFF", "extensionButton.prominentHoverBackground": "#3E61CA", - "pickerGroup.border": "#ECEDEEFF", + "pickerGroup.border": "#E9EAEBFF", "pickerGroup.foreground": "#202020", "quickInput.background": "#FCFCFC", "quickInput.foreground": "#202020", diff --git a/extensions/theme-2026/themes/styles.css b/extensions/theme-2026/themes/styles.css index 369a5fa4f52..48c345ec2b1 100644 --- a/extensions/theme-2026/themes/styles.css +++ b/extensions/theme-2026/themes/styles.css @@ -31,6 +31,10 @@ .monaco-workbench.panel-position-left .part.panel { box-shadow: 0 0 6px rgba(0, 0, 0, 0.08); } .monaco-workbench.panel-position-right .part.panel { box-shadow: 0 0 6px rgba(0, 0, 0, 0.08); } +.monaco-pane-view .split-view-view:first-of-type > .pane > .pane-header { + border-top: 1px solid var(--vscode-sideBarSectionHeader-border) !important; +} + /* Sashes - ensure they extend full height and are above other panels */ .monaco-workbench .monaco-sash { z-index: 45; } .monaco-workbench .monaco-sash.vertical { z-index: 45; } @@ -228,14 +232,14 @@ /* Sticky Scroll */ .monaco-workbench .monaco-editor .sticky-widget { box-shadow: 0 0 6px rgba(0, 0, 0, 0.10) !important; border-bottom: none !important; background: rgba(252, 252, 253, 0.65) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; } .monaco-workbench.vs-dark .monaco-editor .sticky-widget { border-bottom: none !important; background: rgba(0, 0, 0, 0.3) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; } -.monaco-workbench .monaco-editor .sticky-widget *, -.monaco-workbench .monaco-editor .sticky-widget > *, +/* .monaco-workbench .monaco-editor .sticky-widget *, +.monaco-workbench .monaco-editor .sticky-widget > *, */ .monaco-workbench .monaco-editor .sticky-widget .sticky-widget-line-numbers, -.monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines-scrollable, +/* .monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines-scrollable, */ .monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines, -.monaco-workbench .monaco-editor .sticky-widget .sticky-line-number, -.monaco-workbench .monaco-editor .sticky-widget .sticky-line-content, -.monaco-workbench .monaco-editor .sticky-widget .sticky-line-content:hover { background-color: transparent !important; background: transparent !important; } +/* .monaco-workbench .monaco-editor .sticky-widget .sticky-line-number */ +/* .monaco-workbench .monaco-editor .sticky-widget .sticky-line-content, +.monaco-workbench .monaco-editor .sticky-widget .sticky-line-content:hover */ { background-color: transparent !important; background: transparent !important; } .monaco-workbench.vs-dark .monaco-editor .sticky-widget, .monaco-workbench .monaco-editor .sticky-widget-focus-preview, .monaco-workbench .monaco-editor .sticky-scroll-focus-line, @@ -243,6 +247,22 @@ .monaco-workbench .monaco-editor:has(.sticky-widget:focus-within) .sticky-widget { background: rgba(252, 252, 253, 0.75) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; box-shadow: 0 0 8px rgba(0, 0, 0, 0.12) !important; } .monaco-workbench.vs-dark .monaco-editor:has(.sticky-widget:focus-within) .sticky-widget { background: rgba(0, 0, 0, 0.4) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; box-shadow: 0 0 8px rgba(0, 0, 0, 0.12) !important; } +.monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines-scrollable { + +} + +.monaco-editor .sticky-widget .sticky-line-content, +.monaco-workbench .monaco-editor .sticky-widget .sticky-line-number { + backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; + background-color: color-mix(in srgb, var(--vscode-editor-background) 70%, transparent) +} + +.monaco-workbench.vs-dark .monaco-editor .sticky-widget .sticky-line-content, +.monaco-workbench.vs-dark .monaco-editor .sticky-widget .sticky-line-number { + background-color: color-mix(in srgb, var(--vscode-list-hoverBackground) 30%, transparent) +} + + /* Notebook */ .monaco-workbench .notebookOverlay .monaco-list .cell-focus-indicator { box-shadow: 0 0 4px rgba(0, 0, 0, 0.08); border-radius: 6px; } .monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.focused .cell-focus-indicator { box-shadow: 0 0 6px rgba(0, 0, 0, 0.10); } From e2a1af73cec35b0198659ff805677059f1fc0ee3 Mon Sep 17 00:00:00 2001 From: mrleemurray Date: Wed, 21 Jan 2026 18:17:37 +0000 Subject: [PATCH 2/4] theme: remove unused styles for sticky widget in editor --- extensions/theme-2026/themes/styles.css | 4 ---- 1 file changed, 4 deletions(-) diff --git a/extensions/theme-2026/themes/styles.css b/extensions/theme-2026/themes/styles.css index 48c345ec2b1..37e73344c42 100644 --- a/extensions/theme-2026/themes/styles.css +++ b/extensions/theme-2026/themes/styles.css @@ -247,10 +247,6 @@ .monaco-workbench .monaco-editor:has(.sticky-widget:focus-within) .sticky-widget { background: rgba(252, 252, 253, 0.75) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; box-shadow: 0 0 8px rgba(0, 0, 0, 0.12) !important; } .monaco-workbench.vs-dark .monaco-editor:has(.sticky-widget:focus-within) .sticky-widget { background: rgba(0, 0, 0, 0.4) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; box-shadow: 0 0 8px rgba(0, 0, 0, 0.12) !important; } -.monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines-scrollable { - -} - .monaco-editor .sticky-widget .sticky-line-content, .monaco-workbench .monaco-editor .sticky-widget .sticky-line-number { backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; From 55099106da138ab4892f8537f001ace1e0e75336 Mon Sep 17 00:00:00 2001 From: mrleemurray Date: Wed, 21 Jan 2026 18:18:34 +0000 Subject: [PATCH 3/4] theme: clean up commented styles in quick input and sticky widget --- extensions/theme-2026/themes/styles.css | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/extensions/theme-2026/themes/styles.css b/extensions/theme-2026/themes/styles.css index 37e73344c42..bcfe7faecb9 100644 --- a/extensions/theme-2026/themes/styles.css +++ b/extensions/theme-2026/themes/styles.css @@ -72,8 +72,6 @@ .monaco-workbench.vs-dark .quick-input-widget, .monaco-workbench.hc-black .quick-input-widget { background: rgba(10, 10, 11, 0.5) !important; backdrop-filter: blur(40px) saturate(180%); -webkit-backdrop-filter: blur(40px) saturate(180%); box-shadow: 0 0 20px rgba(0, 0, 0, 0.15) !important; } .monaco-workbench .quick-input-widget .monaco-list-rows { background-color: transparent !important; } -/* .monaco-workbench .quick-input-widget, */ -/* .monaco-workbench .quick-input-widget *, */ .monaco-workbench .quick-input-widget .quick-input-header, .monaco-workbench .quick-input-widget .quick-input-list, .monaco-workbench .quick-input-widget .quick-input-titlebar, @@ -82,7 +80,6 @@ .monaco-workbench .quick-input-widget .quick-input-filter, .monaco-workbench .quick-input-widget .quick-input-action, .monaco-workbench .quick-input-widget .quick-input-message, -/* .monaco-workbench .quick-input-widget .monaco-inputbox, */ .monaco-workbench .quick-input-widget .monaco-list, .monaco-workbench .quick-input-widget .monaco-list-row { border-color: transparent !important; outline: none !important; } .monaco-workbench .quick-input-widget .monaco-inputbox { box-shadow: none !important; background: transparent !important; } @@ -232,14 +229,9 @@ /* Sticky Scroll */ .monaco-workbench .monaco-editor .sticky-widget { box-shadow: 0 0 6px rgba(0, 0, 0, 0.10) !important; border-bottom: none !important; background: rgba(252, 252, 253, 0.65) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; } .monaco-workbench.vs-dark .monaco-editor .sticky-widget { border-bottom: none !important; background: rgba(0, 0, 0, 0.3) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; } -/* .monaco-workbench .monaco-editor .sticky-widget *, -.monaco-workbench .monaco-editor .sticky-widget > *, */ .monaco-workbench .monaco-editor .sticky-widget .sticky-widget-line-numbers, -/* .monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines-scrollable, */ -.monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines, -/* .monaco-workbench .monaco-editor .sticky-widget .sticky-line-number */ -/* .monaco-workbench .monaco-editor .sticky-widget .sticky-line-content, -.monaco-workbench .monaco-editor .sticky-widget .sticky-line-content:hover */ { background-color: transparent !important; background: transparent !important; } +.monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines +{ background-color: transparent !important; background: transparent !important; } .monaco-workbench.vs-dark .monaco-editor .sticky-widget, .monaco-workbench .monaco-editor .sticky-widget-focus-preview, .monaco-workbench .monaco-editor .sticky-scroll-focus-line, From 02267fb71863eeee066e265cb482fc5a7c19181e Mon Sep 17 00:00:00 2001 From: mrleemurray Date: Wed, 21 Jan 2026 18:22:19 +0000 Subject: [PATCH 4/4] theme: update sticky widget background color for improved visibility --- extensions/theme-2026/themes/styles.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/extensions/theme-2026/themes/styles.css b/extensions/theme-2026/themes/styles.css index bcfe7faecb9..fd7ffafb11a 100644 --- a/extensions/theme-2026/themes/styles.css +++ b/extensions/theme-2026/themes/styles.css @@ -229,7 +229,6 @@ /* Sticky Scroll */ .monaco-workbench .monaco-editor .sticky-widget { box-shadow: 0 0 6px rgba(0, 0, 0, 0.10) !important; border-bottom: none !important; background: rgba(252, 252, 253, 0.65) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; } .monaco-workbench.vs-dark .monaco-editor .sticky-widget { border-bottom: none !important; background: rgba(0, 0, 0, 0.3) !important; backdrop-filter: blur(40px) saturate(180%) !important; -webkit-backdrop-filter: blur(40px) saturate(180%) !important; } -.monaco-workbench .monaco-editor .sticky-widget .sticky-widget-line-numbers, .monaco-workbench .monaco-editor .sticky-widget .sticky-widget-lines { background-color: transparent !important; background: transparent !important; } .monaco-workbench.vs-dark .monaco-editor .sticky-widget, @@ -247,7 +246,7 @@ .monaco-workbench.vs-dark .monaco-editor .sticky-widget .sticky-line-content, .monaco-workbench.vs-dark .monaco-editor .sticky-widget .sticky-line-number { - background-color: color-mix(in srgb, var(--vscode-list-hoverBackground) 30%, transparent) + background-color: color-mix(in srgb, var(--vscode-editor-background) 30%, transparent) }