Start customizing workbench
This commit is contained in:
parent
ea41ae82e7
commit
7b69e59cf3
12 changed files with 50 additions and 29 deletions
|
@ -24,28 +24,36 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
|
||||||
/**
|
/**
|
||||||
* General elements style
|
* 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`,
|
'widget.shadow': `${theme.scheme.background}00`,
|
||||||
'selection.background': `${theme.scheme.base.paleblue}50`,
|
'scrollbar.shadow': theme.scheme.shadow,
|
||||||
'scrollbar.shadow': `${theme.scheme.background}00`,
|
|
||||||
'editorLink.activeForeground': theme.scheme.foreground,
|
'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,
|
'debugToolBar.background': theme.scheme.background,
|
||||||
'pickerGroup.foreground': theme.scheme.base.yellow,
|
'pickerGroup.foreground': theme.scheme.defaultAccent,
|
||||||
'editorMarkerNavigation.background': `${theme.scheme.foreground}05`,
|
'editorMarkerNavigation.background': `${theme.scheme.foreground}05`,
|
||||||
// 'tree.indentGuidesStroke': theme.scheme.shade1,
|
// 'tree.indentGuidesStroke': theme.scheme.shade1,
|
||||||
'terminalCursor.foreground': theme.scheme.base.yellow,
|
'terminalCursor.foreground': theme.scheme.base.yellow,
|
||||||
'terminalCursor.background': theme.scheme.base.black,
|
'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
|
* Buttons style
|
||||||
*/
|
*/
|
||||||
'button.background': theme.scheme.background,
|
'button.background': theme.scheme.selection,
|
||||||
// 'button.hoverBackground': theme.scheme.shade2,
|
// 'button.hoverBackground': theme.scheme.shade2,
|
||||||
/**
|
/**
|
||||||
* Links style
|
* Links style
|
||||||
*/
|
*/
|
||||||
'textLink.foreground': theme.scheme.base.cyan,
|
'textLink.foreground': theme.scheme.defaultAccent,
|
||||||
'textLink.activeForeground': theme.scheme.base.yellow,
|
'textLink.activeForeground': theme.scheme.foreground,
|
||||||
/**
|
/**
|
||||||
* Sidebar style
|
* Sidebar style
|
||||||
*/
|
*/
|
||||||
|
@ -76,21 +84,23 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
|
||||||
*/
|
*/
|
||||||
'editor.background': theme.scheme.background,
|
'editor.background': theme.scheme.background,
|
||||||
'editor.foreground': theme.scheme.foreground,
|
'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.lineHighlightBorder': theme.scheme.shade1 + '00',
|
||||||
'editor.findMatchBackground': `${theme.scheme.background}00`,
|
'editor.findMatchBackground': theme.scheme.findMatchBackground,
|
||||||
'editor.findMatchHighlightBackground': `${theme.scheme.background}00`,
|
'editor.findMatchHighlightBackground': theme.scheme.findMatchHighlightBackground,
|
||||||
'editor.findMatchBorder': theme.scheme.base.pink,
|
'editor.findMatchBorder': theme.scheme.defaultAccent,
|
||||||
// 'editor.findMatchHighlightBorder': theme.scheme.shade6,
|
'editor.findMatchHighlightBorder': theme.scheme.findMatchHighlightBorder,
|
||||||
// Editor Indent guides
|
// Editor Indent guides
|
||||||
// 'editorIndentGuide.background': theme.scheme.shade1,
|
'editorIndentGuide.background': `${theme.scheme.guides}70`,
|
||||||
// 'editorIndentGuide.activeBackground': theme.scheme.shade3,
|
'editorIndentGuide.activeBackground': theme.scheme.guides,
|
||||||
// Editor line number
|
// Editor line number
|
||||||
// 'editorLineNumber.foreground': theme.scheme.shade3,
|
'editorLineNumber.foreground': theme.scheme.lineNumbers,
|
||||||
'editorLineNumber.activeForeground': theme.scheme.base.yellow,
|
'editorLineNumber.activeForeground': theme.scheme.sidebarForeground,
|
||||||
// Editor tab groups
|
// Editor tab groups
|
||||||
'editorGroupHeader.tabsBackground': theme.scheme.background,
|
'editorGroupHeader.tabsBackground': theme.scheme.background,
|
||||||
'editorGroup.border': theme.scheme.background,
|
'editorGroup.border': theme.scheme.shadow,
|
||||||
// Editor gutter
|
// Editor gutter
|
||||||
'editorGutter.modifiedBackground': `${theme.scheme.base.blue}60`,
|
'editorGutter.modifiedBackground': `${theme.scheme.base.blue}60`,
|
||||||
'editorGutter.addedBackground': `${theme.scheme.base.green}60`,
|
'editorGutter.addedBackground': `${theme.scheme.base.green}60`,
|
||||||
|
@ -161,27 +171,27 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
|
||||||
/**
|
/**
|
||||||
* Matching brackets style
|
* Matching brackets style
|
||||||
*/
|
*/
|
||||||
'editorBracketMatch.border': `${theme.scheme.base.cyan}70`,
|
'editorBracketMatch.border': `${theme.scheme.caret}50`,
|
||||||
'editorBracketMatch.background': theme.scheme.background,
|
'editorBracketMatch.background': theme.scheme.background,
|
||||||
/**
|
/**
|
||||||
* Editor Overview Ruler style
|
* Editor Overview Ruler style
|
||||||
*/
|
*/
|
||||||
'editorOverviewRuler.findMatchForeground': theme.scheme.base.pink,
|
'editorOverviewRuler.findMatchForeground': theme.scheme.defaultAccent,
|
||||||
// 'editorOverviewRuler.border': theme.scheme.borders,
|
'editorOverviewRuler.border': theme.scheme.background,
|
||||||
'editorOverviewRuler.errorForeground': theme.scheme.base.red,
|
'editorOverviewRuler.errorForeground': `${theme.scheme.base.red}40`,
|
||||||
'editorOverviewRuler.infoForeground': theme.scheme.base.blue,
|
'editorOverviewRuler.infoForeground': `${theme.scheme.base.blue}40`,
|
||||||
'editorOverviewRuler.warningForeground': theme.scheme.base.yellow,
|
'editorOverviewRuler.warningForeground': `${theme.scheme.base.yellow}40`,
|
||||||
/**
|
/**
|
||||||
* Squigglies style
|
* Squigglies style
|
||||||
*/
|
*/
|
||||||
'editorInfo.foreground': theme.scheme.base.blue,
|
'editorInfo.foreground': `${theme.scheme.base.blue}70`,
|
||||||
'editorWarning.foreground': theme.scheme.base.yellow,
|
'editorWarning.foreground': `${theme.scheme.base.yellow}70`,
|
||||||
'editorError.foreground': theme.scheme.base.red,
|
'editorError.foreground': `${theme.scheme.base.red}70`,
|
||||||
/**
|
/**
|
||||||
* Popop dialogs style
|
* Popop dialogs style
|
||||||
*/
|
*/
|
||||||
// 'editorHoverWidget.background': theme.scheme.shade1,
|
'editorHoverWidget.background': theme.scheme.background,
|
||||||
// 'editorHoverWidget.border': theme.scheme.shade1,
|
'editorHoverWidget.border': theme.scheme.inputBorder,
|
||||||
/**
|
/**
|
||||||
* Title bar style
|
* Title bar style
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Darker-High-Contrast',
|
name: 'Material-Theme-Darker-High-Contrast',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#212121',
|
background: '#212121',
|
||||||
backgroundAlt: '#1a1a1a',
|
backgroundAlt: '#1a1a1a',
|
||||||
contrastBorder: '#000000',
|
contrastBorder: '#000000',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Darker',
|
name: 'Material-Theme-Darker',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#212121',
|
background: '#212121',
|
||||||
backgroundAlt: '#212121',
|
backgroundAlt: '#212121',
|
||||||
contrastBorder: '#212121',
|
contrastBorder: '#212121',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Default-High-Contrast',
|
name: 'Material-Theme-Default-High-Contrast',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#263238',
|
background: '#263238',
|
||||||
backgroundAlt: '#192227',
|
backgroundAlt: '#192227',
|
||||||
contrastBorder: '#000000',
|
contrastBorder: '#000000',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Default',
|
name: 'Material-Theme-Default',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#263238',
|
background: '#263238',
|
||||||
backgroundAlt: '#263238',
|
backgroundAlt: '#263238',
|
||||||
contrastBorder: '#263238',
|
contrastBorder: '#263238',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Lighter-High-Contrast',
|
name: 'Material-Theme-Lighter-High-Contrast',
|
||||||
type: 'light',
|
type: 'light',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#FFFFFF',
|
background: '#FFFFFF',
|
||||||
backgroundAlt: '#FAFAFA',
|
backgroundAlt: '#FAFAFA',
|
||||||
contrastBorder: '#CBCBCB',
|
contrastBorder: '#CBCBCB',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Lighter',
|
name: 'Material-Theme-Lighter',
|
||||||
type: 'light',
|
type: 'light',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#FAFAFA',
|
background: '#FAFAFA',
|
||||||
backgroundAlt: '#FAFAFA',
|
backgroundAlt: '#FAFAFA',
|
||||||
contrastBorder: '#FAFAFA',
|
contrastBorder: '#FAFAFA',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Ocean-High-Contrast',
|
name: 'Material-Theme-Ocean-High-Contrast',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#0F111A',
|
background: '#0F111A',
|
||||||
backgroundAlt: '#090B10',
|
backgroundAlt: '#090B10',
|
||||||
contrastBorder: '#000000',
|
contrastBorder: '#000000',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Ocean',
|
name: 'Material-Theme-Ocean',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#0F111A',
|
background: '#0F111A',
|
||||||
backgroundAlt: '#0F111A',
|
backgroundAlt: '#0F111A',
|
||||||
contrastBorder: '#0F111A',
|
contrastBorder: '#0F111A',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Palenight-High-Contrast',
|
name: 'Material-Theme-Palenight-High-Contrast',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#292D3E',
|
background: '#292D3E',
|
||||||
backgroundAlt: '#1B1E2B',
|
backgroundAlt: '#1B1E2B',
|
||||||
contrastBorder: '#000000',
|
contrastBorder: '#000000',
|
||||||
|
|
|
@ -3,6 +3,7 @@ export default {
|
||||||
name: 'Material-Theme-Palenight',
|
name: 'Material-Theme-Palenight',
|
||||||
type: 'dark',
|
type: 'dark',
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: '#80CBC4',
|
||||||
background: '#292D3E',
|
background: '#292D3E',
|
||||||
backgroundAlt: '#292D3E',
|
backgroundAlt: '#292D3E',
|
||||||
contrastBorder: '#292D3E',
|
contrastBorder: '#292D3E',
|
||||||
|
|
|
@ -4,6 +4,7 @@ export type ThemeSetting = {
|
||||||
name: string;
|
name: string;
|
||||||
type: string;
|
type: string;
|
||||||
scheme: {
|
scheme: {
|
||||||
|
defaultAccent: string;
|
||||||
background: string;
|
background: string;
|
||||||
backgroundAlt: string;
|
backgroundAlt: string;
|
||||||
contrastBorder: string;
|
contrastBorder: string;
|
||||||
|
|
Loading…
Reference in a new issue