mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-30 21:16:23 +00:00
WIP for keith
This commit is contained in:
Nate Butler
Keith Simmons
parent
ae8b610d85
commit
083c1f7c0e
1 changed files with 451 additions and 433 deletions
884
styles/dark.ts
884
styles/dark.ts
|
|
@ -1,438 +1,456 @@
|
|||
import core from "./core";
|
||||
import Theme from "./theme";
|
||||
|
||||
const backgroundColor = {
|
||||
100: {
|
||||
base: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
hovered: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
active: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
focused: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
300: {
|
||||
base: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
hovered: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
active: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
focused: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
500: {
|
||||
base: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
ok: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
error: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
warning: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
info: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const borderColor = {
|
||||
primary: {
|
||||
value: "#000000",
|
||||
},
|
||||
secondary: {
|
||||
value: "#000000",
|
||||
},
|
||||
muted: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
ok: {
|
||||
value: "#000000",
|
||||
},
|
||||
error: {
|
||||
value: "#000000",
|
||||
},
|
||||
warning: {
|
||||
value: "#000000",
|
||||
},
|
||||
info: {
|
||||
value: "#000000",
|
||||
},
|
||||
};
|
||||
|
||||
const textColor = {
|
||||
primary: {
|
||||
value: core.color.neutral[150].value,
|
||||
},
|
||||
secondary: {
|
||||
value: core.color.neutral[350].value,
|
||||
},
|
||||
muted: {
|
||||
value: core.color.neutral[550].value,
|
||||
},
|
||||
placeholder: {
|
||||
value: core.color.neutral[750].value,
|
||||
},
|
||||
active: {
|
||||
value: core.color.neutral[0].value,
|
||||
},
|
||||
feature: {
|
||||
//TODO: (design) define feature and it's correct value
|
||||
value: core.color.sky[500].value,
|
||||
},
|
||||
ok: {
|
||||
value: core.color.green[600].value,
|
||||
},
|
||||
error: {
|
||||
value: core.color.red[400].value,
|
||||
},
|
||||
warning: {
|
||||
value: core.color.amber[300].value,
|
||||
},
|
||||
info: {
|
||||
value: core.color.blue[500].value,
|
||||
},
|
||||
};
|
||||
|
||||
const iconColor = {
|
||||
primary: {
|
||||
value: core.color.neutral[300].value,
|
||||
},
|
||||
secondary: {
|
||||
value: core.color.neutral[500].value,
|
||||
},
|
||||
muted: {
|
||||
value: core.color.neutral[600].value,
|
||||
},
|
||||
placeholder: {
|
||||
value: core.color.neutral[700].value,
|
||||
},
|
||||
active: {
|
||||
value: core.color.neutral[50].value,
|
||||
},
|
||||
feature: {
|
||||
//TODO: (design) define feature and it's correct value
|
||||
value: core.color.sky[500].value,
|
||||
},
|
||||
ok: {
|
||||
value: core.color.green[600].value,
|
||||
},
|
||||
error: {
|
||||
value: core.color.red[400].value,
|
||||
},
|
||||
warning: {
|
||||
value: core.color.amber[300].value,
|
||||
},
|
||||
info: {
|
||||
value: core.color.blue[500].value,
|
||||
},
|
||||
};
|
||||
|
||||
const editor = {
|
||||
background: {
|
||||
value: backgroundColor[500].base.value,
|
||||
},
|
||||
indent_guide: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
indent_guide_active: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
line: {
|
||||
active: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
highlighted: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
inserted: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
deleted: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
modified: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
highlight: {
|
||||
selection: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
occurrence: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
activeOccurrence: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
matchingBracket: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
match: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
activeMatch: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
related: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
gutter: {
|
||||
primary: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
active: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const syntax = {
|
||||
primary: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
comment: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
punctuation: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
constant: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
keyword: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
function: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
type: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
variant: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
property: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
enum: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
operator: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
string: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
number: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
boolean: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
predictive: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
};
|
||||
|
||||
const player = {
|
||||
1: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
2: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
3: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
4: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
5: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
6: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
7: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
8: {
|
||||
baseColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
cursorColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
selectionColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
borderColor: {
|
||||
value: core.color.neutral[999].value,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const shadowAlpha = {
|
||||
value: 0.32,
|
||||
};
|
||||
|
||||
export default function dark(): Theme {
|
||||
return {
|
||||
backgroundColor: {
|
||||
100: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
300: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
500: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
ok: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
error: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
warning: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
info: {
|
||||
base: {
|
||||
value: "#000000",
|
||||
},
|
||||
hovered: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
},
|
||||
borderColor: {
|
||||
primary: {
|
||||
value: "#000000",
|
||||
},
|
||||
secondary: {
|
||||
value: "#000000",
|
||||
},
|
||||
muted: {
|
||||
value: "#000000",
|
||||
},
|
||||
focused: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
ok: {
|
||||
value: "#000000",
|
||||
},
|
||||
error: {
|
||||
value: "#000000",
|
||||
},
|
||||
warning: {
|
||||
value: "#000000",
|
||||
},
|
||||
info: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
textColor: {
|
||||
primary: {
|
||||
value: "#000000",
|
||||
},
|
||||
secondary: {
|
||||
value: "#000000",
|
||||
},
|
||||
muted: {
|
||||
value: "#000000",
|
||||
},
|
||||
placeholder: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
feature: {
|
||||
value: "#000000",
|
||||
},
|
||||
ok: {
|
||||
value: "#000000",
|
||||
},
|
||||
error: {
|
||||
value: "#000000",
|
||||
},
|
||||
warning: {
|
||||
value: "#000000",
|
||||
},
|
||||
info: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
iconColor: {
|
||||
primary: {
|
||||
value: "#000000",
|
||||
},
|
||||
secondary: {
|
||||
value: "#000000",
|
||||
},
|
||||
muted: {
|
||||
value: "#000000",
|
||||
},
|
||||
placeholder: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
feature: {
|
||||
value: "#000000",
|
||||
},
|
||||
ok: {
|
||||
value: "#000000",
|
||||
},
|
||||
error: {
|
||||
value: "#000000",
|
||||
},
|
||||
warning: {
|
||||
value: "#000000",
|
||||
},
|
||||
info: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
editor: {
|
||||
background: {
|
||||
value: "#000000",
|
||||
},
|
||||
indent_guide: {
|
||||
value: "#000000",
|
||||
},
|
||||
indent_guide_active: {
|
||||
value: "#000000",
|
||||
},
|
||||
line: {
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
highlighted: {
|
||||
value: "#000000",
|
||||
},
|
||||
inserted: {
|
||||
value: "#000000",
|
||||
},
|
||||
deleted: {
|
||||
value: "#000000",
|
||||
},
|
||||
modified: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
highlight: {
|
||||
selection: {
|
||||
value: "#000000",
|
||||
},
|
||||
occurrence: {
|
||||
value: "#000000",
|
||||
},
|
||||
activeOccurrence: {
|
||||
value: "#000000",
|
||||
},
|
||||
matchingBracket: {
|
||||
value: "#000000",
|
||||
},
|
||||
match: {
|
||||
value: "#000000",
|
||||
},
|
||||
activeMatch: {
|
||||
value: "#000000",
|
||||
},
|
||||
related: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
gutter: {
|
||||
primary: {
|
||||
value: "#000000",
|
||||
},
|
||||
active: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
syntax: {
|
||||
primary: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
comment: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
punctuation: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
constant: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
keyword: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
function: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
type: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
variant: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
property: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
enum: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
operator: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
string: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
number: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
boolean: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
predictive: {
|
||||
color: { value: "000000" },
|
||||
weight: { value: "normal" },
|
||||
},
|
||||
},
|
||||
player: {
|
||||
1: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
2: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
3: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
4: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
5: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
6: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
7: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
8: {
|
||||
baseColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
cursorColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
selectionColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
borderColor: {
|
||||
value: "#000000",
|
||||
},
|
||||
},
|
||||
},
|
||||
shadowAlpha: {
|
||||
value: 0.32,
|
||||
},
|
||||
backgroundColor,
|
||||
borderColor,
|
||||
textColor,
|
||||
iconColor,
|
||||
editor,
|
||||
syntax,
|
||||
player,
|
||||
shadowAlpha,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue