feat(editor): setup dark-mode for the code-editor, with automatic switching (#4453)

* feat(editor): Setup dark-mode for the code-editor, with automatic switching

By default this feature is disabled. The feature can be toggled with `document.body.classList.toggle('dark-mode-beta')`

* change the beta class name

* switch codemirror theme over to css variables
This commit is contained in:
कारतोफ्फेलस्क्रिप्ट™
2022-10-27 12:17:45 +02:00
committed by GitHub
parent 227212c928
commit f29f812b28
3 changed files with 92 additions and 74 deletions

View File

@@ -412,6 +412,21 @@
var(--color-sticky-default-border-l)
);
--color-code-background: #ffffff;
--color-code-foreground: #4d4d4c;
--color-code-caret: #aeafad;
--color-code-selection: #d6d6d6;
--color-code-gutterBackground: #ffffff;
--color-code-gutterForeground: #4d4d4c80;
--color-code-lineHighlight: #efefef;
--color-code-tags-comment: #8e908c;
--color-code-tags-string: #718c00;
--color-code-tags-primitive: #f5871f;
--color-code-tags-keyword: #8959a8;
--color-code-tags-operator: #3e999f;
--color-code-tags-variable: #c82829;
--color-code-tags-definition: #4271ae;
// Generated Color Shades from 50 to 950
// Not yet used in design system
@each $color in ('neutral', 'success', 'warning', 'danger') {