@fsegurai/codemirror-theme-github-dark 6.1.3 → 6.2.0-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -28
- package/dist/index.cjs +293 -46
- package/dist/index.d.cts +9 -0
- package/dist/index.d.ts +9 -0
- package/dist/index.js +293 -46
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
<p align="center">
|
|
2
|
-
<img alt="CodeMirror 6 Themes Logo" src="https://raw.githubusercontent.com/fsegurai/codemirror-themes/main/
|
|
2
|
+
<img alt="CodeMirror 6 Themes Logo" src="https://raw.githubusercontent.com/fsegurai/codemirror-themes/main/public/codemirror-themes.png">
|
|
3
3
|
</p>
|
|
4
4
|
|
|
5
5
|
<p align="center">
|
|
6
6
|
<a href="https://github.com/fsegurai/codemirror-themes">
|
|
7
|
-
<img src="https://img.shields.io/azure-devops/build/fsegurai/Libraries%2520NodeJs/
|
|
7
|
+
<img src="https://img.shields.io/azure-devops/build/fsegurai/Libraries%2520NodeJs/16/main?label=Build%20Status&"
|
|
8
8
|
alt="Test Status">
|
|
9
9
|
</a>
|
|
10
10
|
<a href="https://www.npmjs.org/package/@fsegurai/codemirror-theme-github-dark">
|
|
@@ -69,32 +69,32 @@ Read the [CodeMirror documentation](https://codemirror.net/6/examples/styling/)
|
|
|
69
69
|
|
|
70
70
|
### Available Themes
|
|
71
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
|
-
|
|
72
|
+
| Theme | Package | Version |
|
|
73
|
+
|-------------------|----------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------|
|
|
74
|
+
| All - Bundle | [@fsegurai/codemirror-theme-bundle](https://www.npmjs.com/package/@fsegurai/codemirror-theme-bundle) |  |
|
|
75
|
+
| Abcdef | [@fsegurai/codemirror-theme-abcdef](https://www.npmjs.com/package/@fsegurai/codemirror-theme-abcdef) |  |
|
|
76
|
+
| Abyss | [@fsegurai/codemirror-theme-abyss](https://www.npmjs.com/package/@fsegurai/codemirror-theme-abyss) |  |
|
|
77
|
+
| Android Studio | [@fsegurai/codemirror-theme-android-studio](https://www.npmjs.com/package/@fsegurai/codemirror-theme-android-studio) |  |
|
|
78
|
+
| Andromeda | [@fsegurai/codemirror-theme-andromeda](https://www.npmjs.com/package/@fsegurai/codemirror-theme-andromeda) |  |
|
|
79
|
+
| Basic Light | [@fsegurai/codemirror-theme-basic-light](https://www.npmjs.com/package/@fsegurai/codemirror-theme-basic-light) |  |
|
|
80
|
+
| Basic Dark | [@fsegurai/codemirror-theme-basic-dark](https://www.npmjs.com/package/@fsegurai/codemirror-theme-basic-dark) |  |
|
|
81
|
+
| Forest | [@fsegurai/codemirror-theme-forest](https://www.npmjs.com/package/@fsegurai/codemirror-theme-forest) |  |
|
|
82
|
+
| GitHub Light | [@fsegurai/codemirror-theme-github-light](https://www.npmjs.com/package/@fsegurai/codemirror-theme-github-light) |  |
|
|
83
|
+
| GitHub Dark | [@fsegurai/codemirror-theme-github-dark](https://www.npmjs.com/package/@fsegurai/codemirror-theme-github-dark) |  |
|
|
84
|
+
| Gruvbox Light | [@fsegurai/codemirror-theme-gruvbox-light](https://www.npmjs.com/package/@fsegurai/codemirror-theme-gruvbox-light) |  |
|
|
85
|
+
| Gruvbox Dark | [@fsegurai/codemirror-theme-gruvbox-dark](https://www.npmjs.com/package/@fsegurai/codemirror-theme-gruvbox-dark) |  |
|
|
86
|
+
| Material Light | [@fsegurai/codemirror-theme-material-light](https://www.npmjs.com/package/@fsegurai/codemirror-theme-material-light) |  |
|
|
87
|
+
| Material Dark | [@fsegurai/codemirror-theme-material-dark](https://www.npmjs.com/package/@fsegurai/codemirror-theme-material-dark) |  |
|
|
88
|
+
| Monokai | [@fsegurai/codemirror-theme-monokai](https://www.npmjs.com/package/@fsegurai/codemirror-theme-monokai) |  |
|
|
89
|
+
| Nord | [@fsegurai/codemirror-theme-nord](https://www.npmjs.com/package/@fsegurai/codemirror-theme-nord) |  |
|
|
90
|
+
| Palenight | [@fsegurai/codemirror-theme-palenight](https://www.npmjs.com/package/@fsegurai/codemirror-theme-palenight) |  |
|
|
91
|
+
| Solarized Light | [@fsegurai/codemirror-theme-solarized-light](https://www.npmjs.com/package/@fsegurai/codemirror-theme-solarized-light) |  |
|
|
92
|
+
| Solarized Dark | [@fsegurai/codemirror-theme-solarized-dark](https://www.npmjs.com/package/@fsegurai/codemirror-theme-solarized-dark) |  |
|
|
93
|
+
| Tokyo Night Storm | [@fsegurai/codemirror-theme-tokyo-night-storm](https://www.npmjs.com/package/@fsegurai/codemirror-theme-tokyo-night-storm) |  |
|
|
94
|
+
| Tokyo Night Day | [@fsegurai/codemirror-theme-tokyo-night-day](https://www.npmjs.com/package/@fsegurai/codemirror-theme-tokyo-night-day) |  |
|
|
95
|
+
| Volcano | [@fsegurai/codemirror-theme-volcano](https://www.npmjs.com/package/@fsegurai/codemirror-theme-volcano) |  |
|
|
96
|
+
| VS Code Dark | [@fsegurai/codemirror-theme-vscode-dark](https://www.npmjs.com/package/@fsegurai/codemirror-theme-vscode-dark) |  |
|
|
97
|
+
| VS Code Light | [@fsegurai/codemirror-theme-vscode-light](https://www.npmjs.com/package/@fsegurai/codemirror-theme-vscode-light) |  |
|
|
98
98
|
|
|
99
99
|
### Demo Application
|
|
100
100
|
|
package/dist/index.cjs
CHANGED
|
@@ -3,90 +3,337 @@
|
|
|
3
3
|
var view = require('@codemirror/view');
|
|
4
4
|
var language = require('@codemirror/language');
|
|
5
5
|
var highlight = require('@lezer/highlight');
|
|
6
|
+
var _utils = require('@utils');
|
|
6
7
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
const
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
8
|
+
/**
|
|
9
|
+
* Enhanced GitHub Dark theme color definitions
|
|
10
|
+
* -------------------------------------------
|
|
11
|
+
* Colors are organized by function with visual color blocks
|
|
12
|
+
*/
|
|
13
|
+
// Core UI colors
|
|
14
|
+
const base00 = '#0d1117'; // Background (GitHub dark mode background)
|
|
15
|
+
const base01 = '#c9d1d9'; // Foreground (main text color)
|
|
16
|
+
const base02 = '#264F78'; // Selection - brighter blue for better visibility
|
|
17
|
+
const base03 = '#8b949e'; // Comment and Bracket color
|
|
18
|
+
const base04 = '#ffffff'; // Caret color (pure white for better visibility)
|
|
19
|
+
// Syntax highlighting colors
|
|
20
|
+
const base05 = '#7ee787'; // TagName, Name, Quote - signature GitHub green
|
|
21
|
+
const base06 = '#d2a8ff'; // ClassName, PropertyName - GitHub purple
|
|
22
|
+
const base07 = '#79c0ff'; // VariableName, Number - GitHub blue
|
|
23
|
+
const base08 = '#ff7b72'; // Keyword, TypeName - GitHub red
|
|
24
|
+
const base09 = '#a5d6ff'; // String, Meta, Regexp - lighter blue
|
|
25
|
+
const base0A = '#2c333a'; // Panel button hover
|
|
26
|
+
const base0B = '#3c444d'; // Deleted background color
|
|
27
|
+
const base0C = '#ffab70'; // Atom, Bool - GitHub orange
|
|
28
|
+
// Background variants
|
|
29
|
+
const base0D = '#161b22'; // Gutter background (slightly darker than the editor)
|
|
30
|
+
const base0E = '#30363d'; // Panel and tooltip border color
|
|
31
|
+
const base0F = '#21262d'; // Active line gutter background
|
|
32
|
+
// Link colors
|
|
33
|
+
const linkColor = '#58a6ff'; // Bright blue for links (GitHub link color)
|
|
34
|
+
const visitedLinkColor = '#bc8cff'; // Light purple for visited links
|
|
35
|
+
// Special states
|
|
36
|
+
const invalid = '#f97583'; // Invalid color - error red
|
|
37
|
+
const highlightBackground = '#2d333b1a'; // Line highlight (GitHub selection color)
|
|
38
|
+
const tooltipBackground = '#21262d'; // Tooltip background
|
|
39
|
+
const cursor = base04; // Caret color
|
|
40
|
+
const selection = base02; // Selection color
|
|
41
|
+
const activeBracketBg = '#3a587a75'; // Active bracket background
|
|
42
|
+
const activeBracketBorder = '#4d90fe'; // Active bracket border
|
|
43
|
+
const diagnosticWarning = '#d29922'; // Warning color
|
|
44
|
+
const selectionMatch = '#3a587a55'; // Selection match background
|
|
45
|
+
/**
|
|
46
|
+
* Enhanced editor theme styles for GitHub Dark
|
|
47
|
+
*/
|
|
27
48
|
const githubDarkTheme = view.EditorView.theme({
|
|
49
|
+
// Base editor styles
|
|
28
50
|
'&': {
|
|
29
51
|
color: base01,
|
|
30
52
|
backgroundColor: base00,
|
|
53
|
+
fontSize: _utils.generalContent.fontSize,
|
|
54
|
+
fontFamily: _utils.generalContent.fontFamily,
|
|
31
55
|
},
|
|
56
|
+
// Content and cursor
|
|
32
57
|
'.cm-content': {
|
|
33
58
|
caretColor: cursor,
|
|
59
|
+
lineHeight: _utils.generalContent.lineHeight,
|
|
34
60
|
},
|
|
35
61
|
'.cm-cursor, .cm-dropCursor': {
|
|
36
62
|
borderLeftColor: cursor,
|
|
63
|
+
borderLeftWidth: _utils.generalCursor.borderLeftWidth,
|
|
37
64
|
},
|
|
65
|
+
'.cm-fat-cursor': {
|
|
66
|
+
backgroundColor: `${cursor}99`,
|
|
67
|
+
color: base00,
|
|
68
|
+
},
|
|
69
|
+
// Selection
|
|
38
70
|
'&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': {
|
|
39
71
|
backgroundColor: selection,
|
|
40
72
|
},
|
|
73
|
+
// Make sure selection appears above active line
|
|
74
|
+
'.cm-selectionLayer': {
|
|
75
|
+
zIndex: 100,
|
|
76
|
+
},
|
|
77
|
+
// Search functionality
|
|
41
78
|
'.cm-searchMatch': {
|
|
42
|
-
backgroundColor:
|
|
43
|
-
|
|
44
|
-
|
|
79
|
+
backgroundColor: '#3a587a',
|
|
80
|
+
outline: `1px solid ${base07}`,
|
|
81
|
+
color: base01,
|
|
82
|
+
borderRadius: _utils.generalSearchField.borderRadius,
|
|
83
|
+
'& span': {
|
|
84
|
+
color: base01,
|
|
85
|
+
},
|
|
45
86
|
},
|
|
46
87
|
'.cm-searchMatch.cm-searchMatch-selected': {
|
|
47
|
-
backgroundColor:
|
|
48
|
-
color:
|
|
49
|
-
|
|
88
|
+
backgroundColor: activeBracketBorder,
|
|
89
|
+
color: base04,
|
|
90
|
+
padding: _utils.generalSearchField.padding,
|
|
91
|
+
'& span': {
|
|
92
|
+
color: base04,
|
|
93
|
+
},
|
|
94
|
+
},
|
|
95
|
+
'.cm-search.cm-panel.cm-textfield': {
|
|
96
|
+
color: base01,
|
|
97
|
+
borderRadius: _utils.generalSearchField.borderRadius,
|
|
98
|
+
padding: _utils.generalSearchField.padding,
|
|
50
99
|
},
|
|
100
|
+
// Panels
|
|
51
101
|
'.cm-panels': {
|
|
52
|
-
backgroundColor:
|
|
102
|
+
backgroundColor: tooltipBackground,
|
|
53
103
|
color: base01,
|
|
104
|
+
borderRadius: '4px',
|
|
54
105
|
},
|
|
55
106
|
'.cm-panels.cm-panels-top': {
|
|
56
|
-
borderBottom:
|
|
107
|
+
borderBottom: `1px solid ${base0E}`,
|
|
57
108
|
},
|
|
58
109
|
'.cm-panels.cm-panels-bottom': {
|
|
59
|
-
borderTop:
|
|
110
|
+
borderTop: `1px solid ${base0E}`,
|
|
111
|
+
},
|
|
112
|
+
'.cm-panel button': {
|
|
113
|
+
backgroundColor: tooltipBackground,
|
|
114
|
+
color: base01,
|
|
115
|
+
border: _utils.generalPanel.border,
|
|
116
|
+
borderRadius: _utils.generalPanel.borderRadius,
|
|
117
|
+
padding: _utils.generalPanel.padding,
|
|
60
118
|
},
|
|
119
|
+
'.cm-panel button:hover': {
|
|
120
|
+
backgroundColor: base0A,
|
|
121
|
+
},
|
|
122
|
+
// Line highlighting
|
|
61
123
|
'.cm-activeLine': {
|
|
62
124
|
backgroundColor: highlightBackground,
|
|
125
|
+
borderRadius: _utils.generalLine.borderRadius,
|
|
126
|
+
zIndex: 1,
|
|
63
127
|
},
|
|
128
|
+
// Gutters
|
|
64
129
|
'.cm-gutters': {
|
|
65
|
-
backgroundColor:
|
|
66
|
-
color: base03,
|
|
130
|
+
backgroundColor: base0D,
|
|
131
|
+
color: base03,
|
|
132
|
+
border: _utils.generalGutter.border,
|
|
133
|
+
borderRight: '1px solid #30363d',
|
|
134
|
+
paddingRight: _utils.generalGutter.paddingRight,
|
|
135
|
+
},
|
|
136
|
+
'.cm-activeLineGutter': {
|
|
137
|
+
backgroundColor: base0F,
|
|
138
|
+
color: base01,
|
|
139
|
+
fontWeight: _utils.generalGutter.fontWeight,
|
|
140
|
+
},
|
|
141
|
+
'.cm-lineNumbers': {
|
|
142
|
+
fontSize: _utils.generalGutter.fontSize,
|
|
143
|
+
},
|
|
144
|
+
'.cm-foldGutter': {
|
|
145
|
+
fontSize: _utils.generalGutter.fontSize,
|
|
67
146
|
},
|
|
147
|
+
'.cm-foldGutter .cm-gutterElement': {
|
|
148
|
+
color: base03,
|
|
149
|
+
cursor: 'pointer',
|
|
150
|
+
},
|
|
151
|
+
'.cm-foldGutter .cm-gutterElement:hover': {
|
|
152
|
+
color: base01,
|
|
153
|
+
},
|
|
154
|
+
// Tooltips and autocomplete
|
|
68
155
|
'.cm-tooltip': {
|
|
69
156
|
backgroundColor: tooltipBackground,
|
|
157
|
+
border: `1px solid ${base0E}`,
|
|
158
|
+
borderRadius: _utils.generalTooltip.borderRadius,
|
|
159
|
+
padding: _utils.generalTooltip.padding,
|
|
160
|
+
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.3)',
|
|
161
|
+
},
|
|
162
|
+
'.cm-tooltip-autocomplete': {
|
|
163
|
+
'& > ul': {
|
|
164
|
+
backgroundColor: tooltipBackground,
|
|
165
|
+
border: 'none',
|
|
166
|
+
},
|
|
167
|
+
'& > ul > li': {
|
|
168
|
+
padding: _utils.generalTooltip.padding,
|
|
169
|
+
lineHeight: _utils.generalTooltip.lineHeight,
|
|
170
|
+
},
|
|
171
|
+
'& > ul > li[aria-selected]': {
|
|
172
|
+
backgroundColor: selection,
|
|
173
|
+
color: base04,
|
|
174
|
+
borderRadius: _utils.generalTooltip.borderRadiusSelected,
|
|
175
|
+
},
|
|
176
|
+
'& > ul > li > span.cm-completionIcon': {
|
|
177
|
+
color: base03,
|
|
178
|
+
paddingRight: _utils.generalTooltip.paddingRight,
|
|
179
|
+
},
|
|
180
|
+
'& > ul > li > span.cm-completionDetail': {
|
|
181
|
+
color: base03,
|
|
182
|
+
fontStyle: 'italic',
|
|
183
|
+
},
|
|
184
|
+
},
|
|
185
|
+
'.cm-tooltip .cm-tooltip-arrow:before': {
|
|
186
|
+
borderTopColor: 'transparent',
|
|
187
|
+
borderBottomColor: 'transparent',
|
|
188
|
+
},
|
|
189
|
+
'.cm-tooltip .cm-tooltip-arrow:after': {
|
|
190
|
+
borderTopColor: tooltipBackground,
|
|
191
|
+
borderBottomColor: tooltipBackground,
|
|
192
|
+
},
|
|
193
|
+
// Diagnostics styling
|
|
194
|
+
'.cm-diagnostic': {
|
|
195
|
+
'&-error': {
|
|
196
|
+
borderLeft: `3px solid ${invalid}`,
|
|
197
|
+
},
|
|
198
|
+
'&-warning': {
|
|
199
|
+
borderLeft: `3px solid ${diagnosticWarning}`,
|
|
200
|
+
},
|
|
201
|
+
'&-info': {
|
|
202
|
+
borderLeft: `3px solid ${linkColor}`,
|
|
203
|
+
},
|
|
204
|
+
},
|
|
205
|
+
'.cm-lintPoint-error': {
|
|
206
|
+
borderBottom: `2px wavy ${invalid}`,
|
|
207
|
+
},
|
|
208
|
+
'.cm-lintPoint-warning': {
|
|
209
|
+
borderBottom: `2px wavy ${diagnosticWarning}`,
|
|
210
|
+
},
|
|
211
|
+
// Matching brackets
|
|
212
|
+
'.cm-matchingBracket': {
|
|
213
|
+
backgroundColor: activeBracketBg,
|
|
214
|
+
outline: `1px solid ${activeBracketBorder}`,
|
|
215
|
+
borderRadius: _utils.generalMatching.borderRadius,
|
|
216
|
+
},
|
|
217
|
+
'.cm-nonmatchingBracket': {
|
|
218
|
+
backgroundColor: '#f9758340',
|
|
219
|
+
outline: `1px solid ${invalid}`,
|
|
220
|
+
borderRadius: _utils.generalMatching.borderRadius,
|
|
221
|
+
},
|
|
222
|
+
// Selection matches
|
|
223
|
+
'.cm-selectionMatch': {
|
|
224
|
+
backgroundColor: selectionMatch,
|
|
225
|
+
outline: `1px solid ${base02}50`,
|
|
226
|
+
borderRadius: _utils.generalMatching.borderRadius,
|
|
227
|
+
},
|
|
228
|
+
// Fold placeholder
|
|
229
|
+
'.cm-foldPlaceholder': {
|
|
230
|
+
backgroundColor: tooltipBackground,
|
|
231
|
+
color: base03,
|
|
232
|
+
border: `1px dotted ${base0E}70`,
|
|
233
|
+
borderRadius: _utils.generalPlaceholder.borderRadius,
|
|
234
|
+
padding: _utils.generalPlaceholder.padding,
|
|
235
|
+
margin: _utils.generalPlaceholder.margin,
|
|
236
|
+
},
|
|
237
|
+
// Focus outline
|
|
238
|
+
'&.cm-focused': {
|
|
239
|
+
outline: 'none',
|
|
240
|
+
boxShadow: `0 0 0 2px ${base00}, 0 0 0 3px ${linkColor}40`,
|
|
241
|
+
},
|
|
242
|
+
// Scrollbars
|
|
243
|
+
'& .cm-scroller::-webkit-scrollbar': {
|
|
244
|
+
width: _utils.generalScroller.width,
|
|
245
|
+
height: _utils.generalScroller.height,
|
|
246
|
+
},
|
|
247
|
+
'& .cm-scroller::-webkit-scrollbar-track': {
|
|
248
|
+
background: base0D,
|
|
249
|
+
},
|
|
250
|
+
'& .cm-scroller::-webkit-scrollbar-thumb': {
|
|
251
|
+
backgroundColor: base0E,
|
|
252
|
+
borderRadius: _utils.generalScroller.borderRadius,
|
|
253
|
+
border: `3px solid ${base0D}`,
|
|
254
|
+
},
|
|
255
|
+
'& .cm-scroller::-webkit-scrollbar-thumb:hover': {
|
|
256
|
+
backgroundColor: base0B,
|
|
257
|
+
},
|
|
258
|
+
// Ghost text
|
|
259
|
+
'.cm-ghostText': {
|
|
260
|
+
opacity: '0.5',
|
|
261
|
+
color: base03,
|
|
70
262
|
},
|
|
71
263
|
}, { dark: true });
|
|
72
|
-
|
|
264
|
+
/**
|
|
265
|
+
* Enhanced syntax highlighting for GitHub Dark theme
|
|
266
|
+
*/
|
|
73
267
|
const githubDarkHighlightStyle = language.HighlightStyle.define([
|
|
74
|
-
|
|
75
|
-
{ tag:
|
|
76
|
-
{ tag:
|
|
77
|
-
{ tag:
|
|
78
|
-
|
|
79
|
-
{ tag: [highlight.tags.
|
|
80
|
-
{ tag: [highlight.tags.
|
|
81
|
-
{ tag: [highlight.tags.
|
|
82
|
-
|
|
83
|
-
{ tag: [highlight.tags.
|
|
268
|
+
// Keywords and control flow
|
|
269
|
+
{ tag: highlight.tags.keyword, color: base08, fontWeight: 'bold' },
|
|
270
|
+
{ tag: highlight.tags.controlKeyword, color: base08, fontWeight: 'bold' },
|
|
271
|
+
{ tag: highlight.tags.moduleKeyword, color: base08, fontWeight: 'bold' },
|
|
272
|
+
// Names and variables
|
|
273
|
+
{ tag: [highlight.tags.name, highlight.tags.deleted, highlight.tags.character, highlight.tags.macroName], color: base07 },
|
|
274
|
+
{ tag: [highlight.tags.variableName], color: base07 },
|
|
275
|
+
{ tag: [highlight.tags.propertyName], color: base06, fontStyle: 'normal' },
|
|
276
|
+
// Classes and types
|
|
277
|
+
{ tag: [highlight.tags.typeName], color: base08 },
|
|
278
|
+
{ tag: [highlight.tags.className], color: base06, fontStyle: 'italic' },
|
|
279
|
+
{ tag: [highlight.tags.namespace], color: base07, fontStyle: 'italic' },
|
|
280
|
+
// Operators and punctuation
|
|
281
|
+
{ tag: [highlight.tags.operator, highlight.tags.operatorKeyword], color: base01 },
|
|
282
|
+
{ tag: [highlight.tags.bracket], color: base03 },
|
|
283
|
+
{ tag: [highlight.tags.brace], color: base03 },
|
|
284
|
+
{ tag: [highlight.tags.punctuation], color: base03 },
|
|
285
|
+
// Functions and parameters
|
|
286
|
+
{ tag: [highlight.tags.function(highlight.tags.variableName), highlight.tags.labelName], color: base05 },
|
|
287
|
+
{ tag: [highlight.tags.definition(highlight.tags.variableName)], color: base07 },
|
|
288
|
+
// Constants and literals
|
|
289
|
+
{ tag: highlight.tags.number, color: base0C },
|
|
290
|
+
{ tag: highlight.tags.changed, color: base0C },
|
|
291
|
+
{ tag: highlight.tags.annotation, color: invalid, fontStyle: 'italic' },
|
|
292
|
+
{ tag: highlight.tags.modifier, color: base0C, fontStyle: 'italic' },
|
|
293
|
+
{ tag: highlight.tags.self, color: base0C },
|
|
294
|
+
{ tag: [highlight.tags.color, highlight.tags.constant(highlight.tags.name), highlight.tags.standard(highlight.tags.name)], color: base0C },
|
|
84
295
|
{ tag: [highlight.tags.atom, highlight.tags.bool, highlight.tags.special(highlight.tags.variableName)], color: base0C },
|
|
85
|
-
|
|
86
|
-
{ tag: highlight.tags.
|
|
87
|
-
{ tag: highlight.tags.
|
|
296
|
+
// Strings and regex
|
|
297
|
+
{ tag: [highlight.tags.processingInstruction, highlight.tags.inserted], color: base05 },
|
|
298
|
+
{ tag: [highlight.tags.special(highlight.tags.string), highlight.tags.regexp], color: base09 },
|
|
299
|
+
{ tag: highlight.tags.string, color: base09 },
|
|
300
|
+
// Punctuation and structure
|
|
301
|
+
{ tag: highlight.tags.definition(highlight.tags.typeName), color: base08, fontWeight: 'bold' },
|
|
302
|
+
// Comments and documentation
|
|
303
|
+
{ tag: highlight.tags.meta, color: base03 },
|
|
304
|
+
{ tag: highlight.tags.comment, fontStyle: 'italic', color: base03 },
|
|
305
|
+
{ tag: highlight.tags.docComment, fontStyle: 'italic', color: base03 },
|
|
306
|
+
// HTML/XML elements
|
|
307
|
+
{ tag: [highlight.tags.tagName], color: base05 },
|
|
308
|
+
{ tag: [highlight.tags.attributeName], color: base06 },
|
|
309
|
+
// Markdown and text formatting
|
|
310
|
+
{ tag: [highlight.tags.heading], fontWeight: 'bold', color: base07 },
|
|
311
|
+
{ tag: [highlight.tags.strong], fontWeight: 'bold', color: base07 },
|
|
312
|
+
{ tag: [highlight.tags.emphasis], fontStyle: 'italic', color: base09 },
|
|
313
|
+
// Links and URLs
|
|
314
|
+
{ tag: [highlight.tags.link], color: visitedLinkColor, fontWeight: '500', textDecoration: 'underline', textUnderlinePosition: 'under' },
|
|
315
|
+
{
|
|
316
|
+
tag: [highlight.tags.url],
|
|
317
|
+
color: linkColor,
|
|
318
|
+
textDecoration: 'underline',
|
|
319
|
+
textUnderlineOffset: '2px',
|
|
320
|
+
},
|
|
321
|
+
// Special states
|
|
322
|
+
{ tag: [highlight.tags.invalid], color: base01, textDecoration: 'underline wavy', borderBottom: `1px wavy ${invalid}` },
|
|
323
|
+
{ tag: [highlight.tags.strikethrough], color: invalid, textDecoration: 'line-through' },
|
|
324
|
+
// Enhanced syntax highlighting
|
|
325
|
+
{ tag: highlight.tags.constant(highlight.tags.name), color: base0C },
|
|
326
|
+
{ tag: highlight.tags.deleted, color: invalid },
|
|
327
|
+
{ tag: highlight.tags.squareBracket, color: base03 },
|
|
328
|
+
{ tag: highlight.tags.angleBracket, color: base03 },
|
|
329
|
+
// Additional specific styles
|
|
330
|
+
{ tag: highlight.tags.monospace, color: base01 },
|
|
331
|
+
{ tag: [highlight.tags.contentSeparator], color: base07 },
|
|
332
|
+
{ tag: highlight.tags.quote, color: base03 },
|
|
88
333
|
]);
|
|
89
|
-
|
|
334
|
+
/**
|
|
335
|
+
* Combined GitHub Dark theme extension
|
|
336
|
+
*/
|
|
90
337
|
const githubDark = [
|
|
91
338
|
githubDarkTheme,
|
|
92
339
|
language.syntaxHighlighting(githubDarkHighlightStyle),
|
package/dist/index.d.cts
CHANGED
|
@@ -1,8 +1,17 @@
|
|
|
1
1
|
import { Extension } from '@codemirror/state';
|
|
2
2
|
import { HighlightStyle } from '@codemirror/language';
|
|
3
3
|
|
|
4
|
+
/**
|
|
5
|
+
* Enhanced editor theme styles for GitHub Dark
|
|
6
|
+
*/
|
|
4
7
|
declare const githubDarkTheme: Extension;
|
|
8
|
+
/**
|
|
9
|
+
* Enhanced syntax highlighting for GitHub Dark theme
|
|
10
|
+
*/
|
|
5
11
|
declare const githubDarkHighlightStyle: HighlightStyle;
|
|
12
|
+
/**
|
|
13
|
+
* Combined GitHub Dark theme extension
|
|
14
|
+
*/
|
|
6
15
|
declare const githubDark: Extension;
|
|
7
16
|
|
|
8
17
|
export { githubDark, githubDarkHighlightStyle, githubDarkTheme };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,17 @@
|
|
|
1
1
|
import { Extension } from '@codemirror/state';
|
|
2
2
|
import { HighlightStyle } from '@codemirror/language';
|
|
3
3
|
|
|
4
|
+
/**
|
|
5
|
+
* Enhanced editor theme styles for GitHub Dark
|
|
6
|
+
*/
|
|
4
7
|
declare const githubDarkTheme: Extension;
|
|
8
|
+
/**
|
|
9
|
+
* Enhanced syntax highlighting for GitHub Dark theme
|
|
10
|
+
*/
|
|
5
11
|
declare const githubDarkHighlightStyle: HighlightStyle;
|
|
12
|
+
/**
|
|
13
|
+
* Combined GitHub Dark theme extension
|
|
14
|
+
*/
|
|
6
15
|
declare const githubDark: Extension;
|
|
7
16
|
|
|
8
17
|
export { githubDark, githubDarkHighlightStyle, githubDarkTheme };
|
package/dist/index.js
CHANGED
|
@@ -1,90 +1,337 @@
|
|
|
1
1
|
import { EditorView } from '@codemirror/view';
|
|
2
2
|
import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
|
|
3
3
|
import { tags } from '@lezer/highlight';
|
|
4
|
+
import { generalScroller, generalPlaceholder, generalMatching, generalTooltip, generalGutter, generalLine, generalPanel, generalSearchField, generalCursor, generalContent } from '@utils';
|
|
4
5
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
6
|
+
/**
|
|
7
|
+
* Enhanced GitHub Dark theme color definitions
|
|
8
|
+
* -------------------------------------------
|
|
9
|
+
* Colors are organized by function with visual color blocks
|
|
10
|
+
*/
|
|
11
|
+
// Core UI colors
|
|
12
|
+
const base00 = '#0d1117'; // Background (GitHub dark mode background)
|
|
13
|
+
const base01 = '#c9d1d9'; // Foreground (main text color)
|
|
14
|
+
const base02 = '#264F78'; // Selection - brighter blue for better visibility
|
|
15
|
+
const base03 = '#8b949e'; // Comment and Bracket color
|
|
16
|
+
const base04 = '#ffffff'; // Caret color (pure white for better visibility)
|
|
17
|
+
// Syntax highlighting colors
|
|
18
|
+
const base05 = '#7ee787'; // TagName, Name, Quote - signature GitHub green
|
|
19
|
+
const base06 = '#d2a8ff'; // ClassName, PropertyName - GitHub purple
|
|
20
|
+
const base07 = '#79c0ff'; // VariableName, Number - GitHub blue
|
|
21
|
+
const base08 = '#ff7b72'; // Keyword, TypeName - GitHub red
|
|
22
|
+
const base09 = '#a5d6ff'; // String, Meta, Regexp - lighter blue
|
|
23
|
+
const base0A = '#2c333a'; // Panel button hover
|
|
24
|
+
const base0B = '#3c444d'; // Deleted background color
|
|
25
|
+
const base0C = '#ffab70'; // Atom, Bool - GitHub orange
|
|
26
|
+
// Background variants
|
|
27
|
+
const base0D = '#161b22'; // Gutter background (slightly darker than the editor)
|
|
28
|
+
const base0E = '#30363d'; // Panel and tooltip border color
|
|
29
|
+
const base0F = '#21262d'; // Active line gutter background
|
|
30
|
+
// Link colors
|
|
31
|
+
const linkColor = '#58a6ff'; // Bright blue for links (GitHub link color)
|
|
32
|
+
const visitedLinkColor = '#bc8cff'; // Light purple for visited links
|
|
33
|
+
// Special states
|
|
34
|
+
const invalid = '#f97583'; // Invalid color - error red
|
|
35
|
+
const highlightBackground = '#2d333b1a'; // Line highlight (GitHub selection color)
|
|
36
|
+
const tooltipBackground = '#21262d'; // Tooltip background
|
|
37
|
+
const cursor = base04; // Caret color
|
|
38
|
+
const selection = base02; // Selection color
|
|
39
|
+
const activeBracketBg = '#3a587a75'; // Active bracket background
|
|
40
|
+
const activeBracketBorder = '#4d90fe'; // Active bracket border
|
|
41
|
+
const diagnosticWarning = '#d29922'; // Warning color
|
|
42
|
+
const selectionMatch = '#3a587a55'; // Selection match background
|
|
43
|
+
/**
|
|
44
|
+
* Enhanced editor theme styles for GitHub Dark
|
|
45
|
+
*/
|
|
25
46
|
const githubDarkTheme = /*@__PURE__*/EditorView.theme({
|
|
47
|
+
// Base editor styles
|
|
26
48
|
'&': {
|
|
27
49
|
color: base01,
|
|
28
50
|
backgroundColor: base00,
|
|
51
|
+
fontSize: generalContent.fontSize,
|
|
52
|
+
fontFamily: generalContent.fontFamily,
|
|
29
53
|
},
|
|
54
|
+
// Content and cursor
|
|
30
55
|
'.cm-content': {
|
|
31
56
|
caretColor: cursor,
|
|
57
|
+
lineHeight: generalContent.lineHeight,
|
|
32
58
|
},
|
|
33
59
|
'.cm-cursor, .cm-dropCursor': {
|
|
34
60
|
borderLeftColor: cursor,
|
|
61
|
+
borderLeftWidth: generalCursor.borderLeftWidth,
|
|
35
62
|
},
|
|
63
|
+
'.cm-fat-cursor': {
|
|
64
|
+
backgroundColor: `${cursor}99`,
|
|
65
|
+
color: base00,
|
|
66
|
+
},
|
|
67
|
+
// Selection
|
|
36
68
|
'&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': {
|
|
37
69
|
backgroundColor: selection,
|
|
38
70
|
},
|
|
71
|
+
// Make sure selection appears above active line
|
|
72
|
+
'.cm-selectionLayer': {
|
|
73
|
+
zIndex: 100,
|
|
74
|
+
},
|
|
75
|
+
// Search functionality
|
|
39
76
|
'.cm-searchMatch': {
|
|
40
|
-
backgroundColor:
|
|
41
|
-
|
|
42
|
-
|
|
77
|
+
backgroundColor: '#3a587a',
|
|
78
|
+
outline: `1px solid ${base07}`,
|
|
79
|
+
color: base01,
|
|
80
|
+
borderRadius: generalSearchField.borderRadius,
|
|
81
|
+
'& span': {
|
|
82
|
+
color: base01,
|
|
83
|
+
},
|
|
43
84
|
},
|
|
44
85
|
'.cm-searchMatch.cm-searchMatch-selected': {
|
|
45
|
-
backgroundColor:
|
|
46
|
-
color:
|
|
47
|
-
|
|
86
|
+
backgroundColor: activeBracketBorder,
|
|
87
|
+
color: base04,
|
|
88
|
+
padding: generalSearchField.padding,
|
|
89
|
+
'& span': {
|
|
90
|
+
color: base04,
|
|
91
|
+
},
|
|
92
|
+
},
|
|
93
|
+
'.cm-search.cm-panel.cm-textfield': {
|
|
94
|
+
color: base01,
|
|
95
|
+
borderRadius: generalSearchField.borderRadius,
|
|
96
|
+
padding: generalSearchField.padding,
|
|
48
97
|
},
|
|
98
|
+
// Panels
|
|
49
99
|
'.cm-panels': {
|
|
50
|
-
backgroundColor:
|
|
100
|
+
backgroundColor: tooltipBackground,
|
|
51
101
|
color: base01,
|
|
102
|
+
borderRadius: '4px',
|
|
52
103
|
},
|
|
53
104
|
'.cm-panels.cm-panels-top': {
|
|
54
|
-
borderBottom:
|
|
105
|
+
borderBottom: `1px solid ${base0E}`,
|
|
55
106
|
},
|
|
56
107
|
'.cm-panels.cm-panels-bottom': {
|
|
57
|
-
borderTop:
|
|
108
|
+
borderTop: `1px solid ${base0E}`,
|
|
109
|
+
},
|
|
110
|
+
'.cm-panel button': {
|
|
111
|
+
backgroundColor: tooltipBackground,
|
|
112
|
+
color: base01,
|
|
113
|
+
border: generalPanel.border,
|
|
114
|
+
borderRadius: generalPanel.borderRadius,
|
|
115
|
+
padding: generalPanel.padding,
|
|
58
116
|
},
|
|
117
|
+
'.cm-panel button:hover': {
|
|
118
|
+
backgroundColor: base0A,
|
|
119
|
+
},
|
|
120
|
+
// Line highlighting
|
|
59
121
|
'.cm-activeLine': {
|
|
60
122
|
backgroundColor: highlightBackground,
|
|
123
|
+
borderRadius: generalLine.borderRadius,
|
|
124
|
+
zIndex: 1,
|
|
61
125
|
},
|
|
126
|
+
// Gutters
|
|
62
127
|
'.cm-gutters': {
|
|
63
|
-
backgroundColor:
|
|
64
|
-
color: base03,
|
|
128
|
+
backgroundColor: base0D,
|
|
129
|
+
color: base03,
|
|
130
|
+
border: generalGutter.border,
|
|
131
|
+
borderRight: '1px solid #30363d',
|
|
132
|
+
paddingRight: generalGutter.paddingRight,
|
|
133
|
+
},
|
|
134
|
+
'.cm-activeLineGutter': {
|
|
135
|
+
backgroundColor: base0F,
|
|
136
|
+
color: base01,
|
|
137
|
+
fontWeight: generalGutter.fontWeight,
|
|
138
|
+
},
|
|
139
|
+
'.cm-lineNumbers': {
|
|
140
|
+
fontSize: generalGutter.fontSize,
|
|
141
|
+
},
|
|
142
|
+
'.cm-foldGutter': {
|
|
143
|
+
fontSize: generalGutter.fontSize,
|
|
65
144
|
},
|
|
145
|
+
'.cm-foldGutter .cm-gutterElement': {
|
|
146
|
+
color: base03,
|
|
147
|
+
cursor: 'pointer',
|
|
148
|
+
},
|
|
149
|
+
'.cm-foldGutter .cm-gutterElement:hover': {
|
|
150
|
+
color: base01,
|
|
151
|
+
},
|
|
152
|
+
// Tooltips and autocomplete
|
|
66
153
|
'.cm-tooltip': {
|
|
67
154
|
backgroundColor: tooltipBackground,
|
|
155
|
+
border: `1px solid ${base0E}`,
|
|
156
|
+
borderRadius: generalTooltip.borderRadius,
|
|
157
|
+
padding: generalTooltip.padding,
|
|
158
|
+
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.3)',
|
|
159
|
+
},
|
|
160
|
+
'.cm-tooltip-autocomplete': {
|
|
161
|
+
'& > ul': {
|
|
162
|
+
backgroundColor: tooltipBackground,
|
|
163
|
+
border: 'none',
|
|
164
|
+
},
|
|
165
|
+
'& > ul > li': {
|
|
166
|
+
padding: generalTooltip.padding,
|
|
167
|
+
lineHeight: generalTooltip.lineHeight,
|
|
168
|
+
},
|
|
169
|
+
'& > ul > li[aria-selected]': {
|
|
170
|
+
backgroundColor: selection,
|
|
171
|
+
color: base04,
|
|
172
|
+
borderRadius: generalTooltip.borderRadiusSelected,
|
|
173
|
+
},
|
|
174
|
+
'& > ul > li > span.cm-completionIcon': {
|
|
175
|
+
color: base03,
|
|
176
|
+
paddingRight: generalTooltip.paddingRight,
|
|
177
|
+
},
|
|
178
|
+
'& > ul > li > span.cm-completionDetail': {
|
|
179
|
+
color: base03,
|
|
180
|
+
fontStyle: 'italic',
|
|
181
|
+
},
|
|
182
|
+
},
|
|
183
|
+
'.cm-tooltip .cm-tooltip-arrow:before': {
|
|
184
|
+
borderTopColor: 'transparent',
|
|
185
|
+
borderBottomColor: 'transparent',
|
|
186
|
+
},
|
|
187
|
+
'.cm-tooltip .cm-tooltip-arrow:after': {
|
|
188
|
+
borderTopColor: tooltipBackground,
|
|
189
|
+
borderBottomColor: tooltipBackground,
|
|
190
|
+
},
|
|
191
|
+
// Diagnostics styling
|
|
192
|
+
'.cm-diagnostic': {
|
|
193
|
+
'&-error': {
|
|
194
|
+
borderLeft: `3px solid ${invalid}`,
|
|
195
|
+
},
|
|
196
|
+
'&-warning': {
|
|
197
|
+
borderLeft: `3px solid ${diagnosticWarning}`,
|
|
198
|
+
},
|
|
199
|
+
'&-info': {
|
|
200
|
+
borderLeft: `3px solid ${linkColor}`,
|
|
201
|
+
},
|
|
202
|
+
},
|
|
203
|
+
'.cm-lintPoint-error': {
|
|
204
|
+
borderBottom: `2px wavy ${invalid}`,
|
|
205
|
+
},
|
|
206
|
+
'.cm-lintPoint-warning': {
|
|
207
|
+
borderBottom: `2px wavy ${diagnosticWarning}`,
|
|
208
|
+
},
|
|
209
|
+
// Matching brackets
|
|
210
|
+
'.cm-matchingBracket': {
|
|
211
|
+
backgroundColor: activeBracketBg,
|
|
212
|
+
outline: `1px solid ${activeBracketBorder}`,
|
|
213
|
+
borderRadius: generalMatching.borderRadius,
|
|
214
|
+
},
|
|
215
|
+
'.cm-nonmatchingBracket': {
|
|
216
|
+
backgroundColor: '#f9758340',
|
|
217
|
+
outline: `1px solid ${invalid}`,
|
|
218
|
+
borderRadius: generalMatching.borderRadius,
|
|
219
|
+
},
|
|
220
|
+
// Selection matches
|
|
221
|
+
'.cm-selectionMatch': {
|
|
222
|
+
backgroundColor: selectionMatch,
|
|
223
|
+
outline: `1px solid ${base02}50`,
|
|
224
|
+
borderRadius: generalMatching.borderRadius,
|
|
225
|
+
},
|
|
226
|
+
// Fold placeholder
|
|
227
|
+
'.cm-foldPlaceholder': {
|
|
228
|
+
backgroundColor: tooltipBackground,
|
|
229
|
+
color: base03,
|
|
230
|
+
border: `1px dotted ${base0E}70`,
|
|
231
|
+
borderRadius: generalPlaceholder.borderRadius,
|
|
232
|
+
padding: generalPlaceholder.padding,
|
|
233
|
+
margin: generalPlaceholder.margin,
|
|
234
|
+
},
|
|
235
|
+
// Focus outline
|
|
236
|
+
'&.cm-focused': {
|
|
237
|
+
outline: 'none',
|
|
238
|
+
boxShadow: `0 0 0 2px ${base00}, 0 0 0 3px ${linkColor}40`,
|
|
239
|
+
},
|
|
240
|
+
// Scrollbars
|
|
241
|
+
'& .cm-scroller::-webkit-scrollbar': {
|
|
242
|
+
width: generalScroller.width,
|
|
243
|
+
height: generalScroller.height,
|
|
244
|
+
},
|
|
245
|
+
'& .cm-scroller::-webkit-scrollbar-track': {
|
|
246
|
+
background: base0D,
|
|
247
|
+
},
|
|
248
|
+
'& .cm-scroller::-webkit-scrollbar-thumb': {
|
|
249
|
+
backgroundColor: base0E,
|
|
250
|
+
borderRadius: generalScroller.borderRadius,
|
|
251
|
+
border: `3px solid ${base0D}`,
|
|
252
|
+
},
|
|
253
|
+
'& .cm-scroller::-webkit-scrollbar-thumb:hover': {
|
|
254
|
+
backgroundColor: base0B,
|
|
255
|
+
},
|
|
256
|
+
// Ghost text
|
|
257
|
+
'.cm-ghostText': {
|
|
258
|
+
opacity: '0.5',
|
|
259
|
+
color: base03,
|
|
68
260
|
},
|
|
69
261
|
}, { dark: true });
|
|
70
|
-
|
|
262
|
+
/**
|
|
263
|
+
* Enhanced syntax highlighting for GitHub Dark theme
|
|
264
|
+
*/
|
|
71
265
|
const githubDarkHighlightStyle = /*@__PURE__*/HighlightStyle.define([
|
|
72
|
-
|
|
73
|
-
{ tag:
|
|
74
|
-
{ tag:
|
|
75
|
-
{ tag:
|
|
76
|
-
|
|
77
|
-
{ tag: [tags.
|
|
78
|
-
{ tag: [tags.
|
|
79
|
-
{ tag: [tags.
|
|
80
|
-
|
|
81
|
-
{ tag: [tags.
|
|
266
|
+
// Keywords and control flow
|
|
267
|
+
{ tag: tags.keyword, color: base08, fontWeight: 'bold' },
|
|
268
|
+
{ tag: tags.controlKeyword, color: base08, fontWeight: 'bold' },
|
|
269
|
+
{ tag: tags.moduleKeyword, color: base08, fontWeight: 'bold' },
|
|
270
|
+
// Names and variables
|
|
271
|
+
{ tag: [tags.name, tags.deleted, tags.character, tags.macroName], color: base07 },
|
|
272
|
+
{ tag: [tags.variableName], color: base07 },
|
|
273
|
+
{ tag: [tags.propertyName], color: base06, fontStyle: 'normal' },
|
|
274
|
+
// Classes and types
|
|
275
|
+
{ tag: [tags.typeName], color: base08 },
|
|
276
|
+
{ tag: [tags.className], color: base06, fontStyle: 'italic' },
|
|
277
|
+
{ tag: [tags.namespace], color: base07, fontStyle: 'italic' },
|
|
278
|
+
// Operators and punctuation
|
|
279
|
+
{ tag: [tags.operator, tags.operatorKeyword], color: base01 },
|
|
280
|
+
{ tag: [tags.bracket], color: base03 },
|
|
281
|
+
{ tag: [tags.brace], color: base03 },
|
|
282
|
+
{ tag: [tags.punctuation], color: base03 },
|
|
283
|
+
// Functions and parameters
|
|
284
|
+
{ tag: [/*@__PURE__*/tags.function(tags.variableName), tags.labelName], color: base05 },
|
|
285
|
+
{ tag: [/*@__PURE__*/tags.definition(tags.variableName)], color: base07 },
|
|
286
|
+
// Constants and literals
|
|
287
|
+
{ tag: tags.number, color: base0C },
|
|
288
|
+
{ tag: tags.changed, color: base0C },
|
|
289
|
+
{ tag: tags.annotation, color: invalid, fontStyle: 'italic' },
|
|
290
|
+
{ tag: tags.modifier, color: base0C, fontStyle: 'italic' },
|
|
291
|
+
{ tag: tags.self, color: base0C },
|
|
292
|
+
{ tag: [tags.color, /*@__PURE__*/tags.constant(tags.name), /*@__PURE__*/tags.standard(tags.name)], color: base0C },
|
|
82
293
|
{ tag: [tags.atom, tags.bool, /*@__PURE__*/tags.special(tags.variableName)], color: base0C },
|
|
83
|
-
|
|
84
|
-
{ tag: tags.
|
|
85
|
-
{ tag: tags.
|
|
294
|
+
// Strings and regex
|
|
295
|
+
{ tag: [tags.processingInstruction, tags.inserted], color: base05 },
|
|
296
|
+
{ tag: [/*@__PURE__*/tags.special(tags.string), tags.regexp], color: base09 },
|
|
297
|
+
{ tag: tags.string, color: base09 },
|
|
298
|
+
// Punctuation and structure
|
|
299
|
+
{ tag: /*@__PURE__*/tags.definition(tags.typeName), color: base08, fontWeight: 'bold' },
|
|
300
|
+
// Comments and documentation
|
|
301
|
+
{ tag: tags.meta, color: base03 },
|
|
302
|
+
{ tag: tags.comment, fontStyle: 'italic', color: base03 },
|
|
303
|
+
{ tag: tags.docComment, fontStyle: 'italic', color: base03 },
|
|
304
|
+
// HTML/XML elements
|
|
305
|
+
{ tag: [tags.tagName], color: base05 },
|
|
306
|
+
{ tag: [tags.attributeName], color: base06 },
|
|
307
|
+
// Markdown and text formatting
|
|
308
|
+
{ tag: [tags.heading], fontWeight: 'bold', color: base07 },
|
|
309
|
+
{ tag: [tags.strong], fontWeight: 'bold', color: base07 },
|
|
310
|
+
{ tag: [tags.emphasis], fontStyle: 'italic', color: base09 },
|
|
311
|
+
// Links and URLs
|
|
312
|
+
{ tag: [tags.link], color: visitedLinkColor, fontWeight: '500', textDecoration: 'underline', textUnderlinePosition: 'under' },
|
|
313
|
+
{
|
|
314
|
+
tag: [tags.url],
|
|
315
|
+
color: linkColor,
|
|
316
|
+
textDecoration: 'underline',
|
|
317
|
+
textUnderlineOffset: '2px',
|
|
318
|
+
},
|
|
319
|
+
// Special states
|
|
320
|
+
{ tag: [tags.invalid], color: base01, textDecoration: 'underline wavy', borderBottom: `1px wavy ${invalid}` },
|
|
321
|
+
{ tag: [tags.strikethrough], color: invalid, textDecoration: 'line-through' },
|
|
322
|
+
// Enhanced syntax highlighting
|
|
323
|
+
{ tag: /*@__PURE__*/tags.constant(tags.name), color: base0C },
|
|
324
|
+
{ tag: tags.deleted, color: invalid },
|
|
325
|
+
{ tag: tags.squareBracket, color: base03 },
|
|
326
|
+
{ tag: tags.angleBracket, color: base03 },
|
|
327
|
+
// Additional specific styles
|
|
328
|
+
{ tag: tags.monospace, color: base01 },
|
|
329
|
+
{ tag: [tags.contentSeparator], color: base07 },
|
|
330
|
+
{ tag: tags.quote, color: base03 },
|
|
86
331
|
]);
|
|
87
|
-
|
|
332
|
+
/**
|
|
333
|
+
* Combined GitHub Dark theme extension
|
|
334
|
+
*/
|
|
88
335
|
const githubDark = [
|
|
89
336
|
githubDarkTheme,
|
|
90
337
|
/*@__PURE__*/syntaxHighlighting(githubDarkHighlightStyle),
|