From 7b69e59cf3fd0d5963ff293872ea4c2374a4b8f2 Mon Sep 17 00:00:00 2001 From: Mattia Astorino Date: Thu, 26 Dec 2019 12:13:25 +0100 Subject: [PATCH] Start customizing workbench --- scripts/generator/color-set.ts | 68 +++++++++++-------- .../generator/settings/specific/darker-hc.ts | 1 + scripts/generator/settings/specific/darker.ts | 1 + .../generator/settings/specific/default-hc.ts | 1 + .../generator/settings/specific/default.ts | 1 + .../generator/settings/specific/lighter-hc.ts | 1 + .../generator/settings/specific/lighter.ts | 1 + .../generator/settings/specific/ocean-hc.ts | 1 + scripts/generator/settings/specific/ocean.ts | 1 + .../settings/specific/palenight-hc.ts | 1 + .../generator/settings/specific/palenight.ts | 1 + scripts/generator/types.ts | 1 + 12 files changed, 50 insertions(+), 29 deletions(-) diff --git a/scripts/generator/color-set.ts b/scripts/generator/color-set.ts index be38226..8f54eb3 100644 --- a/scripts/generator/color-set.ts +++ b/scripts/generator/color-set.ts @@ -24,28 +24,36 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => { /** * General elements style */ - focusBorder: `${theme.scheme.background}00`, + focusBorder: `${theme.scheme.focusBorder}00`, + 'editorCursor.foreground': theme.scheme.caret, + 'editorRuler.foreground': theme.scheme.guides, 'widget.shadow': `${theme.scheme.background}00`, - 'selection.background': `${theme.scheme.base.paleblue}50`, - 'scrollbar.shadow': `${theme.scheme.background}00`, + 'scrollbar.shadow': theme.scheme.shadow, 'editorLink.activeForeground': theme.scheme.foreground, - 'progressBar.background': theme.scheme.base.yellow, + 'selection.background': theme.scheme.defaultAccent, + 'progressBar.background': theme.scheme.defaultAccent, 'debugToolBar.background': theme.scheme.background, - 'pickerGroup.foreground': theme.scheme.base.yellow, + 'pickerGroup.foreground': theme.scheme.defaultAccent, 'editorMarkerNavigation.background': `${theme.scheme.foreground}05`, // 'tree.indentGuidesStroke': theme.scheme.shade1, 'terminalCursor.foreground': theme.scheme.base.yellow, 'terminalCursor.background': theme.scheme.base.black, + 'editorWhitespace.foreground': `${theme.scheme.foreground}40`, + /** + * InputOption + */ + 'inputOption.activeBackground': `${theme.scheme.foreground}30`, + 'inputOption.activeBorder': `${theme.scheme.foreground}30`, /** * Buttons style */ - 'button.background': theme.scheme.background, + 'button.background': theme.scheme.selection, // 'button.hoverBackground': theme.scheme.shade2, /** * Links style */ - 'textLink.foreground': theme.scheme.base.cyan, - 'textLink.activeForeground': theme.scheme.base.yellow, + 'textLink.foreground': theme.scheme.defaultAccent, + 'textLink.activeForeground': theme.scheme.foreground, /** * Sidebar style */ @@ -76,21 +84,23 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => { */ 'editor.background': theme.scheme.background, 'editor.foreground': theme.scheme.foreground, - // 'editor.lineHighlightBackground': theme.scheme.shade1 + '50', + 'editor.lineHighlightBackground': `${theme.scheme.lineHighlight}50`, + 'editor.selectionBackground': theme.scheme.selection, + 'editor.selectionHighlightBackground': `${theme.scheme.caret}20`, // 'editor.lineHighlightBorder': theme.scheme.shade1 + '00', - 'editor.findMatchBackground': `${theme.scheme.background}00`, - 'editor.findMatchHighlightBackground': `${theme.scheme.background}00`, - 'editor.findMatchBorder': theme.scheme.base.pink, - // 'editor.findMatchHighlightBorder': theme.scheme.shade6, + 'editor.findMatchBackground': theme.scheme.findMatchBackground, + 'editor.findMatchHighlightBackground': theme.scheme.findMatchHighlightBackground, + 'editor.findMatchBorder': theme.scheme.defaultAccent, + 'editor.findMatchHighlightBorder': theme.scheme.findMatchHighlightBorder, // Editor Indent guides - // 'editorIndentGuide.background': theme.scheme.shade1, - // 'editorIndentGuide.activeBackground': theme.scheme.shade3, + 'editorIndentGuide.background': `${theme.scheme.guides}70`, + 'editorIndentGuide.activeBackground': theme.scheme.guides, // Editor line number - // 'editorLineNumber.foreground': theme.scheme.shade3, - 'editorLineNumber.activeForeground': theme.scheme.base.yellow, + 'editorLineNumber.foreground': theme.scheme.lineNumbers, + 'editorLineNumber.activeForeground': theme.scheme.sidebarForeground, // Editor tab groups 'editorGroupHeader.tabsBackground': theme.scheme.background, - 'editorGroup.border': theme.scheme.background, + 'editorGroup.border': theme.scheme.shadow, // Editor gutter 'editorGutter.modifiedBackground': `${theme.scheme.base.blue}60`, 'editorGutter.addedBackground': `${theme.scheme.base.green}60`, @@ -161,27 +171,27 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => { /** * Matching brackets style */ - 'editorBracketMatch.border': `${theme.scheme.base.cyan}70`, + 'editorBracketMatch.border': `${theme.scheme.caret}50`, 'editorBracketMatch.background': theme.scheme.background, /** * Editor Overview Ruler style */ - 'editorOverviewRuler.findMatchForeground': theme.scheme.base.pink, - // 'editorOverviewRuler.border': theme.scheme.borders, - 'editorOverviewRuler.errorForeground': theme.scheme.base.red, - 'editorOverviewRuler.infoForeground': theme.scheme.base.blue, - 'editorOverviewRuler.warningForeground': theme.scheme.base.yellow, + 'editorOverviewRuler.findMatchForeground': theme.scheme.defaultAccent, + 'editorOverviewRuler.border': theme.scheme.background, + 'editorOverviewRuler.errorForeground': `${theme.scheme.base.red}40`, + 'editorOverviewRuler.infoForeground': `${theme.scheme.base.blue}40`, + 'editorOverviewRuler.warningForeground': `${theme.scheme.base.yellow}40`, /** * Squigglies style */ - 'editorInfo.foreground': theme.scheme.base.blue, - 'editorWarning.foreground': theme.scheme.base.yellow, - 'editorError.foreground': theme.scheme.base.red, + 'editorInfo.foreground': `${theme.scheme.base.blue}70`, + 'editorWarning.foreground': `${theme.scheme.base.yellow}70`, + 'editorError.foreground': `${theme.scheme.base.red}70`, /** * Popop dialogs style */ - // 'editorHoverWidget.background': theme.scheme.shade1, - // 'editorHoverWidget.border': theme.scheme.shade1, + 'editorHoverWidget.background': theme.scheme.background, + 'editorHoverWidget.border': theme.scheme.inputBorder, /** * Title bar style */ diff --git a/scripts/generator/settings/specific/darker-hc.ts b/scripts/generator/settings/specific/darker-hc.ts index ed6e96b..338fce9 100644 --- a/scripts/generator/settings/specific/darker-hc.ts +++ b/scripts/generator/settings/specific/darker-hc.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Darker-High-Contrast', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#212121', backgroundAlt: '#1a1a1a', contrastBorder: '#000000', diff --git a/scripts/generator/settings/specific/darker.ts b/scripts/generator/settings/specific/darker.ts index 8373006..cb6d21f 100644 --- a/scripts/generator/settings/specific/darker.ts +++ b/scripts/generator/settings/specific/darker.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Darker', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#212121', backgroundAlt: '#212121', contrastBorder: '#212121', diff --git a/scripts/generator/settings/specific/default-hc.ts b/scripts/generator/settings/specific/default-hc.ts index 6d46047..9313ba6 100644 --- a/scripts/generator/settings/specific/default-hc.ts +++ b/scripts/generator/settings/specific/default-hc.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Default-High-Contrast', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#263238', backgroundAlt: '#192227', contrastBorder: '#000000', diff --git a/scripts/generator/settings/specific/default.ts b/scripts/generator/settings/specific/default.ts index 4286dc3..5c5881e 100644 --- a/scripts/generator/settings/specific/default.ts +++ b/scripts/generator/settings/specific/default.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Default', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#263238', backgroundAlt: '#263238', contrastBorder: '#263238', diff --git a/scripts/generator/settings/specific/lighter-hc.ts b/scripts/generator/settings/specific/lighter-hc.ts index dbceba6..4977402 100644 --- a/scripts/generator/settings/specific/lighter-hc.ts +++ b/scripts/generator/settings/specific/lighter-hc.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Lighter-High-Contrast', type: 'light', scheme: { + defaultAccent: '#80CBC4', background: '#FFFFFF', backgroundAlt: '#FAFAFA', contrastBorder: '#CBCBCB', diff --git a/scripts/generator/settings/specific/lighter.ts b/scripts/generator/settings/specific/lighter.ts index 20d6c9b..7cccc11 100644 --- a/scripts/generator/settings/specific/lighter.ts +++ b/scripts/generator/settings/specific/lighter.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Lighter', type: 'light', scheme: { + defaultAccent: '#80CBC4', background: '#FAFAFA', backgroundAlt: '#FAFAFA', contrastBorder: '#FAFAFA', diff --git a/scripts/generator/settings/specific/ocean-hc.ts b/scripts/generator/settings/specific/ocean-hc.ts index 17bc7f2..7a1a358 100644 --- a/scripts/generator/settings/specific/ocean-hc.ts +++ b/scripts/generator/settings/specific/ocean-hc.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Ocean-High-Contrast', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#0F111A', backgroundAlt: '#090B10', contrastBorder: '#000000', diff --git a/scripts/generator/settings/specific/ocean.ts b/scripts/generator/settings/specific/ocean.ts index 1a4dd68..ab588db 100644 --- a/scripts/generator/settings/specific/ocean.ts +++ b/scripts/generator/settings/specific/ocean.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Ocean', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#0F111A', backgroundAlt: '#0F111A', contrastBorder: '#0F111A', diff --git a/scripts/generator/settings/specific/palenight-hc.ts b/scripts/generator/settings/specific/palenight-hc.ts index 8c2e0bd..7004075 100644 --- a/scripts/generator/settings/specific/palenight-hc.ts +++ b/scripts/generator/settings/specific/palenight-hc.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Palenight-High-Contrast', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#292D3E', backgroundAlt: '#1B1E2B', contrastBorder: '#000000', diff --git a/scripts/generator/settings/specific/palenight.ts b/scripts/generator/settings/specific/palenight.ts index f93a26f..470a5d4 100644 --- a/scripts/generator/settings/specific/palenight.ts +++ b/scripts/generator/settings/specific/palenight.ts @@ -3,6 +3,7 @@ export default { name: 'Material-Theme-Palenight', type: 'dark', scheme: { + defaultAccent: '#80CBC4', background: '#292D3E', backgroundAlt: '#292D3E', contrastBorder: '#292D3E', diff --git a/scripts/generator/types.ts b/scripts/generator/types.ts index b2e0aeb..4f666f6 100644 --- a/scripts/generator/types.ts +++ b/scripts/generator/types.ts @@ -4,6 +4,7 @@ export type ThemeSetting = { name: string; type: string; scheme: { + defaultAccent: string; background: string; backgroundAlt: string; contrastBorder: string;