lxm_front/eruda
1
0
Fork 0
mirror of synced 2025-11-06 04:21:11 +08:00
Code Issues Projects Releases Wiki Activity

feat: themes

Browse Source
This commit is contained in:
surunzi
2019-11-18 14:35:33 +08:00
parent e188ca28b5
commit be50213a74
9 changed files with 1007 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

368
eustia/evalCss.js
View File

@@ -7,29 +7,37 @@ let styleList = []
let scale = 1
function createDarkTheme(theme) {
return extend(theme, {
consoleWarnBackground: '#332a00',
consoleWarnForeground: '#ffcb6b',
consoleWarnBorder: '#650',
consoleErrorBackground: '#290000',
consoleErrorForeground: '#ff8080',
consoleErrorBorder: '#5c0000',
light: '#ccc',
dark: '#aaa'
})
if (!theme.darkerBackground) theme.darkerBackground = theme.contrast
return extend(
{
consoleWarnBackground: '#332a00',
consoleWarnForeground: '#ffcb6b',
consoleWarnBorder: '#650',
consoleErrorBackground: '#290000',
consoleErrorForeground: '#ff8080',
consoleErrorBorder: '#5c0000',
light: '#ccc',
dark: '#aaa'
},
theme
)
}
function createLightTheme(theme) {
return extend(theme, {
consoleWarnBackground: '#fffbe5',
consoleWarnForeground: '#5c5c00',
consoleWarnBorder: '#fff5c2',
consoleErrorBackground: '#fff0f0',
consoleErrorForeground: '#f00',
consoleErrorBorder: '#ffd6d6',
light: '#fff',
dark: '#eee'
})
if (!theme.darkerBackground) theme.darkerBackground = theme.contrast
return extend(
{
consoleWarnBackground: '#fffbe5',
consoleWarnForeground: '#5c5c00',
consoleWarnBorder: '#fff5c2',
consoleErrorBackground: '#fff0f0',
consoleErrorForeground: '#f00',
consoleErrorBorder: '#ffd6d6',
light: '#fff',
dark: '#eee'
},
theme
)
}
const themes = {
@@ -40,7 +48,6 @@ const themes = {
selectForeground: '#333',
accent: '#1a73e8',
highlight: '#eaeaea',
active: '#aaa',
border: '#ccc',
primary: '#333',
contrast: '#f2f7fd',
@@ -64,7 +71,6 @@ const themes = {
selectForeground: '#eaeaea',
accent: '#555',
highlight: '#000',
active: '#555',
border: '#3d3d3d',
primary: '#ccc',
contrast: '#0b2544',
@@ -78,32 +84,322 @@ const themes = {
tagNameColor: '#5db0d7',
functionColor: '#d5d5d5',
attributeNameColor: '#9bbbdc',
commentColor: '#747474',
cssProperty: '#35d4c7'
commentColor: '#747474'
}),
'Material Oceanic': createDarkTheme({
darkerBackground: '#212c31',
background: '#263238',
foreground: '#b0b1c5',
selectForeground: '#fff',
foreground: '#B0BEC5',
selectForeground: '#FFFFFF',
accent: '#009688',
highlight: '#425b67',
active: '#314549',
border: '#2a373e',
primary: '#607d8b',
contrast: '#1e272c',
varColor: '#eff',
highlight: '#425B67',
border: '#2A373E',
primary: '#607D8B',
contrast: '#1E272C',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#c3cee3',
textColor: '#B0BEC5',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#546e7a',
cssProperty: '#35d4c7'
commentColor: '#546e7a'
}),
'Material Darker': createDarkTheme({
background: '#212121',
foreground: '#B0BEC5',
selectForeground: '#FFFFFF',
accent: '#FF9800',
highlight: '#3F3F3F',
border: '#292929',
primary: '#727272',
contrast: '#1A1A1A',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#B0BEC5',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#616161'
}),
'Material Lighter': createLightTheme({
background: '#FAFAFA',
foreground: '#546E7A',
selectForeground: '#546e7a',
accent: '#00BCD4',
highlight: '#E7E7E8',
border: '#d3e1e8',
primary: '#94A7B0',
contrast: '#F4F4F4',
varColor: '#272727',
stringColor: '#91B859',
keywordColor: '#7C4DFF',
numberColor: '#F76D47',
operatorColor: '#39ADB5',
linkColor: '#39ADB5',
textColor: '#546E7A',
tagNameColor: '#E53935',
functionColor: '#6182B8',
attributeNameColor: '#F6A434',
commentColor: '#AABFC9'
}),
'Material Palenight': createDarkTheme({
background: '#292D3E',
foreground: '#A6ACCD',
selectForeground: '#FFFFFF',
accent: '#ab47bc',
highlight: '#444267',
border: '#2b2a3e',
primary: '#676E95',
contrast: '#202331',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#A6ACCD',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#676E95'
}),
'Material Deep Ocean': createDarkTheme({
background: '#0F111A',
foreground: '#8F93A2',
selectForeground: '#FFFFFF',
accent: '#84ffff',
highlight: '#1F2233',
border: '#0F111A',
primary: '#4B526D',
contrast: '#090B10',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#8F93A2',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#717CB4'
}),
'Monokai Pro': createDarkTheme({
background: '#2D2A2E',
foreground: '#fcfcfa',
selectForeground: '#FFFFFF',
accent: '#ffd866',
highlight: '#5b595c',
border: '#2d2a2e',
primary: '#939293',
contrast: '#221F22',
varColor: '#FCFCFA',
stringColor: '#FFD866',
keywordColor: '#FF6188',
numberColor: '#AB9DF2',
operatorColor: '#FF6188',
linkColor: '#78DCE8',
textColor: '#fcfcfa',
tagNameColor: '#FF6188',
functionColor: '#A9DC76',
attributeNameColor: '#78DCE8',
commentColor: '#727072'
}),
Dracula: createDarkTheme({
background: '#282A36',
foreground: '#F8F8F2',
selectForeground: '#8BE9FD',
accent: '#FF79C5',
highlight: '#6272A4',
border: '#21222C',
primary: '#6272A4',
contrast: '#191A21',
varColor: '#F8F8F2',
stringColor: '#F1FA8C',
keywordColor: '#FF79C6',
numberColor: '#BD93F9',
operatorColor: '#FF79C6',
linkColor: '#F1FA8C',
textColor: '#F8F8F2',
tagNameColor: '#FF79C6',
functionColor: '#50FA78',
attributeNameColor: '#50FA7B',
commentColor: '#6272A4'
}),
'Arc Dark': createDarkTheme({
background: '#2f343f',
foreground: '#D3DAE3',
selectForeground: '#FFFFFF',
accent: '#42A5F5',
highlight: '#3F3F46',
border: '#404552',
primary: '#8b9eb5',
contrast: '#262b33',
varColor: '#CF6A4C',
stringColor: '#8F9D6A',
keywordColor: '#9B859D',
numberColor: '#CDA869',
operatorColor: '#A7A7A7',
linkColor: '#7587A6',
textColor: '#D3DAE3',
tagNameColor: '#CF6A4C',
functionColor: '#7587A6',
attributeNameColor: '#F9EE98',
commentColor: '#747C84'
}),
'Atom One Dark': createDarkTheme({
background: '#282C34',
foreground: '#979FAD',
selectForeground: '#FFFFFF',
accent: '#2979ff',
highlight: '#383D48',
border: '#282C34',
primary: '#979FAD',
contrast: '#21252B',
varColor: '#D19A66',
stringColor: '#98C379',
keywordColor: '#C679DD',
numberColor: '#D19A66',
operatorColor: '#61AFEF',
linkColor: '#56B6C2',
textColor: '#979FAD',
tagNameColor: '#F07178',
functionColor: '#61AEEF',
attributeNameColor: '#E5C17C',
commentColor: '#59626F'
}),
'Atom One Light': createLightTheme({
background: '#FAFAFA',
foreground: '#232324',
selectForeground: '#232324',
accent: '#2979ff',
highlight: '#EAEAEB',
border: '#DBDBDC',
primary: '#9D9D9F',
contrast: '#FFFFFF',
varColor: '#986801',
stringColor: '#50A14E',
keywordColor: '#A626A4',
numberColor: '#986801',
operatorColor: '#4078F2',
linkColor: '#0184BC',
textColor: '#232324',
tagNameColor: '#E4564A',
functionColor: '#4078F2',
attributeNameColor: '#C18401',
commentColor: '#A0A1A7'
}),
'Solarized Dark': createDarkTheme({
background: '#002B36',
foreground: '#839496',
selectForeground: '#FFFFFF',
accent: '#d33682',
highlight: '#11353F',
border: '#0D3640',
primary: '#586e75',
contrast: '#00252E',
varColor: '#268BD2',
stringColor: '#2AA198',
keywordColor: '#859900',
numberColor: '#D33682',
operatorColor: '#93A1A1',
linkColor: '#268BD2',
textColor: '#839496',
tagNameColor: '#268BD2',
functionColor: '#B58900',
attributeNameColor: '#B58900',
commentColor: '#657B83'
}),
'Solarized Light': createLightTheme({
background: '#fdf6e3',
foreground: '#586e75',
selectForeground: '#002b36',
accent: '#d33682',
highlight: '#F6F0DE',
border: '#edead9',
primary: '#93a1a1',
contrast: '#eee8d5',
varColor: '#268BD2',
stringColor: '#2AA198',
keywordColor: '#859900',
numberColor: '#D33682',
operatorColor: '#657B83',
linkColor: '#268BD2',
textColor: '#586e75',
tagNameColor: '#268BD2',
functionColor: '#B58900',
attributeNameColor: '#657B83',
commentColor: '#93A1A1'
}),
Github: createLightTheme({
background: '#F7F8FA',
foreground: '#5B6168',
selectForeground: '#FFFFFF',
accent: '#79CB60',
highlight: '#CCE5FF',
border: '#DFE1E4',
primary: '#292D31',
contrast: '#FFFFFF',
varColor: '#24292E',
stringColor: '#032F62',
keywordColor: '#D73A49',
numberColor: '#005CC5',
operatorColor: '#D73A49',
linkColor: '#005CC5',
textColor: '#5B6168',
tagNameColor: '#22863A',
functionColor: '#6F42C1',
attributeNameColor: '#6F42C1',
commentColor: '#6A737D'
}),
'Night Owl': createDarkTheme({
background: '#011627',
foreground: '#b0bec5',
selectForeground: '#ffffff',
accent: '#7e57c2',
highlight: '#152C3B',
border: '#2a373e',
primary: '#607d8b',
contrast: '#001424',
varColor: '#addb67',
stringColor: '#ecc48d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#c792ea',
linkColor: '#80CBC4',
textColor: '#b0bec5',
tagNameColor: '#7fdbca',
functionColor: '#82AAFF',
attributeNameColor: '#FAD430',
commentColor: '#637777'
}),
'Light Owl': createLightTheme({
background: '#FAFAFA',
foreground: '#546e7a',
selectForeground: '#403f53',
accent: '#269386',
highlight: '#E0E7EA',
border: '#efefef',
primary: '#403F53',
contrast: '#FAFAFA',
varColor: '#0C969B',
stringColor: '#c96765',
keywordColor: '#994cc3',
numberColor: '#aa0982',
operatorColor: '#7d818b',
linkColor: '#994cc3',
textColor: '#546e7a',
tagNameColor: '#994cc3',
functionColor: '#4876d6',
attributeNameColor: '#4876d6',
commentColor: '#637777'
})
}

1
src/Console/Console.scss
View File

@@ -61,6 +61,7 @@
bottom: 0;
width: 100%;
background: var(--darker-background);
border-top: 1px solid var(--border);
height: 40px;
.buttons {
display: none;

2
src/Console/Logger.scss
View File

@@ -129,7 +129,7 @@
}
th,
td {
border: 1px solid var(--active);
border: 1px solid var(--border);
padding: 3px $padding;
}
tr:nth-child(even) {

2
src/DevTools/NavBar.scss
View File

@@ -25,7 +25,7 @@ $item-width: 69px;
text-transform: capitalize;
transition: all $anim-duration;
&:active {
background: var(--active);
background: var(--highlight);
color: var(--select-foreground);
}
&.active {

2
src/Elements/Elements.scss
View File

@@ -203,7 +203,7 @@
padding: 5px 10px;
&.key {
white-space: nowrap;
color: var(--css-property);
color: var(--var-color);
}
}
}

6
src/Elements/Highlight.js
View File

@@ -110,9 +110,9 @@ export default class Highlight {
function formatElName(el) {
const { id, className } = el
let ret = `<span class="eruda-tag-name-color">${el.tagName.toLowerCase()}</span>`
let ret = `<span style="color:#881280;">${el.tagName.toLowerCase()}</span>`
if (id !== '') ret += `<span class="eruda-function-color">#${id}</span>`
if (id !== '') ret += `<span style="color:1a1aa8;">#${id}</span>`
let classes = ''
if (isStr(className)) {
@@ -123,7 +123,7 @@ function formatElName(el) {
})
}
ret += `<span class="eruda-attribute-name-color">${classes}</span>`
ret += `<span style="color:1a1aa8;">${classes}</span>`
return ret
}

6
src/Elements/Highlight.scss
View File

@@ -46,8 +46,8 @@
position: absolute;
top: 0;
left: 0;
background: #333740;
color: #d9d9d9;
background: #fff;
color: #222;
font-size: $font-size-s;
height: 25px;
line-height: 25px;
@@ -55,5 +55,7 @@
padding: 0 5px;
white-space: nowrap;
overflow-x: hidden;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05), 0 1px 4px 0 rgba(0, 0, 0, 0.08),
0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
}

