diff options
Diffstat (limited to 'subprojects/frontend/src/theme')
-rw-r--r-- | subprojects/frontend/src/theme/ThemeProvider.tsx | 40 |
1 files changed, 37 insertions, 3 deletions
diff --git a/subprojects/frontend/src/theme/ThemeProvider.tsx b/subprojects/frontend/src/theme/ThemeProvider.tsx index 18310147..a996cde8 100644 --- a/subprojects/frontend/src/theme/ThemeProvider.tsx +++ b/subprojects/frontend/src/theme/ThemeProvider.tsx | |||
@@ -1,5 +1,5 @@ | |||
1 | /* | 1 | /* |
2 | * SPDX-FileCopyrightText: 2021-2023 The Refinery Authors <https://refinery.tools/> | 2 | * SPDX-FileCopyrightText: 2021-2024 The Refinery Authors <https://refinery.tools/> |
3 | * | 3 | * |
4 | * SPDX-License-Identifier: EPL-2.0 | 4 | * SPDX-License-Identifier: EPL-2.0 |
5 | */ | 5 | */ |
@@ -24,6 +24,11 @@ interface OuterPalette { | |||
24 | border: string; | 24 | border: string; |
25 | } | 25 | } |
26 | 26 | ||
27 | interface TypeHashPalette { | ||
28 | text: string; | ||
29 | box: string; | ||
30 | } | ||
31 | |||
27 | interface HighlightPalette { | 32 | interface HighlightPalette { |
28 | number: string; | 33 | number: string; |
29 | parameter: string; | 34 | parameter: string; |
@@ -41,17 +46,20 @@ interface HighlightPalette { | |||
41 | selected: string; | 46 | selected: string; |
42 | contrastText: string; | 47 | contrastText: string; |
43 | }; | 48 | }; |
49 | typeHash: TypeHashPalette[]; | ||
44 | } | 50 | } |
45 | 51 | ||
46 | declare module '@mui/material/styles' { | 52 | declare module '@mui/material/styles' { |
47 | interface TypographyVariants { | 53 | interface TypographyVariants { |
48 | fontWeightEditorNormal: number; | 54 | fontWeightEditorNormal: number; |
55 | fontWeightEditorTypeHash: number; | ||
49 | fontWeightEditorBold: number; | 56 | fontWeightEditorBold: number; |
50 | editor: TypographyStyle; | 57 | editor: TypographyStyle; |
51 | } | 58 | } |
52 | 59 | ||
53 | interface TypographyVariantsOptions { | 60 | interface TypographyVariantsOptions { |
54 | fontWeightEditorNormal?: number; | 61 | fontWeightEditorNormal?: number; |
62 | fontWeightEditorTypeHash?: number; | ||
55 | fontWeightEditorBold?: number; | 63 | fontWeightEditorBold?: number; |
56 | editor?: TypographyStyle; | 64 | editor?: TypographyStyle; |
57 | } | 65 | } |
@@ -78,6 +86,7 @@ function createResponsiveTheme( | |||
78 | '"Open Sans Variable", "Open Sans", "Roboto", "Helvetica", "Arial", sans-serif', | 86 | '"Open Sans Variable", "Open Sans", "Roboto", "Helvetica", "Arial", sans-serif', |
79 | fontWeightMedium: 500, | 87 | fontWeightMedium: 500, |
80 | fontWeightEditorNormal: 400, | 88 | fontWeightEditorNormal: 400, |
89 | fontWeightEditorTypeHash: 500, | ||
81 | fontWeightEditorBold: 700, | 90 | fontWeightEditorBold: 700, |
82 | button: { | 91 | button: { |
83 | fontWeight: 600, | 92 | fontWeight: 600, |
@@ -220,7 +229,7 @@ const lightTheme = (() => { | |||
220 | palette: { | 229 | palette: { |
221 | mode: 'light', | 230 | mode: 'light', |
222 | primary: { main: '#038a99' }, | 231 | primary: { main: '#038a99' }, |
223 | secondary: { main: '#e45649' }, | 232 | secondary: { main: '#61afef' }, |
224 | error: { main: '#ca1243' }, | 233 | error: { main: '#ca1243' }, |
225 | warning: { main: '#c18401' }, | 234 | warning: { main: '#c18401' }, |
226 | success: { main: '#50a14f' }, | 235 | success: { main: '#50a14f' }, |
@@ -256,6 +265,18 @@ const lightTheme = (() => { | |||
256 | selected: '#d500f9', | 265 | selected: '#d500f9', |
257 | contrastText: '#fff', | 266 | contrastText: '#fff', |
258 | }, | 267 | }, |
268 | typeHash: [ | ||
269 | { text: '#986801', box: '#e5c07b' }, | ||
270 | { text: '#d6493e', box: '#e06c75' }, | ||
271 | { text: '#50a14f', box: '#98c379' }, | ||
272 | { text: '#a626a4', box: '#c678dd' }, | ||
273 | { text: '#4078f2', box: '#80a7f4' }, | ||
274 | { text: '#827662', box: '#e3d1b2' }, | ||
275 | { text: '#904f53', box: '#e78b8f' }, | ||
276 | { text: '#637855', box: '#abcc94' }, | ||
277 | { text: '#805f89', box: '#dbb2e8' }, | ||
278 | { text: '#5987ae', box: '#92c0e9' }, | ||
279 | ], | ||
259 | }, | 280 | }, |
260 | }, | 281 | }, |
261 | }); | 282 | }); |
@@ -270,6 +291,7 @@ const darkTheme = (() => { | |||
270 | { | 291 | { |
271 | typography: { | 292 | typography: { |
272 | fontWeightEditorNormal: 350, | 293 | fontWeightEditorNormal: 350, |
294 | fontWeightEditorTypeHash: 350, | ||
273 | fontWeightEditorBold: 650, | 295 | fontWeightEditorBold: 650, |
274 | }, | 296 | }, |
275 | palette: { | 297 | palette: { |
@@ -277,7 +299,7 @@ const darkTheme = (() => { | |||
277 | primary: { main: '#56b6c2' }, | 299 | primary: { main: '#56b6c2' }, |
278 | secondary: { main: '#be5046' }, | 300 | secondary: { main: '#be5046' }, |
279 | error: { main: '#e06c75' }, | 301 | error: { main: '#e06c75' }, |
280 | warning: { main: '#e5c07b' }, | 302 | warning: { main: '#d19a66' }, |
281 | success: { main: '#98c379' }, | 303 | success: { main: '#98c379' }, |
282 | info: { main: '#61afef' }, | 304 | info: { main: '#61afef' }, |
283 | background: { | 305 | background: { |
@@ -311,6 +333,18 @@ const darkTheme = (() => { | |||
311 | selected: '#dd33fa', | 333 | selected: '#dd33fa', |
312 | contrastText: darkBackground, | 334 | contrastText: darkBackground, |
313 | }, | 335 | }, |
336 | typeHash: [ | ||
337 | { text: '#e5c07b', box: '#ae8003' }, | ||
338 | { text: '#e06c75', box: '#a23b47' }, | ||
339 | { text: '#98c379', box: '#428141' }, | ||
340 | { text: '#c678dd', box: '#854797' }, | ||
341 | { text: '#61afef', box: '#3982bb' }, | ||
342 | { text: '#e3d1b2', box: '#827662' }, | ||
343 | { text: '#e78b8f', box: '#904f53' }, | ||
344 | { text: '#abcc94', box: '#647e63' }, | ||
345 | { text: '#dbb2e8', box: '#805f89' }, | ||
346 | { text: '#92c0e9', box: '#4f7799' }, | ||
347 | ], | ||
314 | }, | 348 | }, |
315 | }, | 349 | }, |
316 | }, | 350 | }, |