aboutsummaryrefslogtreecommitdiffstats
path: root/subprojects/frontend/src/theme/EditorTheme.ts
diff options
context:
space:
mode:
Diffstat (limited to 'subprojects/frontend/src/theme/EditorTheme.ts')
-rw-r--r--subprojects/frontend/src/theme/EditorTheme.ts47
1 files changed, 47 insertions, 0 deletions
diff --git a/subprojects/frontend/src/theme/EditorTheme.ts b/subprojects/frontend/src/theme/EditorTheme.ts
new file mode 100644
index 00000000..294192fa
--- /dev/null
+++ b/subprojects/frontend/src/theme/EditorTheme.ts
@@ -0,0 +1,47 @@
1import type { PaletteMode } from '@mui/material';
2
3import cssVariables from '../themeVariables.module.scss';
4
5export enum EditorTheme {
6 Light,
7 Dark,
8}
9
10export class EditorThemeData {
11 className: string;
12
13 paletteMode: PaletteMode;
14
15 toggleDarkMode: EditorTheme;
16
17 foreground!: string;
18
19 foregroundHighlight!: string;
20
21 background!: string;
22
23 primary!: string;
24
25 secondary!: string;
26
27 constructor(className: string, paletteMode: PaletteMode, toggleDarkMode: EditorTheme) {
28 this.className = className;
29 this.paletteMode = paletteMode;
30 this.toggleDarkMode = toggleDarkMode;
31 Reflect.ownKeys(this).forEach((key) => {
32 if (!Reflect.get(this, key)) {
33 const cssKey = `${this.className}--${key.toString()}`;
34 if (cssKey in cssVariables) {
35 Reflect.set(this, key, cssVariables[cssKey]);
36 }
37 }
38 });
39 }
40}
41
42export const DEFAULT_THEME = EditorTheme.Dark;
43
44export const EDITOR_THEMES: { [key in EditorTheme]: EditorThemeData } = {
45 [EditorTheme.Light]: new EditorThemeData('light', 'light', EditorTheme.Dark),
46 [EditorTheme.Dark]: new EditorThemeData('dark', 'dark', EditorTheme.Light),
47};