/
index.ts
124 lines (121 loc) · 3.5 KB
/
index.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
import { tags as t } from '@lezer/highlight';
import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
export const defaultSettingsNord: CreateThemeOptions['settings'] = {
background: '#2e3440',
foreground: '#FFFFFF',
caret: '#FFFFFF',
selection: '#00000073',
selectionMatch: '#00000073',
gutterBackground: '#2e3440',
gutterForeground: '#4c566a',
gutterActiveForeground: '#d8dee9',
lineHighlight: '#4c566a29',
};
// Colors from https://www.nordtheme.com/docs/colors-and-palettes
export const nordInit = (options?: Partial<CreateThemeOptions>) => {
const { theme = 'dark', settings = {}, styles = [] } = options || {};
return createTheme({
theme: theme,
settings: {
...defaultSettingsNord,
...settings,
},
styles: [
{ tag: t.keyword, color: '#5e81ac' },
{
tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
color: '#88c0d0',
},
{ tag: [t.variableName], color: '#8fbcbb' },
{ tag: [t.function(t.variableName)], color: '#8fbcbb' },
{ tag: [t.labelName], color: '#81a1c1' },
{
tag: [t.color, t.constant(t.name), t.standard(t.name)],
color: '#5e81ac',
},
{ tag: [t.definition(t.name), t.separator], color: '#a3be8c' },
{ tag: [t.brace], color: '#8fbcbb' },
{
tag: [t.annotation],
color: '#d30102',
},
{
tag: [t.number, t.changed, t.annotation, t.modifier, t.self, t.namespace],
color: '#b48ead',
},
{
tag: [t.typeName, t.className],
color: '#ebcb8b',
},
{
tag: [t.operator, t.operatorKeyword],
color: '#a3be8c',
},
{
tag: [t.tagName],
color: '#b48ead',
},
{
tag: [t.squareBracket],
color: '#bf616a',
},
{
tag: [t.angleBracket],
color: '#d08770',
},
{
tag: [t.attributeName],
color: '#ebcb8b',
},
{
tag: [t.regexp],
color: '#5e81ac',
},
{
tag: [t.quote],
color: '#b48ead',
},
{ tag: [t.string], color: '#a3be8c' },
{
tag: t.link,
color: '#a3be8c',
textDecoration: 'underline',
textUnderlinePosition: 'under',
},
{
tag: [t.url, t.escape, t.special(t.string)],
color: '#8fbcbb',
},
{ tag: [t.meta], color: '#88c0d0' },
{ tag: [t.monospace], color: '#d8dee9', fontStyle: 'italic' },
{ tag: [t.comment], color: '#4c566a', fontStyle: 'italic' },
{ tag: t.strong, fontWeight: 'bold', color: '#5e81ac' },
{ tag: t.emphasis, fontStyle: 'italic', color: '#5e81ac' },
{ tag: t.strikethrough, textDecoration: 'line-through' },
{ tag: t.heading, fontWeight: 'bold', color: '#5e81ac' },
{ tag: t.special(t.heading1), fontWeight: 'bold', color: '#5e81ac' },
{ tag: t.heading1, fontWeight: 'bold', color: '#5e81ac' },
{
tag: [t.heading2, t.heading3, t.heading4],
fontWeight: 'bold',
color: '#5e81ac',
},
{
tag: [t.heading5, t.heading6],
color: '#5e81ac',
},
{ tag: [t.atom, t.bool, t.special(t.variableName)], color: '#d08770' },
{
tag: [t.processingInstruction, t.inserted],
color: '#8fbcbb',
},
{
tag: [t.contentSeparator],
color: '#ebcb8b',
},
{ tag: t.invalid, color: '#434c5e', borderBottom: `1px dotted #d30102` },
...styles,
],
});
};
export const nord = nordInit();