Skip to content

Commit 31290be

Browse files
Add Catpuccin Latte Theme (#7943)
* feat: add catppuccin latte theme * add case to index.js * remove metadata from svg * fix alphabet order * remove colors that don't conform to WCAG 4.5:1 * Update src/renderer/themes.css Co-authored-by: efb4f5ff-1298-471a-8973-3d47447115dc <73130443+efb4f5ff-1298-471a-8973-3d47447115dc@users.noreply.github.com> * set scrollbar-color --------- Co-authored-by: efb4f5ff-1298-471a-8973-3d47447115dc <73130443+efb4f5ff-1298-471a-8973-3d47447115dc@users.noreply.github.com>
1 parent eff85a5 commit 31290be

File tree

10 files changed

+76
-2
lines changed

10 files changed

+76
-2
lines changed
Lines changed: 1 addition & 0 deletions
Loading
Lines changed: 1 addition & 0 deletions
Loading
Lines changed: 1 addition & 0 deletions
Loading
Lines changed: 1 addition & 0 deletions
Loading

src/main/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -930,6 +930,8 @@ function runApp() {
930930
return '#fdf6e3'
931931
case 'everforest-light-low':
932932
return '#f3ead3'
933+
case 'catppuccin-latte':
934+
return '#eff1f5'
933935
case 'system':
934936
default:
935937
return nativeTheme.shouldUseDarkColors ? '#212121' : '#f1f1f1'

src/renderer/components/ThemeSettings.vue

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -128,6 +128,7 @@ const BASE_THEME_VALUES = [
128128
'pastelPink',
129129
// Third group
130130
'catppuccinFrappe',
131+
'catppuccinLatte',
131132
'catppuccinMocha',
132133
'dracula',
133134
'everforestDarkHard',
@@ -154,6 +155,7 @@ const baseThemeNames = computed(() => [
154155
t('Settings.Theme Settings.Base Theme.Pastel Pink'),
155156
// Third group
156157
t('Settings.Theme Settings.Base Theme.Catppuccin Frappe'),
158+
t('Settings.Theme Settings.Base Theme.Catppuccin Latte'),
157159
t('Settings.Theme Settings.Base Theme.Catppuccin Mocha'),
158160
t('Settings.Theme Settings.Base Theme.Dracula'),
159161
t('Settings.Theme Settings.Base Theme.Everforest Dark Hard'),

src/renderer/composables/colors.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,8 @@ export function useColorTranslations() {
3535
t('Settings.Theme Settings.Main Color Theme.Catppuccin Frappe Sapphire'),
3636
t('Settings.Theme Settings.Main Color Theme.Catppuccin Frappe Blue'),
3737
t('Settings.Theme Settings.Main Color Theme.Catppuccin Frappe Lavender'),
38+
t('Settings.Theme Settings.Main Color Theme.Catppuccin Latte Mauve'),
39+
t('Settings.Theme Settings.Main Color Theme.Catppuccin Latte Red'),
3840
t('Settings.Theme Settings.Main Color Theme.Catppuccin Mocha Rosewater'),
3941
t('Settings.Theme Settings.Main Color Theme.Catppuccin Mocha Flamingo'),
4042
t('Settings.Theme Settings.Main Color Theme.Catppuccin Mocha Pink'),

src/renderer/helpers/colors.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ export const colors = [
3333
{ name: 'CatppuccinFrappeSapphire', value: '#85c1dc' },
3434
{ name: 'CatppuccinFrappeBlue', value: '#8caaee' },
3535
{ name: 'CatppuccinFrappeLavender', value: '#babbf1' },
36+
{ name: 'CatppuccinLatteMauve', value: '#8839ef' },
37+
{ name: 'CatppuccinLatteRed', value: '#d20f39' },
3638
{ name: 'CatppuccinMochaRosewater', value: '#F5E0DC' },
3739
{ name: 'CatppuccinMochaFlamingo', value: '#F2CDCD' },
3840
{ name: 'CatppuccinMochaPink', value: '#F5C2E7' },

src/renderer/themes.css

Lines changed: 61 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,8 @@ it can be safely elided. This looks quite pleasant on this theme. */
133133
.everforestLightMedium,
134134
.everforestLightLow,
135135
.gruvboxLight,
136-
.solarizedLight {
136+
.solarizedLight,
137+
.catppuccinLatte {
137138
--primary-shadow-color: rgb(255 255 255 / 75%);
138139
}
139140

@@ -538,6 +539,25 @@ it can be safely elided. This looks quite pleasant on this theme. */
538539
--logo-text: url('../../_icons/textEverforestDarkLowSmall.svg');
539540
}
540541

542+
.catppuccinLatte {
543+
--primary-text-color: #4c4f69;
544+
--secondary-text-color: #4c4f69;
545+
--tertiary-text-color: #6c6f85;
546+
--title-color: #4c4f69;
547+
--bg-color: #eff1f5;
548+
--favorite-icon-color: #0f0;
549+
--card-bg-color: #e6e9ef;
550+
--secondary-card-bg-color: #eff1f5;
551+
--scrollbar-color: #ccd0da;
552+
--scrollbar-color-hover: #bdbdbd;
553+
--side-nav-color: #e6e9ef;
554+
--side-nav-hover-color: #dce0e8;
555+
--side-nav-active-color: #dce0e8;
556+
--search-bar-color: #ccd0da;
557+
--logo-icon: url('../../_icons/iconCatppuccinLatteDarkSmall.svg');
558+
--logo-text: url('../../_icons/textCatppuccinLatteDarkSmall.svg');
559+
}
560+
541561
/*************** PRIMARY THEME COLOR DEFINTIONS ***************/
542562

543563
.mainRed,
@@ -980,7 +1000,6 @@ it can be safely elided. This looks quite pleasant on this theme. */
9801000
--logo-text-bar-color: url('../../_icons/textGruvboxDarkSmall.svg');
9811001
}
9821002

983-
9841003
.mainCatppuccinFrappeRosewater,
9851004
.mainCatppuccinFrappeFlamingo,
9861005
.mainCatppuccinFrappePink,
@@ -1187,6 +1206,25 @@ it can be safely elided. This looks quite pleasant on this theme. */
11871206
--primary-color-active: #a63f9a;
11881207
}
11891208

1209+
.mainCatppuccinLatteMauve,
1210+
.mainCatppuccinLatteRed {
1211+
--text-with-main-color: #fff;
1212+
--logo-icon-bar-color: url('../../_icons/iconCatppuccinLatteLightSmall.svg');
1213+
--logo-text-bar-color: url('../../_icons/textCatppuccinLatteLightSmall.svg');
1214+
}
1215+
1216+
.mainCatppuccinLatteMauve {
1217+
--primary-color: #8839ef;
1218+
--primary-color-hover: #9f5cf1;
1219+
--primary-color-active: #6c28ce;
1220+
}
1221+
1222+
.mainCatppuccinLatteRed {
1223+
--primary-color: #d20f39;
1224+
--primary-color-hover: #dd385c;
1225+
--primary-color-active: #a60c2d;
1226+
}
1227+
11901228
/*************** SECONDARY THEME COLOR DEFINTIONS ***************/
11911229

11921230
/* dark secondary theme colors */
@@ -1987,6 +2025,27 @@ it can be safely elided. This looks quite pleasant on this theme. */
19872025
--accent-color-visited: #c84f9a;
19882026
}
19892027

2028+
.secCatppuccinLatteMauve,
2029+
.secCatppuccinLatteRed {
2030+
--text-with-accent-color: #fff;
2031+
}
2032+
2033+
.secCatppuccinLatteMauve {
2034+
--accent-color-rgb: 136 57 239;
2035+
--accent-color-hover: #9f5cf1;
2036+
--accent-color-active: #7129d2;
2037+
--accent-color-light: #b076f8;
2038+
--accent-color-visited: #6021a9;
2039+
}
2040+
2041+
.secCatppuccinLatteRed {
2042+
--accent-color-rgb: 210 15 57;
2043+
--accent-color-hover: #dd385c;
2044+
--accent-color-active: #ad0c2e;
2045+
--accent-color-light: #e64e71;
2046+
--accent-color-visited: #810922;
2047+
}
2048+
19902049
/*************** DESTRUCTIVE THEME COLOR OVERRIDES ***************/
19912050

19922051
/* stylelint-disable no-descending-specificity */

static/locales/en-US.yaml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -334,6 +334,7 @@ Settings:
334334
Light: Light
335335
Dracula: Dracula
336336
Catppuccin Frappe: Catppuccin Frappe
337+
Catppuccin Latte: Catppuccin Latte
337338
Catppuccin Mocha: Catppuccin Mocha
338339
Pastel Pink: Pastel Pink
339340
Hot Pink: Hot Pink
@@ -387,6 +388,8 @@ Settings:
387388
Catppuccin Frappe Sapphire: Catppuccin Frappe Sapphire
388389
Catppuccin Frappe Blue: Catppuccin Frappe Blue
389390
Catppuccin Frappe Lavender: Catppuccin Frappe Lavender
391+
Catppuccin Latte Mauve: Catppuccin Latte Mauve
392+
Catppuccin Latte Red: Catppuccin Latte Red
390393
Catppuccin Mocha Rosewater: Catppuccin Mocha Rosewater
391394
Catppuccin Mocha Flamingo: Catppuccin Mocha Flamingo
392395
Catppuccin Mocha Pink: Catppuccin Mocha Pink

0 commit comments

Comments
 (0)