368
src/lib/util.js
View File

@@ -3764,29 +3764,37 @@ export var evalCss = _.evalCss = (function (exports) {
let scale = 1
function createDarkTheme(theme) {
return extend(theme, {
consoleWarnBackground: '#332a00',
consoleWarnForeground: '#ffcb6b',
consoleWarnBorder: '#650',
consoleErrorBackground: '#290000',
consoleErrorForeground: '#ff8080',
consoleErrorBorder: '#5c0000',
light: '#ccc',
dark: '#aaa'
})
if (!theme.darkerBackground) theme.darkerBackground = theme.contrast
return extend(
{
consoleWarnBackground: '#332a00',
consoleWarnForeground: '#ffcb6b',
consoleWarnBorder: '#650',
consoleErrorBackground: '#290000',
consoleErrorForeground: '#ff8080',
consoleErrorBorder: '#5c0000',
light: '#ccc',
dark: '#aaa'
},
theme
)
}
function createLightTheme(theme) {
return extend(theme, {
consoleWarnBackground: '#fffbe5',
consoleWarnForeground: '#5c5c00',
consoleWarnBorder: '#fff5c2',
consoleErrorBackground: '#fff0f0',
consoleErrorForeground: '#f00',
consoleErrorBorder: '#ffd6d6',
light: '#fff',
dark: '#eee'
})
if (!theme.darkerBackground) theme.darkerBackground = theme.contrast
return extend(
{
consoleWarnBackground: '#fffbe5',
consoleWarnForeground: '#5c5c00',
consoleWarnBorder: '#fff5c2',
consoleErrorBackground: '#fff0f0',
consoleErrorForeground: '#f00',
consoleErrorBorder: '#ffd6d6',
light: '#fff',
dark: '#eee'
},
theme
)
}
const themes = {
@@ -3797,7 +3805,6 @@ export var evalCss = _.evalCss = (function (exports) {
selectForeground: '#333',
accent: '#1a73e8',
highlight: '#eaeaea',
active: '#aaa',
border: '#ccc',
primary: '#333',
contrast: '#f2f7fd',
@@ -3821,7 +3828,6 @@ export var evalCss = _.evalCss = (function (exports) {
selectForeground: '#eaeaea',
accent: '#555',
highlight: '#000',
active: '#555',
border: '#3d3d3d',
primary: '#ccc',
contrast: '#0b2544',
@@ -3835,32 +3841,322 @@ export var evalCss = _.evalCss = (function (exports) {
tagNameColor: '#5db0d7',
functionColor: '#d5d5d5',
attributeNameColor: '#9bbbdc',
commentColor: '#747474',
cssProperty: '#35d4c7'
commentColor: '#747474'
}),
'Material Oceanic': createDarkTheme({
darkerBackground: '#212c31',
background: '#263238',
foreground: '#b0b1c5',
selectForeground: '#fff',
foreground: '#B0BEC5',
selectForeground: '#FFFFFF',
accent: '#009688',
highlight: '#425b67',
active: '#314549',
border: '#2a373e',
primary: '#607d8b',
contrast: '#1e272c',
varColor: '#eff',
highlight: '#425B67',
border: '#2A373E',
primary: '#607D8B',
contrast: '#1E272C',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#c3cee3',
textColor: '#B0BEC5',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#546e7a',
cssProperty: '#35d4c7'
commentColor: '#546e7a'
}),
'Material Darker': createDarkTheme({
background: '#212121',
foreground: '#B0BEC5',
selectForeground: '#FFFFFF',
accent: '#FF9800',
highlight: '#3F3F3F',
border: '#292929',
primary: '#727272',
contrast: '#1A1A1A',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#B0BEC5',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#616161'
}),
'Material Lighter': createLightTheme({
background: '#FAFAFA',
foreground: '#546E7A',
selectForeground: '#546e7a',
accent: '#00BCD4',
highlight: '#E7E7E8',
border: '#d3e1e8',
primary: '#94A7B0',
contrast: '#F4F4F4',
varColor: '#272727',
stringColor: '#91B859',
keywordColor: '#7C4DFF',
numberColor: '#F76D47',
operatorColor: '#39ADB5',
linkColor: '#39ADB5',
textColor: '#546E7A',
tagNameColor: '#E53935',
functionColor: '#6182B8',
attributeNameColor: '#F6A434',
commentColor: '#AABFC9'
}),
'Material Palenight': createDarkTheme({
background: '#292D3E',
foreground: '#A6ACCD',
selectForeground: '#FFFFFF',
accent: '#ab47bc',
highlight: '#444267',
border: '#2b2a3e',
primary: '#676E95',
contrast: '#202331',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#A6ACCD',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#676E95'
}),
'Material Deep Ocean': createDarkTheme({
background: '#0F111A',
foreground: '#8F93A2',
selectForeground: '#FFFFFF',
accent: '#84ffff',
highlight: '#1F2233',
border: '#0F111A',
primary: '#4B526D',
contrast: '#090B10',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#8F93A2',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#717CB4'
}),
'Monokai Pro': createDarkTheme({
background: '#2D2A2E',
foreground: '#fcfcfa',
selectForeground: '#FFFFFF',
accent: '#ffd866',
highlight: '#5b595c',
border: '#2d2a2e',
primary: '#939293',
contrast: '#221F22',
varColor: '#FCFCFA',
stringColor: '#FFD866',
keywordColor: '#FF6188',
numberColor: '#AB9DF2',
operatorColor: '#FF6188',
linkColor: '#78DCE8',
textColor: '#fcfcfa',
tagNameColor: '#FF6188',
functionColor: '#A9DC76',
attributeNameColor: '#78DCE8',
commentColor: '#727072'
}),
Dracula: createDarkTheme({
background: '#282A36',
foreground: '#F8F8F2',
selectForeground: '#8BE9FD',
accent: '#FF79C5',
highlight: '#6272A4',
border: '#21222C',
primary: '#6272A4',
contrast: '#191A21',
varColor: '#F8F8F2',
stringColor: '#F1FA8C',
keywordColor: '#FF79C6',
numberColor: '#BD93F9',
operatorColor: '#FF79C6',
linkColor: '#F1FA8C',
textColor: '#F8F8F2',
tagNameColor: '#FF79C6',
functionColor: '#50FA78',
attributeNameColor: '#50FA7B',
commentColor: '#6272A4'
}),
'Arc Dark': createDarkTheme({
background: '#2f343f',
foreground: '#D3DAE3',
selectForeground: '#FFFFFF',
accent: '#42A5F5',
highlight: '#3F3F46',
border: '#404552',
primary: '#8b9eb5',
contrast: '#262b33',
varColor: '#CF6A4C',
stringColor: '#8F9D6A',
keywordColor: '#9B859D',
numberColor: '#CDA869',
operatorColor: '#A7A7A7',
linkColor: '#7587A6',
textColor: '#D3DAE3',
tagNameColor: '#CF6A4C',
functionColor: '#7587A6',
attributeNameColor: '#F9EE98',
commentColor: '#747C84'
}),
'Atom One Dark': createDarkTheme({
background: '#282C34',
foreground: '#979FAD',
selectForeground: '#FFFFFF',
accent: '#2979ff',
highlight: '#383D48',
border: '#282C34',
primary: '#979FAD',
contrast: '#21252B',
varColor: '#D19A66',
stringColor: '#98C379',
keywordColor: '#C679DD',
numberColor: '#D19A66',
operatorColor: '#61AFEF',
linkColor: '#56B6C2',
textColor: '#979FAD',
tagNameColor: '#F07178',
functionColor: '#61AEEF',
attributeNameColor: '#E5C17C',
commentColor: '#59626F'
}),
'Atom One Light': createLightTheme({
background: '#FAFAFA',
foreground: '#232324',
selectForeground: '#232324',
accent: '#2979ff',
highlight: '#EAEAEB',
border: '#DBDBDC',
primary: '#9D9D9F',
contrast: '#FFFFFF',
varColor: '#986801',
stringColor: '#50A14E',
keywordColor: '#A626A4',
numberColor: '#986801',
operatorColor: '#4078F2',
linkColor: '#0184BC',
textColor: '#232324',
tagNameColor: '#E4564A',
functionColor: '#4078F2',
attributeNameColor: '#C18401',
commentColor: '#A0A1A7'
}),
'Solarized Dark': createDarkTheme({
background: '#002B36',
foreground: '#839496',
selectForeground: '#FFFFFF',
accent: '#d33682',
highlight: '#11353F',
border: '#0D3640',
primary: '#586e75',
contrast: '#00252E',
varColor: '#268BD2',
stringColor: '#2AA198',
keywordColor: '#859900',
numberColor: '#D33682',
operatorColor: '#93A1A1',
linkColor: '#268BD2',
textColor: '#839496',
tagNameColor: '#268BD2',
functionColor: '#B58900',
attributeNameColor: '#B58900',
commentColor: '#657B83'
}),
'Solarized Light': createLightTheme({
background: '#fdf6e3',
foreground: '#586e75',
selectForeground: '#002b36',
accent: '#d33682',
highlight: '#F6F0DE',
border: '#edead9',
primary: '#93a1a1',
contrast: '#eee8d5',
varColor: '#268BD2',
stringColor: '#2AA198',
keywordColor: '#859900',
numberColor: '#D33682',
operatorColor: '#657B83',
linkColor: '#268BD2',
textColor: '#586e75',
tagNameColor: '#268BD2',
functionColor: '#B58900',
attributeNameColor: '#657B83',
commentColor: '#93A1A1'
}),
Github: createLightTheme({
background: '#F7F8FA',
foreground: '#5B6168',
selectForeground: '#FFFFFF',
accent: '#79CB60',
highlight: '#CCE5FF',
border: '#DFE1E4',
primary: '#292D31',
contrast: '#FFFFFF',
varColor: '#24292E',
stringColor: '#032F62',
keywordColor: '#D73A49',
numberColor: '#005CC5',
operatorColor: '#D73A49',
linkColor: '#005CC5',
textColor: '#5B6168',
tagNameColor: '#22863A',
functionColor: '#6F42C1',
attributeNameColor: '#6F42C1',
commentColor: '#6A737D'
}),
'Night Owl': createDarkTheme({
background: '#011627',
foreground: '#b0bec5',
selectForeground: '#ffffff',
accent: '#7e57c2',
highlight: '#152C3B',
border: '#2a373e',
primary: '#607d8b',
contrast: '#001424',
varColor: '#addb67',
stringColor: '#ecc48d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#c792ea',
linkColor: '#80CBC4',
textColor: '#b0bec5',
tagNameColor: '#7fdbca',
functionColor: '#82AAFF',
attributeNameColor: '#FAD430',
commentColor: '#637777'
}),
'Light Owl': createLightTheme({
background: '#FAFAFA',
foreground: '#546e7a',
selectForeground: '#403f53',
accent: '#269386',
highlight: '#E0E7EA',
border: '#efefef',
primary: '#403F53',
contrast: '#FAFAFA',
varColor: '#0C969B',
stringColor: '#c96765',
keywordColor: '#994cc3',
numberColor: '#aa0982',
operatorColor: '#7d818b',
linkColor: '#994cc3',
textColor: '#546e7a',
tagNameColor: '#994cc3',
functionColor: '#4876d6',
attributeNameColor: '#4876d6',
commentColor: '#637777'
})
}

368
test/util.js
View File

@@ -2118,29 +2118,37 @@
let scale = 1
function createDarkTheme(theme) {
return extend(theme, {
consoleWarnBackground: '#332a00',
consoleWarnForeground: '#ffcb6b',
consoleWarnBorder: '#650',
consoleErrorBackground: '#290000',
consoleErrorForeground: '#ff8080',
consoleErrorBorder: '#5c0000',
light: '#ccc',
dark: '#aaa'
})
if (!theme.darkerBackground) theme.darkerBackground = theme.contrast
return extend(
{
consoleWarnBackground: '#332a00',
consoleWarnForeground: '#ffcb6b',
consoleWarnBorder: '#650',
consoleErrorBackground: '#290000',
consoleErrorForeground: '#ff8080',
consoleErrorBorder: '#5c0000',
light: '#ccc',
dark: '#aaa'
},
theme
)
}
function createLightTheme(theme) {
return extend(theme, {
consoleWarnBackground: '#fffbe5',
consoleWarnForeground: '#5c5c00',
consoleWarnBorder: '#fff5c2',
consoleErrorBackground: '#fff0f0',
consoleErrorForeground: '#f00',
consoleErrorBorder: '#ffd6d6',
light: '#fff',
dark: '#eee'
})
if (!theme.darkerBackground) theme.darkerBackground = theme.contrast
return extend(
{
consoleWarnBackground: '#fffbe5',
consoleWarnForeground: '#5c5c00',
consoleWarnBorder: '#fff5c2',
consoleErrorBackground: '#fff0f0',
consoleErrorForeground: '#f00',
consoleErrorBorder: '#ffd6d6',
light: '#fff',
dark: '#eee'
},
theme
)
}
const themes = {
@@ -2151,7 +2159,6 @@
selectForeground: '#333',
accent: '#1a73e8',
highlight: '#eaeaea',
active: '#aaa',
border: '#ccc',
primary: '#333',
contrast: '#f2f7fd',
@@ -2175,7 +2182,6 @@
selectForeground: '#eaeaea',
accent: '#555',
highlight: '#000',
active: '#555',
border: '#3d3d3d',
primary: '#ccc',
contrast: '#0b2544',
@@ -2189,32 +2195,322 @@
tagNameColor: '#5db0d7',
functionColor: '#d5d5d5',
attributeNameColor: '#9bbbdc',
commentColor: '#747474',
cssProperty: '#35d4c7'
commentColor: '#747474'
}),
'Material Oceanic': createDarkTheme({
darkerBackground: '#212c31',
background: '#263238',
foreground: '#b0b1c5',
selectForeground: '#fff',
foreground: '#B0BEC5',
selectForeground: '#FFFFFF',
accent: '#009688',
highlight: '#425b67',
active: '#314549',
border: '#2a373e',
primary: '#607d8b',
contrast: '#1e272c',
varColor: '#eff',
highlight: '#425B67',
border: '#2A373E',
primary: '#607D8B',
contrast: '#1E272C',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#c3cee3',
textColor: '#B0BEC5',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#546e7a',
cssProperty: '#35d4c7'
commentColor: '#546e7a'
}),
'Material Darker': createDarkTheme({
background: '#212121',
foreground: '#B0BEC5',
selectForeground: '#FFFFFF',
accent: '#FF9800',
highlight: '#3F3F3F',
border: '#292929',
primary: '#727272',
contrast: '#1A1A1A',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#B0BEC5',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#616161'
}),
'Material Lighter': createLightTheme({
background: '#FAFAFA',
foreground: '#546E7A',
selectForeground: '#546e7a',
accent: '#00BCD4',
highlight: '#E7E7E8',
border: '#d3e1e8',
primary: '#94A7B0',
contrast: '#F4F4F4',
varColor: '#272727',
stringColor: '#91B859',
keywordColor: '#7C4DFF',
numberColor: '#F76D47',
operatorColor: '#39ADB5',
linkColor: '#39ADB5',
textColor: '#546E7A',
tagNameColor: '#E53935',
functionColor: '#6182B8',
attributeNameColor: '#F6A434',
commentColor: '#AABFC9'
}),
'Material Palenight': createDarkTheme({
background: '#292D3E',
foreground: '#A6ACCD',
selectForeground: '#FFFFFF',
accent: '#ab47bc',
highlight: '#444267',
border: '#2b2a3e',
primary: '#676E95',
contrast: '#202331',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#A6ACCD',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#676E95'
}),
'Material Deep Ocean': createDarkTheme({
background: '#0F111A',
foreground: '#8F93A2',
selectForeground: '#FFFFFF',
accent: '#84ffff',
highlight: '#1F2233',
border: '#0F111A',
primary: '#4B526D',
contrast: '#090B10',
varColor: '#eeffff',
stringColor: '#c3e88d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#89ddff',
linkColor: '#80cbc4',
textColor: '#8F93A2',
tagNameColor: '#f07178',
functionColor: '#82aaff',
attributeNameColor: '#ffcb6b',
commentColor: '#717CB4'
}),
'Monokai Pro': createDarkTheme({
background: '#2D2A2E',
foreground: '#fcfcfa',
selectForeground: '#FFFFFF',
accent: '#ffd866',
highlight: '#5b595c',
border: '#2d2a2e',
primary: '#939293',
contrast: '#221F22',
varColor: '#FCFCFA',
stringColor: '#FFD866',
keywordColor: '#FF6188',
numberColor: '#AB9DF2',
operatorColor: '#FF6188',
linkColor: '#78DCE8',
textColor: '#fcfcfa',
tagNameColor: '#FF6188',
functionColor: '#A9DC76',
attributeNameColor: '#78DCE8',
commentColor: '#727072'
}),
Dracula: createDarkTheme({
background: '#282A36',
foreground: '#F8F8F2',
selectForeground: '#8BE9FD',
accent: '#FF79C5',
highlight: '#6272A4',
border: '#21222C',
primary: '#6272A4',
contrast: '#191A21',
varColor: '#F8F8F2',
stringColor: '#F1FA8C',
keywordColor: '#FF79C6',
numberColor: '#BD93F9',
operatorColor: '#FF79C6',
linkColor: '#F1FA8C',
textColor: '#F8F8F2',
tagNameColor: '#FF79C6',
functionColor: '#50FA78',
attributeNameColor: '#50FA7B',
commentColor: '#6272A4'
}),
'Arc Dark': createDarkTheme({
background: '#2f343f',
foreground: '#D3DAE3',
selectForeground: '#FFFFFF',
accent: '#42A5F5',
highlight: '#3F3F46',
border: '#404552',
primary: '#8b9eb5',
contrast: '#262b33',
varColor: '#CF6A4C',
stringColor: '#8F9D6A',
keywordColor: '#9B859D',
numberColor: '#CDA869',
operatorColor: '#A7A7A7',
linkColor: '#7587A6',
textColor: '#D3DAE3',
tagNameColor: '#CF6A4C',
functionColor: '#7587A6',
attributeNameColor: '#F9EE98',
commentColor: '#747C84'
}),
'Atom One Dark': createDarkTheme({
background: '#282C34',
foreground: '#979FAD',
selectForeground: '#FFFFFF',
accent: '#2979ff',
highlight: '#383D48',
border: '#282C34',
primary: '#979FAD',
contrast: '#21252B',
varColor: '#D19A66',
stringColor: '#98C379',
keywordColor: '#C679DD',
numberColor: '#D19A66',
operatorColor: '#61AFEF',
linkColor: '#56B6C2',
textColor: '#979FAD',
tagNameColor: '#F07178',
functionColor: '#61AEEF',
attributeNameColor: '#E5C17C',
commentColor: '#59626F'
}),
'Atom One Light': createLightTheme({
background: '#FAFAFA',
foreground: '#232324',
selectForeground: '#232324',
accent: '#2979ff',
highlight: '#EAEAEB',
border: '#DBDBDC',
primary: '#9D9D9F',
contrast: '#FFFFFF',
varColor: '#986801',
stringColor: '#50A14E',
keywordColor: '#A626A4',
numberColor: '#986801',
operatorColor: '#4078F2',
linkColor: '#0184BC',
textColor: '#232324',
tagNameColor: '#E4564A',
functionColor: '#4078F2',
attributeNameColor: '#C18401',
commentColor: '#A0A1A7'
}),
'Solarized Dark': createDarkTheme({
background: '#002B36',
foreground: '#839496',
selectForeground: '#FFFFFF',
accent: '#d33682',
highlight: '#11353F',
border: '#0D3640',
primary: '#586e75',
contrast: '#00252E',
varColor: '#268BD2',
stringColor: '#2AA198',
keywordColor: '#859900',
numberColor: '#D33682',
operatorColor: '#93A1A1',
linkColor: '#268BD2',
textColor: '#839496',
tagNameColor: '#268BD2',
functionColor: '#B58900',
attributeNameColor: '#B58900',
commentColor: '#657B83'
}),
'Solarized Light': createLightTheme({
background: '#fdf6e3',
foreground: '#586e75',
selectForeground: '#002b36',
accent: '#d33682',
highlight: '#F6F0DE',
border: '#edead9',
primary: '#93a1a1',
contrast: '#eee8d5',
varColor: '#268BD2',
stringColor: '#2AA198',
keywordColor: '#859900',
numberColor: '#D33682',
operatorColor: '#657B83',
linkColor: '#268BD2',
textColor: '#586e75',
tagNameColor: '#268BD2',
functionColor: '#B58900',
attributeNameColor: '#657B83',
commentColor: '#93A1A1'
}),
Github: createLightTheme({
background: '#F7F8FA',
foreground: '#5B6168',
selectForeground: '#FFFFFF',
accent: '#79CB60',
highlight: '#CCE5FF',
border: '#DFE1E4',
primary: '#292D31',
contrast: '#FFFFFF',
varColor: '#24292E',
stringColor: '#032F62',
keywordColor: '#D73A49',
numberColor: '#005CC5',
operatorColor: '#D73A49',
linkColor: '#005CC5',
textColor: '#5B6168',
tagNameColor: '#22863A',
functionColor: '#6F42C1',
attributeNameColor: '#6F42C1',
commentColor: '#6A737D'
}),
'Night Owl': createDarkTheme({
background: '#011627',
foreground: '#b0bec5',
selectForeground: '#ffffff',
accent: '#7e57c2',
highlight: '#152C3B',
border: '#2a373e',
primary: '#607d8b',
contrast: '#001424',
varColor: '#addb67',
stringColor: '#ecc48d',
keywordColor: '#c792ea',
numberColor: '#f78c6c',
operatorColor: '#c792ea',
linkColor: '#80CBC4',
textColor: '#b0bec5',
tagNameColor: '#7fdbca',
functionColor: '#82AAFF',
attributeNameColor: '#FAD430',
commentColor: '#637777'
}),
'Light Owl': createLightTheme({
background: '#FAFAFA',
foreground: '#546e7a',
selectForeground: '#403f53',
accent: '#269386',
highlight: '#E0E7EA',
border: '#efefef',
primary: '#403F53',
contrast: '#FAFAFA',
varColor: '#0C969B',
stringColor: '#c96765',
keywordColor: '#994cc3',
numberColor: '#aa0982',
operatorColor: '#7d818b',
linkColor: '#994cc3',
textColor: '#546e7a',
tagNameColor: '#994cc3',
functionColor: '#4876d6',
attributeNameColor: '#4876d6',
commentColor: '#637777'
})
}