From abbaf3018b8d1ef3e3a07a724e2a78ad4ded64ff Mon Sep 17 00:00:00 2001 From: Nils Pukropp Date: Wed, 18 Feb 2026 07:18:48 +0100 Subject: [PATCH] added t0p themes --- .../api/migrations/0022_alter_user_theme.py | 18 +++++ backend/api/models.py | 6 ++ frontend/src/pages/Settings.tsx | 6 ++ frontend/src/theme.ts | 65 ++++++++++++++++++- 4 files changed, 93 insertions(+), 2 deletions(-) create mode 100644 backend/api/migrations/0022_alter_user_theme.py diff --git a/backend/api/migrations/0022_alter_user_theme.py b/backend/api/migrations/0022_alter_user_theme.py new file mode 100644 index 0000000..2ee3336 --- /dev/null +++ b/backend/api/migrations/0022_alter_user_theme.py @@ -0,0 +1,18 @@ +# Generated by Django 6.0.2 on 2026-02-18 06:18 + +from django.db import migrations, models + + +class Migration(migrations.Migration): + + dependencies = [ + ('api', '0021_alter_user_theme'), + ] + + operations = [ + migrations.AlterField( + model_name='user', + name='theme', + field=models.CharField(choices=[('holy_light', 'Holy Light'), ('holy_dark', 'Holy Dark'), ('latte', 'Catppuccin Latte'), ('frappe', 'Catppuccin Frappé'), ('macchiato', 'Catppuccin Macchiato'), ('mocha', 'Catppuccin Mocha'), ('pink_pastel', 'Pink Pastel'), ('mint_pastel', 'Mint Pastel'), ('lavender_pastel', 'Lavender Pastel'), ('dracula', 'Dracula'), ('nord', 'Nordic Frost'), ('gruvbox', 'Gruvbox Retro'), ('oceanic', 'Oceanic Deep'), ('t0p_sai', 'SAI (T0P)'), ('t0p_trench', 'Trench (T0P)'), ('t0p_blurryface', 'Blurryface (T0P)'), ('t0p_clancy', 'Clancy (T0P)')], default='holy_light', max_length=20), + ), + ] diff --git a/backend/api/models.py b/backend/api/models.py index bcb0fed..37f42ab 100644 --- a/backend/api/models.py +++ b/backend/api/models.py @@ -11,10 +11,16 @@ class User(AbstractUser): ('macchiato', 'Catppuccin Macchiato'), ('mocha', 'Catppuccin Mocha'), ('pink_pastel', 'Pink Pastel'), + ('mint_pastel', 'Mint Pastel'), + ('lavender_pastel', 'Lavender Pastel'), ('dracula', 'Dracula'), ('nord', 'Nordic Frost'), ('gruvbox', 'Gruvbox Retro'), ('oceanic', 'Oceanic Deep'), + ('t0p_sai', 'SAI (T0P)'), + ('t0p_trench', 'Trench (T0P)'), + ('t0p_blurryface', 'Blurryface (T0P)'), + ('t0p_clancy', 'Clancy (T0P)'), ] LANGUAGE_CHOICES = [ ('en', 'English'), diff --git a/frontend/src/pages/Settings.tsx b/frontend/src/pages/Settings.tsx index cc37bea..7c037a9 100644 --- a/frontend/src/pages/Settings.tsx +++ b/frontend/src/pages/Settings.tsx @@ -225,6 +225,9 @@ const Settings: React.FC = ({ themeName, onThemeChange }) => { Light Themes Catppuccin Latte Pink Pastel + Mint Pastel + Lavender Pastel + Scaled and Icy (T0P) @@ -236,6 +239,9 @@ const Settings: React.FC = ({ themeName, onThemeChange }) => { Nordic Frost Gruvbox Retro Oceanic Deep + Trench (T0P) + Blurryface (T0P) + Clancy (T0P) diff --git a/frontend/src/theme.ts b/frontend/src/theme.ts index 0c6f089..ffd25e9 100644 --- a/frontend/src/theme.ts +++ b/frontend/src/theme.ts @@ -4,10 +4,11 @@ import { flavors } from '@catppuccin/palette'; export type CatppuccinTheme = | 'holy_light' | 'holy_dark' | 'latte' | 'frappe' | 'macchiato' | 'mocha' - | 'pink_pastel' | 'dracula' | 'nord' | 'gruvbox' | 'oceanic'; + | 'pink_pastel' | 'mint_pastel' | 'lavender_pastel' | 'dracula' | 'nord' | 'gruvbox' | 'oceanic' + | 't0p_sai' | 't0p_trench' | 't0p_blurryface' | 't0p_clancy'; export const isLightTheme = (mode: CatppuccinTheme): boolean => { - return ['holy_light', 'latte', 'pink_pastel'].includes(mode); + return ['holy_light', 'latte', 'pink_pastel', 'mint_pastel', 'lavender_pastel', 't0p_sai'].includes(mode); }; export const getTheme = (mode: CatppuccinTheme) => { @@ -47,6 +48,66 @@ export const getTheme = (mode: CatppuccinTheme) => { primary: { hex: '#fb7185' }, secondary: { hex: '#2dd4bf' }, }; + } else if (mode === 'mint_pastel') { + palette = { + base: { hex: '#f0fdf4' }, + surface0: { hex: '#ffffff' }, + crust: { hex: '#dcfce7' }, + text: { hex: '#14532d' }, + subtext0: { hex: '#16a34a' }, + primary: { hex: '#4ade80' }, + secondary: { hex: '#fb7185' }, + }; + } else if (mode === 'lavender_pastel') { + palette = { + base: { hex: '#f5f3ff' }, + surface0: { hex: '#ffffff' }, + crust: { hex: '#ede9fe' }, + text: { hex: '#4c1d95' }, + subtext0: { hex: '#7c3aed' }, + primary: { hex: '#8b5cf6' }, + secondary: { hex: '#facc15' }, + }; + } else if (mode === 't0p_sai') { + palette = { + base: { hex: '#ffffff' }, + surface0: { hex: '#f8f8f8' }, + crust: { hex: '#e8e8e8' }, + text: { hex: '#231f20' }, + subtext0: { hex: '#666666' }, + primary: { hex: '#00d7ff' }, // Sai Cyan + secondary: { hex: '#ff8ad8' }, // Sai Pink + }; + } else if (mode === 't0p_trench') { + palette = { + base: { hex: '#1a1a1a' }, + surface0: { hex: '#242424' }, + crust: { hex: '#000000' }, + text: { hex: '#fce300' }, // Trench Yellow + subtext0: { hex: '#a0a0a0' }, + primary: { hex: '#fce300' }, + secondary: { hex: '#4b5320' }, // Olive + }; + } else if (mode === 't0p_blurryface') { + palette = { + base: { hex: '#000000' }, + surface0: { hex: '#1a1a1a' }, + crust: { hex: '#000000' }, + text: { hex: '#ffffff' }, + subtext0: { hex: '#e31e24' }, + primary: { hex: '#e31e24' }, // BF Red + secondary: { hex: '#ffffff' }, + }; + } else if (mode === 't0p_clancy') { + palette = { + base: { hex: '#000000' }, + surface0: { hex: '#121212' }, + crust: { hex: '#000000' }, + text: { hex: '#ffffff' }, + subtext0: { hex: '#fce300' }, + primary: { hex: '#e31e24' }, // Clancy Red + secondary: { hex: '#fce300' }, // Clancy Yellow + }; } else if (mode === 'dracula') { palette = { base: { hex: '#282a36' },