diff --git a/_icons/iconNordicLightSmall.png b/_icons/iconNordicLightSmall.png new file mode 100644 index 000000000..bbde3fca7 Binary files /dev/null and b/_icons/iconNordicLightSmall.png differ diff --git a/_icons/textNordicLightSmall.png b/_icons/textNordicLightSmall.png new file mode 100644 index 000000000..bc00a5898 Binary files /dev/null and b/_icons/textNordicLightSmall.png differ diff --git a/src/main/index.js b/src/main/index.js index 23b561cee..2f8944c88 100644 --- a/src/main/index.js +++ b/src/main/index.js @@ -493,6 +493,8 @@ function runApp() { return '#ffd1dc' case 'hot-pink': return '#de1c85' + case 'nordic': + return '#2b2f3a' case 'system': default: return nativeTheme.shouldUseDarkColors ? '#212121' : '#f1f1f1' diff --git a/src/renderer/components/theme-settings/theme-settings.js b/src/renderer/components/theme-settings/theme-settings.js index 090a6dc89..e3e9c95f7 100644 --- a/src/renderer/components/theme-settings/theme-settings.js +++ b/src/renderer/components/theme-settings/theme-settings.js @@ -37,7 +37,8 @@ export default defineComponent({ 'dracula', 'catppuccinMocha', 'pastelPink', - 'hotPink' + 'hotPink', + 'nordic' ] } }, @@ -102,7 +103,8 @@ export default defineComponent({ this.$t('Settings.Theme Settings.Base Theme.Dracula'), this.$t('Settings.Theme Settings.Base Theme.Catppuccin Mocha'), this.$t('Settings.Theme Settings.Base Theme.Pastel Pink'), - this.$t('Settings.Theme Settings.Base Theme.Hot Pink') + this.$t('Settings.Theme Settings.Base Theme.Hot Pink'), + this.$t('Settings.Theme Settings.Base Theme.Nordic') ] }, diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 0e6ddecf4..fd100cc5f 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -5,7 +5,8 @@ .dracula, .catppuccinMocha, .pastelPink, -.hotPink { +.hotPink, +.nordic { --primary-input-color: rgba(0, 0, 0, 0.50); } @@ -15,7 +16,8 @@ .dracula, .catppuccinMocha, .pastelPink, -.hotPink { +.hotPink, +.nordic { --link-color: var(--accent-color); --link-visited-color: var(--accent-color-visited); --instance-menu-color: var(--search-bar-color); @@ -27,7 +29,8 @@ .gray, .dracula, .catppuccinMocha, -.pastelPink { +.pastelPink, +.nordic { --primary-input-color: rgba(0, 0, 0, 0.50); --side-nav-hover-text-color: var(--primary-text-color); } @@ -37,7 +40,8 @@ .black, .gray, .dracula, -.catppuccinMocha { +.catppuccinMocha, +.nordic { --side-nav-active-text-color: var(--primary-text-color); --scrollbar-text-color-hover: var(--primary-text-color); @@ -56,7 +60,8 @@ .gray, .dracula, .catppuccinMocha, -.hotPink { +.hotPink, +.nordic { --primary-shadow-color: rgba(0, 0, 0, 0.75); } @@ -237,6 +242,25 @@ it can be safely elided. This looks quite pleasant on this theme. */ text-decoration: underline; } +.nordic { + --primary-text-color: #EEEEEE; + --secondary-text-color: #ddd; + --tertiary-text-color: #EEEEEE; + --title-color: #EEEEEE; + --bg-color: #2b2f3a; + --favorite-icon-color: #FFEA00; + --card-bg-color: #2e3440; + --secondary-card-bg-color: rgba(59, 66, 82, 0.75); + --scrollbar-color: #4b566a; + --scrollbar-color-hover: #4b566a; + --side-nav-color: #2e3440; + --side-nav-hover-color: #3b4252; + --side-nav-active-color: #3b4252; + --search-bar-color: #4b566a; + --logo-icon: url("../../_icons/iconNordicLightSmall.png"); + --logo-text: url("../../_icons/textNordicLightSmall.png"); +} + .mainRed, .mainPink, .mainPurple, diff --git a/static/locales/en-US.yaml b/static/locales/en-US.yaml index b8fc52b81..0289cf6a4 100644 --- a/static/locales/en-US.yaml +++ b/static/locales/en-US.yaml @@ -296,6 +296,7 @@ Settings: Catppuccin Mocha: Catppuccin Mocha Pastel Pink: Pastel Pink Hot Pink: Hot Pink + Nordic: Nordic Main Color Theme: Main Color Theme: Main Color Theme Red: Red