From 55451c17d3e83169fc346e75db11c4722abcc320 Mon Sep 17 00:00:00 2001 From: "whey.party" Date: Mon, 1 Dec 2025 08:46:22 +0100 Subject: [PATCH] red dwarf color scheme --- src/alf/index.tsx | 5 +- src/alf/themes.ts | 245 ++++++++------------ src/screens/Settings/AppearanceSettings.tsx | 4 +- src/state/persisted/schema.ts | 1 + 4 files changed, 99 insertions(+), 156 deletions(-) diff --git a/src/alf/index.tsx b/src/alf/index.tsx index 8b66032f6..d48a2f3d2 100644 --- a/src/alf/index.tsx +++ b/src/alf/index.tsx @@ -13,10 +13,11 @@ import { blackskyscheme, blueskyscheme, deerscheme, + kittyscheme, + reddwarfscheme, themes, witchskyscheme, zeppelinscheme, - kittyscheme, } from '#/alf/themes' import {type Device} from '#/storage' @@ -81,6 +82,8 @@ export function selectScheme(colorScheme: string | undefined): SchemeType { return zeppelinscheme case 'kitty': return kittyscheme + case 'reddwarf': + return reddwarfscheme default: return themes } diff --git a/src/alf/themes.ts b/src/alf/themes.ts index 5c09e3c32..8ffe4ff6b 100644 --- a/src/alf/themes.ts +++ b/src/alf/themes.ts @@ -301,160 +301,6 @@ export const themes = { export const witchskyscheme = themes -// const BLUESKY_THEMES = createThemes({ -// defaultPalette: BLUESKY_PALETTE, -// subduedPalette: BLUESKY_SUBDUED_PALETTE, -// }) - -// export const blueskyscheme = { -// lightPalette: BLUESKY_THEMES.light.palette, -// darkPalette: BLUESKY_THEMES.dark.palette, -// dimPalette: BLUESKY_THEMES.dim.palette, -// light: BLUESKY_THEMES.light, -// dark: BLUESKY_THEMES.dark, -// dim: BLUESKY_THEMES.dim, -// } -// export const YELLOW_PALETTE: Palette = { -// white: '#FEFBFB', -// black: '#000000', -// like: '#dd5e8f', - -// contrast_0: '#FEFBFB', -// contrast_25: '#F8F6EB', -// contrast_50: '#F2EDD8', -// contrast_100: '#E9E3C1', -// contrast_200: '#E0D9AA', -// contrast_300: '#D6CF94', -// contrast_400: '#CBC47F', -// contrast_500: '#C0B96B', -// contrast_600: '#A49D59', -// contrast_700: '#888249', -// contrast_800: '#6D683A', -// contrast_900: '#544F2C', -// contrast_950: '#3E391F', -// contrast_975: '#262413', -// contrast_1000: '#000000', - -// primary_25: `hsl(50, 70%, 97%)`, -// primary_50: `hsl(50, 70%, 94%)`, -// primary_100: `hsl(50, 70%, 88%)`, -// primary_200: `hsl(50, 75%, 78%)`, -// primary_300: `hsl(50, 78%, 68%)`, -// primary_400: `hsl(50, 82%, 58%)`, -// primary_500: `hsl(50, 85%, 52%)`, -// primary_600: `hsl(50, 80%, 46%)`, -// primary_700: `hsl(50, 60%, 33%)`, -// primary_800: `hsl(50, 48%, 26%)`, -// primary_900: `hsl(50, 45%, 18%)`, -// primary_950: `hsl(50, 40%, 10%)`, -// primary_975: `hsl(50, 38%, 7%)`, - -// positive_25: '#F3FCEB', -// positive_50: '#E8F9D5', -// positive_100: '#D4F4AE', -// positive_200: '#BEED81', -// positive_300: '#A4E34D', -// positive_400: '#8FD61E', -// positive_500: '#7AB815', -// positive_600: '#629412', -// positive_700: '#4E720F', -// positive_800: '#3C560C', -// positive_900: '#2D4109', -// positive_950: '#203006', -// positive_975: '#162204', - -// negative_25: '#FFF7EB', -// negative_50: '#FEEBD3', -// negative_100: '#FDDBB3', -// negative_200: '#FBC68B', -// negative_300: '#F7A44E', -// negative_400: '#EF8217', -// negative_500: '#D86E0F', -// negative_600: '#B55B0D', -// negative_700: '#8E480A', -// negative_800: '#6C3708', -// negative_900: '#4F2906', -// negative_950: '#371D04', -// negative_975: '#261403', -// } - -// export const YELLOW_SUBDUED_PALETTE: Palette = { -// white: '#FEFBFB', -// black: '#383434', -// like: '#dd5e8f', - -// contrast_0: '#FEFBFB', -// contrast_25: '#F8F6EB', -// contrast_50: '#F2EDD8', -// contrast_100: '#E9E3C1', -// contrast_200: '#E0D9AA', -// contrast_300: '#D6CF94', -// contrast_400: '#CBC47F', -// contrast_500: '#C0B96B', -// contrast_600: '#A49D59', -// contrast_700: '#888249', -// contrast_800: '#6D683A', -// contrast_900: '#544F2C', -// contrast_950: '#3E391F', -// contrast_975: '#312F1A', -// contrast_1000: '#262414', - -// primary_25: `hsl(50, 70%, 97%)`, -// primary_50: `hsl(50, 70%, 94%)`, -// primary_100: `hsl(50, 70%, 88%)`, -// primary_200: `hsl(50, 75%, 78%)`, -// primary_300: `hsl(50, 78%, 68%)`, -// primary_400: `hsl(50, 78%, 62%)`, -// primary_500: `hsl(50, 75%, 52%)`, -// primary_600: `hsl(50, 70%, 46%)`, -// primary_700: `hsl(50, 58%, 40%)`, -// primary_800: `hsl(50, 48%, 26%)`, -// primary_900: `hsl(50, 45%, 18%)`, -// primary_950: `hsl(50, 40%, 10%)`, -// primary_975: `hsl(50, 38%, 7%)`, - -// positive_25: '#F3FCEB', -// positive_50: '#EAF9DA', -// positive_100: '#D6F4B3', -// positive_200: '#C0ED87', -// positive_300: '#A8E45A', -// positive_400: '#94D93B', -// positive_500: '#7FBE2E', -// positive_600: '#659C25', -// positive_700: '#517B1D', -// positive_800: '#405F17', -// positive_900: '#314812', -// positive_950: '#23350C', -// positive_975: '#1A2709', - -// negative_25: '#FFF7EB', -// negative_50: '#FEEFE0', -// negative_100: '#FDE2C6', -// negative_200: '#FBCDA1', -// negative_300: '#F7AD68', -// negative_400: '#EF9140', -// negative_500: '#E0761F', -// negative_600: '#C06319', -// negative_700: '#995012', -// negative_800: '#75400E', -// negative_900: '#58300A', -// negative_950: '#3E2107', -// negative_975: '#2D1805', -// } - -// const YELLOW_THEMES = createThemes({ -// defaultPalette: YELLOW_PALETTE, -// subduedPalette: YELLOW_SUBDUED_PALETTE, -// }) - -// export const yellowscheme = { -// lightPalette: YELLOW_THEMES.light.palette, -// darkPalette: YELLOW_THEMES.dark.palette, -// dimPalette: YELLOW_THEMES.dim.palette, -// light: YELLOW_THEMES.light, -// dark: YELLOW_THEMES.dark, -// dim: YELLOW_THEMES.dim, -// } export const BLACKSKY_BRAND = { /* Neutrals */ black: '#070C0C', @@ -1131,6 +977,97 @@ export const kittyscheme = { dim: KITTY_THEMES.dim, } +const REDDWARF_TAILWIND_ATOMS = { + color_gray_25: '#fffbf9', + color_gray_50: '#fff7f5', + color_gray_100: '#fff0ee', + color_gray_200: '#f8e2de', + color_gray_300: '#eaccc7', + color_gray_400: '#bd948e', + color_gray_500: '#93655f', + color_gray_600: '#714842', + color_gray_700: '#5b342f', + color_gray_800: '#401d19', + color_gray_900: '#2c0c09', + color_gray_950: '#180000', + color_gray_970: '#0e0000', +} + +const REDDWARF_TAILWIND_ATOMS_VIBRANT = { + ...REDDWARF_TAILWIND_ATOMS, + color_gray_500: '#c14c42', +} + +export const REDDWARF_SUBDUED_PALETTE: Palette = { + ...DEFAULT_SUBDUED_PALETTE, + white: '#FFFFFF', + black: '#000000', + like: '#FF6B6B', + + contrast_0: REDDWARF_TAILWIND_ATOMS.color_gray_50, + contrast_25: REDDWARF_TAILWIND_ATOMS.color_gray_50, + contrast_50: REDDWARF_TAILWIND_ATOMS.color_gray_100, + contrast_100: REDDWARF_TAILWIND_ATOMS.color_gray_200, + contrast_200: REDDWARF_TAILWIND_ATOMS.color_gray_200, + contrast_300: REDDWARF_TAILWIND_ATOMS.color_gray_300, + contrast_400: REDDWARF_TAILWIND_ATOMS.color_gray_400, + contrast_500: REDDWARF_TAILWIND_ATOMS.color_gray_500, + contrast_600: REDDWARF_TAILWIND_ATOMS.color_gray_500, + contrast_700: REDDWARF_TAILWIND_ATOMS.color_gray_600, + contrast_800: REDDWARF_TAILWIND_ATOMS.color_gray_600, + contrast_900: REDDWARF_TAILWIND_ATOMS.color_gray_700, + contrast_950: REDDWARF_TAILWIND_ATOMS.color_gray_800, + contrast_975: REDDWARF_TAILWIND_ATOMS.color_gray_900, + contrast_1000: REDDWARF_TAILWIND_ATOMS.color_gray_900, + + primary_25: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_50, + primary_50: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_100, + primary_100: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_200, + primary_200: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_200, + primary_300: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_300, + primary_400: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_400, + primary_500: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_500, + primary_600: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_600, + primary_700: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_600, + primary_800: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_700, + primary_900: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_700, + primary_950: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_800, + primary_975: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_900, +} + +export const REDDWARF_PALETTE: Palette = { + ...REDDWARF_SUBDUED_PALETTE, + contrast_1000: REDDWARF_TAILWIND_ATOMS.color_gray_950, + + primary_25: REDDWARF_TAILWIND_ATOMS.color_gray_50, + primary_50: REDDWARF_TAILWIND_ATOMS.color_gray_100, + primary_100: REDDWARF_TAILWIND_ATOMS.color_gray_200, + primary_200: REDDWARF_TAILWIND_ATOMS.color_gray_200, + primary_300: REDDWARF_TAILWIND_ATOMS.color_gray_300, + primary_400: REDDWARF_TAILWIND_ATOMS.color_gray_400, + primary_500: REDDWARF_TAILWIND_ATOMS_VIBRANT.color_gray_500, + primary_600: REDDWARF_TAILWIND_ATOMS.color_gray_600, + primary_700: REDDWARF_TAILWIND_ATOMS.color_gray_600, + primary_800: REDDWARF_TAILWIND_ATOMS.color_gray_700, + primary_900: REDDWARF_TAILWIND_ATOMS.color_gray_700, + primary_950: REDDWARF_TAILWIND_ATOMS.color_gray_800, + primary_975: REDDWARF_TAILWIND_ATOMS.color_gray_900, +} + +const REDDWARF_THEMES = createThemes({ + defaultPalette: REDDWARF_PALETTE, + subduedPalette: REDDWARF_SUBDUED_PALETTE, +}) + +export const reddwarfscheme = { + lightPalette: REDDWARF_THEMES.light.palette, + darkPalette: REDDWARF_THEMES.dark.palette, + dimPalette: REDDWARF_THEMES.dim.palette, + light: REDDWARF_THEMES.light, + dark: REDDWARF_THEMES.dark, + dim: REDDWARF_THEMES.dim, +} + /** * @deprecated use ALF and access palette from `useTheme()` */ diff --git a/src/screens/Settings/AppearanceSettings.tsx b/src/screens/Settings/AppearanceSettings.tsx index 932b85b1a..5bd0a7b02 100644 --- a/src/screens/Settings/AppearanceSettings.tsx +++ b/src/screens/Settings/AppearanceSettings.tsx @@ -54,7 +54,8 @@ export function AppearanceSettingsScreen({}: Props) { | 'blacksky' | 'deer' | 'zeppelin' - | 'kitty', + | 'kitty' + | 'reddwarf', ) => { setColorScheme(value) }, @@ -89,6 +90,7 @@ export function AppearanceSettingsScreen({}: Props) { {name: 'deer', label: _(msg`Deer`)}, {name: 'zeppelin', label: _(msg`Zeppelin`)}, {name: 'kitty', label: _(msg`Kitty`)}, + {name: 'reddwarf', label: _(msg`RedDwarf`)}, ] return ( diff --git a/src/state/persisted/schema.ts b/src/state/persisted/schema.ts index c8eded1cc..30c0e01d6 100644 --- a/src/state/persisted/schema.ts +++ b/src/state/persisted/schema.ts @@ -56,6 +56,7 @@ const schema = z.object({ 'deer', 'zeppelin', 'kitty', + 'reddwarf', ]), session: z.object({ accounts: z.array(accountSchema), -- 2.47.3