diff options
Diffstat (limited to 'language-web/src/main/js/editor/EditorParent.ts')
-rw-r--r-- | language-web/src/main/js/editor/EditorParent.ts | 61 |
1 files changed, 61 insertions, 0 deletions
diff --git a/language-web/src/main/js/editor/EditorParent.ts b/language-web/src/main/js/editor/EditorParent.ts new file mode 100644 index 00000000..bf67522b --- /dev/null +++ b/language-web/src/main/js/editor/EditorParent.ts | |||
@@ -0,0 +1,61 @@ | |||
1 | import { styled } from '@mui/material/styles'; | ||
2 | |||
3 | export const EditorParent = styled('div')(({ theme }) => ({ | ||
4 | background: theme.palette.background.default, | ||
5 | '&, .cm-editor': { | ||
6 | height: '100%', | ||
7 | }, | ||
8 | '.cm-scroller': { | ||
9 | fontSize: 16, | ||
10 | fontFamily: '"JetBrains MonoVariable", "JetBrains Mono", monospace', | ||
11 | fontFeatureSettings: '"liga", "calt"', | ||
12 | fontWeight: 400, | ||
13 | letterSpacing: 0, | ||
14 | textRendering: 'optimizeLegibility', | ||
15 | color: theme.palette.text.secondary, | ||
16 | }, | ||
17 | '.cm-gutters': { | ||
18 | background: theme.palette.background.default, | ||
19 | color: theme.palette.text.disabled, | ||
20 | border: 'none', | ||
21 | }, | ||
22 | '.cm-specialChar': { | ||
23 | color: theme.palette.secondary.main, | ||
24 | }, | ||
25 | '.cm-activeLine': { | ||
26 | background: 'rgba(0, 0, 0, 0.3)', | ||
27 | }, | ||
28 | '.cm-activeLineGutter': { | ||
29 | background: 'rgba(0, 0, 0, 0.3)', | ||
30 | color: theme.palette.text.primary, | ||
31 | }, | ||
32 | '.cm-cursor, .cm-cursor-primary': { | ||
33 | borderColor: theme.palette.primary.main, | ||
34 | background: theme.palette.common.black, | ||
35 | }, | ||
36 | '.cm-selectionBackground': { | ||
37 | background: '#3e4453', | ||
38 | }, | ||
39 | '.cm-focused': { | ||
40 | outline: 'none', | ||
41 | '.cm-selectionBackground': { | ||
42 | background: '#3e4453', | ||
43 | }, | ||
44 | }, | ||
45 | '.cm-panels-top': { | ||
46 | color: theme.palette.text.secondary, | ||
47 | }, | ||
48 | '.cm-panel': { | ||
49 | background: theme.palette.background.paper, | ||
50 | borderTop: `1px solid ${theme.palette.divider}`, | ||
51 | 'button[name="close"]': { | ||
52 | // HACK We can't hook the panel close button to go through `EditorStore`, | ||
53 | // so we hide it altogether. | ||
54 | display: 'none', | ||
55 | }, | ||
56 | }, | ||
57 | '.cmt-comment': { | ||
58 | fontVariant: 'italic', | ||
59 | color: theme.palette.text.disabled, | ||
60 | }, | ||
61 | })); | ||