diff options
Diffstat (limited to 'language-web/src')
-rw-r--r-- | language-web/src/main/css/index.scss | 22 | ||||
-rw-r--r-- | language-web/src/main/js/editor/EditorButtons.jsx | 5 |
2 files changed, 17 insertions, 10 deletions
diff --git a/language-web/src/main/css/index.scss b/language-web/src/main/css/index.scss index 5b03d1fc..319dff8d 100644 --- a/language-web/src/main/css/index.scss +++ b/language-web/src/main/css/index.scss | |||
@@ -1,5 +1,5 @@ | |||
1 | @use '@fontsource/roboto/scss/mixins' as Roboto; | 1 | @use '@fontsource/roboto/scss/mixins' as Roboto; |
2 | @use '@fontsource/fira-code/scss/mixins' as FiraCode; | 2 | @use '@fontsource/jetbrains-mono/scss/mixins' as JetbrainsMono; |
3 | 3 | ||
4 | @import 'codemirror/lib/codemirror'; | 4 | @import 'codemirror/lib/codemirror'; |
5 | @import 'codemirror/addon/hint/show-hint'; | 5 | @import 'codemirror/addon/hint/show-hint'; |
@@ -11,20 +11,22 @@ $robotoWeights: 300, 400, 500, 700; | |||
11 | @include Roboto.fontFace($fontName: 'Roboto', $weight: $weight, $style: italic); | 11 | @include Roboto.fontFace($fontName: 'Roboto', $weight: $weight, $style: italic); |
12 | } | 12 | } |
13 | 13 | ||
14 | $firaCodeWeights: 400, 600; | 14 | $jetbrainsMonoWeights: 400, 700; |
15 | @each $weight in $firaCodeWeights { | 15 | @each $weight in $jetbrainsMonoWeights { |
16 | @include FiraCode.fontFace($fontName: 'Fira Code', $weight: $weight); | 16 | @include JetbrainsMono.fontFace($fontName: 'JetBrains Mono', $weight: $weight); |
17 | @include JetbrainsMono.fontFace($fontName: 'JetBrains Mono', $weight: $weight, $style: italic); | ||
17 | } | 18 | } |
18 | @include FiraCode.fontFaceVariable($fontName: 'Fira CodeVariable'); | 19 | @include JetbrainsMono.fontFaceVariable($fontName: 'JetBrains MonoVariable'); |
20 | @include JetbrainsMono.fontFaceVariable($fontName: 'JetBrains MonoVariable', $style: italic); | ||
19 | 21 | ||
20 | body { | 22 | body { |
21 | font-family: 'Roboto'; | 23 | font-family: 'Roboto', sans-serif; |
22 | } | 24 | } |
23 | 25 | ||
24 | .CodeMirror { | 26 | .CodeMirror, .CodeMirror-hints { |
25 | font-size: 16px; | 27 | font-size: 16px; |
26 | height: 100%; | 28 | height: 100%; |
27 | font-family: 'Fira CodeVariable', 'Fira Code', monospace; | 29 | font-family: 'JetBrains MonoVariable', 'JetBrains Mono', monospace; |
28 | font-feature-settings: 'liga', 'calt'; | 30 | font-feature-settings: 'liga', 'calt'; |
29 | font-weight: 400; | 31 | font-weight: 400; |
30 | text-rendering: optimizeLegibility; | 32 | text-rendering: optimizeLegibility; |
@@ -92,6 +94,7 @@ body { | |||
92 | } | 94 | } |
93 | 95 | ||
94 | .problem-abstract { | 96 | .problem-abstract { |
97 | font-style: italic; | ||
95 | } | 98 | } |
96 | 99 | ||
97 | .problem-reference { | 100 | .problem-reference { |
@@ -99,7 +102,7 @@ body { | |||
99 | } | 102 | } |
100 | 103 | ||
101 | .problem-containment { | 104 | .problem-containment { |
102 | font-weight: 600; | 105 | font-weight: 700; |
103 | } | 106 | } |
104 | 107 | ||
105 | .cm-quoted-name, .problem-enum-node { | 108 | .cm-quoted-name, .problem-enum-node { |
@@ -107,6 +110,7 @@ body { | |||
107 | } | 110 | } |
108 | 111 | ||
109 | .problem-new-node { | 112 | .problem-new-node { |
113 | font-style: italic; | ||
110 | } | 114 | } |
111 | 115 | ||
112 | .problem-variable { | 116 | .problem-variable { |
diff --git a/language-web/src/main/js/editor/EditorButtons.jsx b/language-web/src/main/js/editor/EditorButtons.jsx index 62f82f29..422c8a6d 100644 --- a/language-web/src/main/js/editor/EditorButtons.jsx +++ b/language-web/src/main/js/editor/EditorButtons.jsx | |||
@@ -8,6 +8,7 @@ import FormatListNumberedIcon from '@material-ui/icons/FormatListNumbered'; | |||
8 | import RedoIcon from '@material-ui/icons/Redo'; | 8 | import RedoIcon from '@material-ui/icons/Redo'; |
9 | import UndoIcon from '@material-ui/icons/Undo'; | 9 | import UndoIcon from '@material-ui/icons/Undo'; |
10 | import ToggleButton from '@material-ui/lab/ToggleButton'; | 10 | import ToggleButton from '@material-ui/lab/ToggleButton'; |
11 | |||
11 | import { useRootStore } from '../RootStore'; | 12 | import { useRootStore } from '../RootStore'; |
12 | 13 | ||
13 | const useStyles = makeStyles(theme => ({ | 14 | const useStyles = makeStyles(theme => ({ |
@@ -40,6 +41,7 @@ export default observer(() => { | |||
40 | disabled={!editorStore.canUndo} | 41 | disabled={!editorStore.canUndo} |
41 | onClick={() => editorStore.undo()} | 42 | onClick={() => editorStore.undo()} |
42 | className={classes.iconButton} | 43 | className={classes.iconButton} |
44 | aria-label='Undo' | ||
43 | > | 45 | > |
44 | <UndoIcon fontSize='small'/> | 46 | <UndoIcon fontSize='small'/> |
45 | </Button> | 47 | </Button> |
@@ -47,6 +49,7 @@ export default observer(() => { | |||
47 | disabled={!editorStore.canRedo} | 49 | disabled={!editorStore.canRedo} |
48 | onClick={() => editorStore.redo()} | 50 | onClick={() => editorStore.redo()} |
49 | className={classes.iconButton} | 51 | className={classes.iconButton} |
52 | aria-label='REdo' | ||
50 | > | 53 | > |
51 | <RedoIcon fontSize='small'/> | 54 | <RedoIcon fontSize='small'/> |
52 | </Button> | 55 | </Button> |
@@ -57,11 +60,11 @@ export default observer(() => { | |||
57 | className={classes.divider} | 60 | className={classes.divider} |
58 | /> | 61 | /> |
59 | <ToggleButton | 62 | <ToggleButton |
60 | value='Show line numbers' | ||
61 | selected={editorStore.showLineNumbers} | 63 | selected={editorStore.showLineNumbers} |
62 | onChange={() => editorStore.toggleLineNumbers()} | 64 | onChange={() => editorStore.toggleLineNumbers()} |
63 | size='small' | 65 | size='small' |
64 | className={classes.flatToggleButton} | 66 | className={classes.flatToggleButton} |
67 | aria-label='Show line numbers' | ||
65 | > | 68 | > |
66 | <FormatListNumberedIcon fontSize='small'/> | 69 | <FormatListNumberedIcon fontSize='small'/> |
67 | </ToggleButton> | 70 | </ToggleButton> |