forks/vsc-material-theme
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update interpolation

Browse source
This commit is contained in:
Mattia Astorino 2019-12-23 18:44:15 +01:00
parent 288e86b782
commit d691e92b7c
No known key found for this signature in database
GPG key ID: CDFA82D8B1132C65
1 changed files with 24 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
scripts/generator/color-set.ts
View file

@ -2,12 +2,6 @@ import {IColorSet} from '@moxer/vscode-theme-generator';
import {ThemeSetting} from './types'; import {ThemeSetting} from './types';
export const getColorSet = (theme: ThemeSetting): IColorSet => { export const getColorSet = (theme: ThemeSetting): IColorSet => {
// Do this like below if you need to interpolate
const themeSchemeBackground = `${theme.scheme.background}00`;
const themeSchemeBasePaleBlue = `${theme.scheme.base.paleblue}50`;
const themeSchemeForeground = `${theme.scheme.foreground}05`;
// Const themeSchemeShade2 = `${theme.scheme.shade2}50`;
return { return {
base: { base: {
// Determines the overall background color // Determines the overall background color
@ -30,15 +24,15 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
/** /**
* General elements style * General elements style
*/ */
focusBorder: themeSchemeBackground, focusBorder: `${theme.scheme.background}00`,
'widget.shadow': themeSchemeBackground, 'widget.shadow': `${theme.scheme.background}00`,
'selection.background': themeSchemeBasePaleBlue, 'selection.background': `${theme.scheme.base.paleblue}50`,
'scrollbar.shadow': themeSchemeBackground, 'scrollbar.shadow': `${theme.scheme.background}00`,
'editorLink.activeForeground': theme.scheme.foreground, 'editorLink.activeForeground': theme.scheme.foreground,
'progressBar.background': theme.scheme.base.yellow, 'progressBar.background': theme.scheme.base.yellow,
'debugToolBar.background': theme.scheme.background, 'debugToolBar.background': theme.scheme.background,
'pickerGroup.foreground': theme.scheme.base.yellow, 'pickerGroup.foreground': theme.scheme.base.yellow,
'editorMarkerNavigation.background': themeSchemeForeground, '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,
@ -84,8 +78,8 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
'editor.foreground': theme.scheme.foreground, 'editor.foreground': theme.scheme.foreground,
// 'editor.lineHighlightBackground': theme.scheme.shade1 + '50', // 'editor.lineHighlightBackground': theme.scheme.shade1 + '50',
// 'editor.lineHighlightBorder': theme.scheme.shade1 + '00', // 'editor.lineHighlightBorder': theme.scheme.shade1 + '00',
'editor.findMatchBackground': themeSchemeBackground, 'editor.findMatchBackground': `${theme.scheme.background}00`,
'editor.findMatchHighlightBackground': themeSchemeBackground, 'editor.findMatchHighlightBackground': `${theme.scheme.background}00`,
'editor.findMatchBorder': theme.scheme.base.pink, 'editor.findMatchBorder': theme.scheme.base.pink,
// 'editor.findMatchHighlightBorder': theme.scheme.shade6, // 'editor.findMatchHighlightBorder': theme.scheme.shade6,
// Editor Indent guides // Editor Indent guides
@ -98,9 +92,9 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
'editorGroupHeader.tabsBackground': theme.scheme.background, 'editorGroupHeader.tabsBackground': theme.scheme.background,
'editorGroup.border': theme.scheme.background, 'editorGroup.border': theme.scheme.background,
// 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`,
'editorGutter.deletedBackground': theme.scheme.base.red + '60', 'editorGutter.deletedBackground': `${theme.scheme.base.red}60`,
/** /**
* Activity bar style * Activity bar style
*/ */
@ -167,7 +161,7 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
/** /**
* Matching brackets style * Matching brackets style
*/ */
'editorBracketMatch.border': theme.scheme.base.cyan + '70', 'editorBracketMatch.border': `${theme.scheme.base.cyan}70`,
'editorBracketMatch.background': theme.scheme.background, 'editorBracketMatch.background': theme.scheme.background,
/** /**
* Editor Overview Ruler style * Editor Overview Ruler style
@ -206,9 +200,9 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
/** /**
* Inputs validation style * Inputs validation style
*/ */
'inputValidation.errorBorder': theme.scheme.base.red + '50', 'inputValidation.errorBorder': `${theme.scheme.base.red}50`,
'inputValidation.infoBorder': theme.scheme.base.blue + '50', 'inputValidation.infoBorder': `${theme.scheme.base.blue}50`,
'inputValidation.warningBorder': theme.scheme.base.yellow + '50', 'inputValidation.warningBorder': `${theme.scheme.base.yellow}50`,
/** /**
* Dropdown menu style * Dropdown menu style
*/ */
@ -218,8 +212,8 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
* Lists style * Lists style
*/ */
'list.hoverForeground': theme.scheme.foreground, 'list.hoverForeground': theme.scheme.foreground,
'list.hoverBackground': themeSchemeBackground, 'list.hoverBackground': `${theme.scheme.background}00`,
'list.activeSelectionBackground': themeSchemeBackground, 'list.activeSelectionBackground': `${theme.scheme.background}00`,
'list.activeSelectionForeground': theme.scheme.base.cyan, 'list.activeSelectionForeground': theme.scheme.base.cyan,
'list.inactiveSelectionForeground': theme.scheme.base.cyan, 'list.inactiveSelectionForeground': theme.scheme.base.cyan,
// 'list.inactiveSelectionBackground': theme.scheme.shade1 + '50', // 'list.inactiveSelectionBackground': theme.scheme.shade1 + '50',
@ -238,8 +232,8 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
/** /**
* Editor diff editor style * Editor diff editor style
*/ */
'diffEditor.insertedTextBackground': theme.scheme.base.cyan + '20', 'diffEditor.insertedTextBackground': `${theme.scheme.base.cyan}20`,
'diffEditor.removedTextBackground': theme.scheme.base.pink + '20', 'diffEditor.removedTextBackground': `${theme.scheme.base.pink}20`,
/** /**
* Extensions button style * Extensions button style
*/ */
@ -255,8 +249,8 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
// 'peekViewTitle.background': theme.scheme.shade1, // 'peekViewTitle.background': theme.scheme.shade1,
'peekViewEditorGutter.background': theme.scheme.background, 'peekViewEditorGutter.background': theme.scheme.background,
'peekViewTitleDescription.foreground': theme.scheme.foreground, 'peekViewTitleDescription.foreground': theme.scheme.foreground,
'peekViewResult.matchHighlightBackground': theme.scheme.base.pink + '50', 'peekViewResult.matchHighlightBackground': `${theme.scheme.base.pink}50`,
'peekViewEditor.matchHighlightBackground': theme.scheme.base.pink + '50', 'peekViewEditor.matchHighlightBackground': `${theme.scheme.base.pink}50`,
// 'peekViewResult.selectionBackground': theme.scheme.shade1, // 'peekViewResult.selectionBackground': theme.scheme.shade1,
/** /**
* GIT decorations style * GIT decorations style
@ -363,17 +357,17 @@ export const getColorSet = (theme: ThemeSetting): IColorSet => {
// Ighlights matches from the find widge // Ighlights matches from the find widge
findMatchHighlight: theme.scheme.base.pink, findMatchHighlight: theme.scheme.base.pink,
// Highlights the selected area for "find in selection" // Highlights the selected area for "find in selection"
findRangeHighlight: theme.scheme.base.yellow + '30', findRangeHighlight: `${theme.scheme.base.yellow}30`,
// Set color for invisible characters/whitespaces // Set color for invisible characters/whitespaces
// invisibles: theme.scheme.shade1, // invisibles: theme.scheme.shade1,
// Highlights text which matches the selected text // Highlights text which matches the selected text
// selection: theme.scheme.shade1, // selection: theme.scheme.shade1,
// Highlights text inside selected area // Highlights text inside selected area
selectionHighlight: theme.scheme.base.yellow + '50', selectionHighlight: `${theme.scheme.base.yellow}50`,
// When the cursor is on a symbol, highlights places that symbol is read // When the cursor is on a symbol, highlights places that symbol is read
wordHighlight: theme.scheme.base.pink + '30', wordHighlight: `${theme.scheme.base.pink}30`,
// When the cursor is on a symbol, highlights places that symbol is written // When the cursor is on a symbol, highlights places that symbol is written
wordHighlightStrong: theme.scheme.base.green + '30' wordHighlightStrong: `${theme.scheme.base.green}30`
} }
/** /**
* Override all syntax tokens * Override all syntax tokens