diff --git a/src/renderer/store/env-settings-overrides.ts b/src/renderer/store/env-settings-overrides.ts index 75508b1a8..84c9f5a2d 100644 --- a/src/renderer/store/env-settings-overrides.ts +++ b/src/renderer/store/env-settings-overrides.ts @@ -10,6 +10,8 @@ const APP_THEMES = new Set([ 'defaultDark', 'defaultLight', 'dracula', + 'everforestDark', + 'everforestLight', 'githubDark', 'githubLight', 'glassyDark', diff --git a/src/renderer/themes/use-app-theme.ts b/src/renderer/themes/use-app-theme.ts index 6ff380e83..1157c610a 100644 --- a/src/renderer/themes/use-app-theme.ts +++ b/src/renderer/themes/use-app-theme.ts @@ -23,6 +23,8 @@ export const THEME_DATA = [ { label: 'One Dark', type: 'dark', value: AppTheme.ONE_DARK }, { label: 'Solarized Dark', type: 'dark', value: AppTheme.SOLARIZED_DARK }, { label: 'Solarized Light', type: 'light', value: AppTheme.SOLARIZED_LIGHT }, + { label: 'Everforest Dark', type: 'dark', value: AppTheme.EVERFOREST_DARK }, + { label: 'Everforest Light', type: 'light', value: AppTheme.EVERFOREST_LIGHT }, { label: 'GitHub Dark', type: 'dark', value: AppTheme.GITHUB_DARK }, { label: 'GitHub Light', type: 'light', value: AppTheme.GITHUB_LIGHT }, { label: 'Glassy Dark', type: 'dark', value: AppTheme.GLASSY_DARK }, diff --git a/src/shared/themes/app-theme-types.ts b/src/shared/themes/app-theme-types.ts index 912f4cb6d..0e47aabe8 100644 --- a/src/shared/themes/app-theme-types.ts +++ b/src/shared/themes/app-theme-types.ts @@ -10,6 +10,8 @@ export enum AppTheme { DEFAULT_DARK = 'defaultDark', DEFAULT_LIGHT = 'defaultLight', DRACULA = 'dracula', + EVERFOREST_DARK = 'everforestDark', + EVERFOREST_LIGHT = 'everforestLight', GITHUB_DARK = 'githubDark', GITHUB_LIGHT = 'githubLight', GLASSY_DARK = 'glassyDark', diff --git a/src/shared/themes/app-theme.ts b/src/shared/themes/app-theme.ts index 1716077b0..7438cc67c 100644 --- a/src/shared/themes/app-theme.ts +++ b/src/shared/themes/app-theme.ts @@ -11,6 +11,8 @@ import { defaultTheme } from '/@/shared/themes/default'; import { defaultDark } from '/@/shared/themes/default-dark/default-dark'; import { defaultLight } from '/@/shared/themes/default-light/default-light'; import { dracula } from '/@/shared/themes/dracula/dracula'; +import { everforestDark } from '/@/shared/themes/everforest-dark/everforest-dark'; +import { everforestLight } from '/@/shared/themes/everforest-light/everforest-light'; import { githubDark } from '/@/shared/themes/github-dark/github-dark'; import { githubLight } from '/@/shared/themes/github-light/github-light'; import { glassyDark } from '/@/shared/themes/glassy-dark/glassy-dark'; @@ -42,6 +44,8 @@ export const appTheme: Record = { [AppTheme.DEFAULT_DARK]: defaultDark, [AppTheme.DEFAULT_LIGHT]: defaultLight, [AppTheme.DRACULA]: dracula, + [AppTheme.EVERFOREST_DARK]: everforestDark, + [AppTheme.EVERFOREST_LIGHT]: everforestLight, [AppTheme.GITHUB_DARK]: githubDark, [AppTheme.GITHUB_LIGHT]: githubLight, [AppTheme.GLASSY_DARK]: glassyDark, diff --git a/src/shared/themes/everforest-dark/everforest-dark.ts b/src/shared/themes/everforest-dark/everforest-dark.ts new file mode 100644 index 000000000..092840079 --- /dev/null +++ b/src/shared/themes/everforest-dark/everforest-dark.ts @@ -0,0 +1,28 @@ +import { AppThemeConfiguration } from '/@/shared/themes/app-theme-types'; + +export const everforestDark: AppThemeConfiguration = { + app: { + 'overlay-header': + 'linear-gradient(transparent 0%, rgb(39 46 41 / 85%) 100%), var(--theme-background-noise)', + 'overlay-subheader': + 'linear-gradient(180deg, rgb(39 46 41 / 5%) 0%, var(--theme-colors-background) 100%), var(--theme-background-noise)', + 'scrollbar-handle-background': 'rgba(160, 160, 160, 20%)', + 'scrollbar-handle-hover-background': 'rgba(160, 160, 160, 40%)', + }, + colors: { + background: 'rgb(35, 42, 46)', + 'background-alternate': 'rgb(35, 42, 46)', + black: 'rgb(0, 0, 0)', + foreground: 'rgb(211, 198, 170)', + 'foreground-muted': 'rgb(211, 198, 170)', + primary: 'rgb(167, 192, 128)', + 'state-error': 'rgb(230, 126, 128)', + 'state-info': 'rgb(127, 187, 179)', + 'state-success': 'rgb(167, 192, 128)', + 'state-warning': 'rgb(219, 188, 127)', + surface: 'rgb(52, 63, 56)', + 'surface-foreground': 'rgb(211, 198, 170)', + white: 'rgb(255, 255, 255)', + }, + mode: 'dark', +}; diff --git a/src/shared/themes/everforest-light/everforest-light.ts b/src/shared/themes/everforest-light/everforest-light.ts new file mode 100644 index 000000000..848d06b2b --- /dev/null +++ b/src/shared/themes/everforest-light/everforest-light.ts @@ -0,0 +1,28 @@ +import { AppThemeConfiguration } from '/@/shared/themes/app-theme-types'; + +export const everforestLight: AppThemeConfiguration = { + app: { + 'overlay-header': + 'linear-gradient(transparent 0%, rgb(253 246 227 / 85%) 100%), var(--theme-background-noise)', + 'overlay-subheader': + 'linear-gradient(180deg, rgb(253 246 227 / 5%) 0%, var(--theme-colors-background) 100%), var(--theme-background-noise)', + 'scrollbar-handle-background': 'rgba(90, 107, 78, 20%)', + 'scrollbar-handle-hover-background': 'rgba(90, 107, 78, 40%)', + }, + colors: { + background: 'rgb(253, 246, 227)', + 'background-alternate': 'rgb(237, 230, 211)', + black: 'rgb(0, 0, 0)', + foreground: 'rgb(92, 103, 76)', + 'foreground-muted': 'rgb(131, 145, 112)', + primary: 'rgb(141, 165, 96)', + 'state-error': 'rgb(241, 103, 98)', + 'state-info': 'rgb(59, 145, 152)', + 'state-success': 'rgb(141, 165, 96)', + 'state-warning': 'rgb(223, 163, 59)', + surface: 'rgb(237, 230, 211)', + 'surface-foreground': 'rgb(92, 103, 76)', + white: 'rgb(255, 255, 255)', + }, + mode: 'light', +};