feat(themes): add Vision Dark & Vision Navy colorblind-safe themes (closes #166)

Purple & Gold palette (Deuteranopia / Protanopia / Tritanopia safe).
Vision Dark: near-black #0D0B12 + Gold #FFD700 (~14.7:1 WCAG AAA).
Vision Navy: deep navy #0A1628 + Gold #FFD700 (~14.5:1 WCAG AAA).
New 'Accessibility' group in ThemePicker.
Removed stale theme count from aboutFeatures across all locales.

This is an initial step toward colorblind accessibility — color variables
alone cannot cover all CVD use cases. Structural improvements (secondary
indicators, pattern/shape cues) are still needed in future iterations.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Psychotoxical
2026-04-12 18:44:29 +02:00
parent 7e50c7af40
commit a765bcd5d0
10 changed files with 121 additions and 8 deletions
+7
View File
@@ -123,6 +123,13 @@ export const THEME_GROUPS: { group: string; themes: ThemeDef[] }[] = [
{ id: 'powerslave', label: 'Powerslave (inspired)', bg: '#F0DFB0', card: '#2A1808', accent: '#C8960C' },
],
},
{
group: 'Accessibility',
themes: [
{ id: 'vision-dark', label: 'Vision Dark', bg: '#0d0b12', card: '#16131e', accent: '#ffd700' },
{ id: 'vision-navy', label: 'Vision Navy', bg: '#0a1628', card: '#112038', accent: '#ffd700' },
],
},
{
group: 'Social Media',
themes: [
+1 -1
View File
@@ -520,7 +520,7 @@ export const deTranslation = {
logout: 'Abmelden',
aboutTitle: 'Über Psysonic',
aboutDesc: 'Ein moderner Desktop-Musikplayer für Subsonic-kompatible Server (Navidrome, Gonic u. a.). Basiert auf Tauri v2 mit einer nativen Rust-Audio-Engine — schlank und schnell, aber vollgepackt mit Features: Wellenform-Seekbar, synchronisierte Lyrics, Last.fm-Integration, 10-Band-EQ, Crossfade, nahtlose Wiedergabe, Replay Gain, Genre-Browser und eine große Theme-Bibliothek.',
aboutFeatures: 'Multi-Server · Last.fm Scrobbling & Love · Vollbild Ambient Stage · Wellenform-Seek · Sync-Lyrics · 10-Band-EQ · Crossfade & Gapless · Replay Gain · Genres · 63 Themes · 5 Sprachen',
aboutFeatures: 'Multi-Server · Last.fm Scrobbling & Love · Vollbild Ambient Stage · Wellenform-Seek · Sync-Lyrics · 10-Band-EQ · Crossfade & Gapless · Replay Gain · Genres · 8 Sprachen',
aboutLicense: 'Lizenz',
aboutLicenseText: 'GNU GPL v3 — kostenlos nutzbar, veränderbar und unter gleicher Lizenz weiterzugeben.',
aboutRepo: 'Quellcode auf GitHub',
+1 -1
View File
@@ -522,7 +522,7 @@ export const enTranslation = {
logout: 'Logout',
aboutTitle: 'About Psysonic',
aboutDesc: 'A modern desktop music player for Subsonic-compatible servers (Navidrome, Gonic, and others). Built on Tauri v2 with a native Rust audio engine — lightweight and fast, yet packed with features: waveform seekbar, synchronized lyrics, Last.fm integration, 10-band EQ, crossfade, gapless playback, Replay Gain, genre browsing, and a large library of themes.',
aboutFeatures: 'Multi-server · Last.fm scrobbling & love · Fullscreen Ambient Stage · Waveform seek · Synced lyrics · 10-band EQ · Crossfade & Gapless · Replay Gain · Genres · 63 themes · 8 languages',
aboutFeatures: 'Multi-server · Last.fm scrobbling & love · Fullscreen Ambient Stage · Waveform seek · Synced lyrics · 10-band EQ · Crossfade & Gapless · Replay Gain · Genres · 8 languages',
aboutLicense: 'License',
aboutLicenseText: 'GNU GPL v3 — free to use, modify, and distribute under the same license.',
aboutRepo: 'Source Code on GitHub',
+1 -1
View File
@@ -514,7 +514,7 @@ export const esTranslation = {
logout: 'Cerrar Sesión',
aboutTitle: 'Acerca de Psysonic',
aboutDesc: 'Un reproductor de música moderno para escritorio compatible con servidores Subsonic (Navidrome, Gonic y otros). Construido en Tauri v2 con motor de audio nativo en Rust — ligero y rápido, pero lleno de características: barra de progreso tipo onda, letras sincronizadas, integración Last.fm, ecualizador de 10 bandas, crossfade, reproducción gapless, Replay Gain, navegación por géneros, y una gran biblioteca de temas.',
aboutFeatures: 'Multi-servidor · Scrobbling Last.fm y favoritos · Escenario Ambiente Pantalla Completa · Barra de progreso onda · Letras sincronizadas · Ecualizador 10 bandas · Crossfade y Gapless · Replay Gain · Géneros · 63 temas · 8 idiomas',
aboutFeatures: 'Multi-servidor · Scrobbling Last.fm y favoritos · Escenario Ambiente Pantalla Completa · Barra de progreso onda · Letras sincronizadas · Ecualizador 10 bandas · Crossfade y Gapless · Replay Gain · Géneros · 8 idiomas',
aboutLicense: 'Licencia',
aboutLicenseText: 'GNU GPL v3 — libre para usar, modificar y distribuir bajo la misma licencia.',
aboutRepo: 'Código Fuente en GitHub',
+1 -1
View File
@@ -518,7 +518,7 @@ export const frTranslation = {
logout: 'Se déconnecter',
aboutTitle: 'À propos de Psysonic',
aboutDesc: 'Un lecteur de musique de bureau moderne pour les serveurs compatibles Subsonic (Navidrome, Gonic, et autres). Construit sur Tauri v2 avec un moteur audio Rust natif — léger et rapide, mais riche en fonctionnalités : barre waveform, paroles synchronisées, intégration Last.fm, égaliseur 10 bandes, crossfade, lecture sans blanc, Replay Gain, navigation par genre et une grande bibliothèque de thèmes.',
aboutFeatures: 'Multi-serveur · Scrobbling & love Last.fm · Ambient Stage plein écran · Waveform seek · Paroles synchro · EQ 10 bandes · Crossfade & Gapless · Replay Gain · Genres · 63 thèmes · 5 langues',
aboutFeatures: 'Multi-serveur · Scrobbling & love Last.fm · Ambient Stage plein écran · Waveform seek · Paroles synchro · EQ 10 bandes · Crossfade & Gapless · Replay Gain · Genres · 8 langues',
aboutLicense: 'Licence',
aboutLicenseText: 'GNU GPL v3 — libre d\'utilisation, de modification et de distribution sous la même licence.',
aboutRepo: 'Code source sur GitHub',
+1 -1
View File
@@ -517,7 +517,7 @@ export const nbTranslation = {
logout: 'Logg ut',
aboutTitle: 'Om Psysonic',
aboutDesc: 'En moderne musikkspiller for Subsonic-kompatible tjenere (Navidrome, Gonic og andre). Bygget på Tauri v2 med en innebygd Rust-lydmotor - lett og rask, men fullpakket med funksjoner: bølgeform-søkelinje, synkroniserte sangtekster, Last.fm-integrasjon, 10-bånds jevnstiller, crossfade, gapless-avspilling, Replay Gain, sjangerlesing og et stort bibliotek med temaer.',
aboutFeatures: 'Multi-tjener · Last.fm scrobbling og liker · Fullskjerm Ambient Stage · Bølgeformsøk · Synkroniserte tekster · 10-bånds jevnstiller · Crossfade og gapless · Replay Gain · Sjangre · 63 temaer · 6 språk',
aboutFeatures: 'Multi-tjener · Last.fm scrobbling og liker · Fullskjerm Ambient Stage · Bølgeformsøk · Synkroniserte tekster · 10-bånds jevnstiller · Crossfade og gapless · Replay Gain · Sjangre · 8 språk',
aboutLicense: 'Lisens',
aboutLicenseText: 'GNU GPL v3 - gratis å bruke, endre og distribuere under samme lisens.',
aboutRepo: 'Kildekode på GitHub',
+1 -1
View File
@@ -518,7 +518,7 @@ export const nlTranslation = {
logout: 'Uitloggen',
aboutTitle: 'Over Psysonic',
aboutDesc: 'Een moderne desktopmuziekspeeler voor Subsonic-compatibele servers (Navidrome, Gonic en anderen). Gebouwd op Tauri v2 met een native Rust audio-engine — licht en snel, maar boordevol functies: golfvorm-zoekbalk, gesynchroniseerde songteksten, Last.fm-integratie, 10-bands equalizer, crossfade, naadloos afspelen, Replay Gain, genres en een uitgebreide themabibliotheek.',
aboutFeatures: 'Multi-server · Last.fm scrobbling & love · Fullscreen Ambient Stage · Waveform seek · Syncteksten · 10-bands EQ · Crossfade & Gapless · Replay Gain · Genres · 63 thema\'s · 5 talen',
aboutFeatures: 'Multi-server · Last.fm scrobbling & love · Fullscreen Ambient Stage · Waveform seek · Syncteksten · 10-bands EQ · Crossfade & Gapless · Replay Gain · Genres · 8 talen',
aboutLicense: 'Licentie',
aboutLicenseText: 'GNU GPL v3 — vrij te gebruiken, wijzigen en verspreiden onder dezelfde licentie.',
aboutRepo: 'Broncode op GitHub',
+1 -1
View File
@@ -514,7 +514,7 @@ export const zhTranslation = {
logout: '退出登录',
aboutTitle: '关于 Psysonic',
aboutDesc: '适用于 Subsonic 兼容服务器(Navidrome、Gonic 等)的现代桌面音乐播放器。基于 Tauri v2 和原生 Rust 音频引擎构建——轻量快速,功能丰富:波形进度条、同步歌词、Last.fm 集成、10 段均衡器、交叉淡入淡出、无缝播放、响度增益、流派浏览以及大量精美主题。',
aboutFeatures: '多服务器 · Last.fm 记录 & 喜爱 · 全屏环境舞台 · 波形跳转 · 同步歌词 · 10 段 EQ · 交叉淡入淡出 & 无缝播放 · 响度增益 · 流派 · 63 个主题 · 5 种语言',
aboutFeatures: '多服务器 · Last.fm 记录 & 喜爱 · 全屏环境舞台 · 波形跳转 · 同步歌词 · 10 段 EQ · 交叉淡入淡出 & 无缝播放 · 响度增益 · 流派 · 8 种语言',
aboutLicense: '许可证',
aboutLicenseText: 'GNU GPL v3 — 在相同许可证下可自由使用、修改和分发。',
aboutRepo: 'GitHub 上的源代码',
+1 -1
View File
@@ -1,7 +1,7 @@
import { create } from 'zustand';
import { persist } from 'zustand/middleware';
type Theme = 'mocha' | 'macchiato' | 'frappe' | 'latte' | 'nord' | 'nord-snowstorm' | 'nord-frost' | 'nord-aurora' | 'psychowave' | 'wnamp' | 'poison' | 'nucleo' | 'muma-jukebox' | 'winmedplayer' | 'p-dvd' | 'vintage-tube-radio' | 'neon-drift' | 'aero-glass' | 'luna-teal' | 'w98' | 'cupertino-light' | 'cupertino-dark' | 'gruvbox-dark-hard' | 'gruvbox-dark-medium' | 'gruvbox-dark-soft' | 'gruvbox-light-hard' | 'gruvbox-light-medium' | 'gruvbox-light-soft' | 'spotless' | 'dzr0' | 'cupertino-beats' | 'lambda-17' | 'gw1' | 'grand-theft-audio' | 'v-tactical' | 'nightcity-2077' | 'middle-earth' | 'morpheus' | 'stark-hud' | 'blade' | 'heisenberg' | 'ice-and-fire' | 'doh-matic' | 't-800' | 'dune' | 'tetrastack' | 'the-book' | 'readit' | 'insta' | 'hill-valley-85' | 'turtle-power' | 'w3-1' | 'aqua-quartz' | 'spider-tech' | 'dos' | 'unix' | 'jayfin' | 'horde' | 'alliance' | 'w11' | 'w10' | 'north-park' | 'dark-side-of-the-moon' | 'powerslave' | 'nightfox' | 'dayfox' | 'dawnfox' | 'duskfox' | 'nordfox' | 'terafox' | 'carbonfox' | 'dracula';
type Theme = 'mocha' | 'macchiato' | 'frappe' | 'latte' | 'nord' | 'nord-snowstorm' | 'nord-frost' | 'nord-aurora' | 'psychowave' | 'wnamp' | 'poison' | 'nucleo' | 'muma-jukebox' | 'winmedplayer' | 'p-dvd' | 'vintage-tube-radio' | 'neon-drift' | 'aero-glass' | 'luna-teal' | 'w98' | 'cupertino-light' | 'cupertino-dark' | 'gruvbox-dark-hard' | 'gruvbox-dark-medium' | 'gruvbox-dark-soft' | 'gruvbox-light-hard' | 'gruvbox-light-medium' | 'gruvbox-light-soft' | 'spotless' | 'dzr0' | 'cupertino-beats' | 'lambda-17' | 'gw1' | 'grand-theft-audio' | 'v-tactical' | 'nightcity-2077' | 'middle-earth' | 'morpheus' | 'stark-hud' | 'blade' | 'heisenberg' | 'ice-and-fire' | 'doh-matic' | 't-800' | 'dune' | 'tetrastack' | 'the-book' | 'readit' | 'insta' | 'hill-valley-85' | 'turtle-power' | 'w3-1' | 'aqua-quartz' | 'spider-tech' | 'dos' | 'unix' | 'jayfin' | 'horde' | 'alliance' | 'w11' | 'w10' | 'north-park' | 'dark-side-of-the-moon' | 'powerslave' | 'nightfox' | 'dayfox' | 'dawnfox' | 'duskfox' | 'nordfox' | 'terafox' | 'carbonfox' | 'dracula' | 'vision-dark' | 'vision-navy';
interface ThemeState {
theme: Theme;
+106
View File
@@ -14317,3 +14317,109 @@ input[type="range"]:hover::-webkit-slider-thumb {
--warning: #ffb86c;
--danger: #ff5555;
}
/* ─── Vision Dark — Purple & Gold, colorblind-safe (Deuteranopia / Protanopia / Tritanopia) ─── */
/* Gold #FFD700 on #0D0B12 → contrast ~14.7:1 (WCAG AAA) */
[data-theme='vision-dark'] {
color-scheme: dark;
--select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23C8C4D4%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
--ctp-crust: #030210;
--ctp-mantle: #06050e;
--ctp-base: #0d0b12;
--ctp-surface0: #16131e;
--ctp-surface1: #201c2c;
--ctp-surface2: #2c2838;
--ctp-overlay0: #544e6a;
--ctp-overlay1: #6e6886;
--ctp-overlay2: #8a84a0;
--ctp-text: #f2eef8;
--ctp-subtext1: #c8c4d4;
--ctp-subtext0: #9c98aa;
--ctp-mauve: #8b5cf6; /* Purple — secondary accent */
--ctp-lavender: #a07af8;
--ctp-blue: #60a5fa;
--ctp-sapphire: #38bdf8;
--ctp-sky: #38bdf8;
--ctp-teal: #2dd4bf;
--ctp-green: #009e73; /* Okabe-Ito Bluish Green */
--ctp-yellow: #ffd700; /* Gold */
--ctp-peach: #e69f00;
--ctp-maroon: #d55e00; /* Okabe-Ito Vermillion — danger */
--ctp-red: #d55e00;
--ctp-flamingo: #f472b6;
--ctp-pink: #e879f9;
--ctp-rosewater: #f0abfc;
--bg-app: #0d0b12;
--bg-sidebar: #08060e;
--bg-card: #16131e;
--bg-hover: #201c2c;
--bg-player: #050310;
--bg-glass: rgba(13, 11, 18, 0.84);
--accent: #ffd700;
--accent-dim: rgba(255, 215, 0, 0.14);
--accent-glow: rgba(255, 215, 0, 0.36);
--text-primary: #f2eef8;
--text-secondary: #c8c4d4;
--text-muted: #7e7a8e;
--border: #201c2c;
--border-subtle: #16131e;
--positive: #009e73;
--warning: #e69f00;
--danger: #d55e00;
--volume-accent: #ffd700;
}
/* ─── Vision Navy — Purple & Gold, colorblind-safe (Deuteranopia / Protanopia / Tritanopia) ─── */
/* Gold #FFD700 on #0A1628 → contrast ~14.5:1 (WCAG AAA) */
[data-theme='vision-navy'] {
color-scheme: dark;
--select-arrow: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23C0C8D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E");
--ctp-crust: #030a14;
--ctp-mantle: #060e1c;
--ctp-base: #0a1628;
--ctp-surface0: #112038;
--ctp-surface1: #1a2e48;
--ctp-surface2: #243c58;
--ctp-overlay0: #486480;
--ctp-overlay1: #607a98;
--ctp-overlay2: #7890ae;
--ctp-text: #eef2f8;
--ctp-subtext1: #c0c8d8;
--ctp-subtext0: #8898ae;
--ctp-mauve: #8b5cf6; /* Purple — secondary accent */
--ctp-lavender: #a07af8;
--ctp-blue: #3b82f6;
--ctp-sapphire: #38bdf8;
--ctp-sky: #7dd3fc;
--ctp-teal: #2dd4bf;
--ctp-green: #009e73; /* Okabe-Ito Bluish Green */
--ctp-yellow: #ffd700; /* Gold */
--ctp-peach: #e69f00;
--ctp-maroon: #d55e00; /* Okabe-Ito Vermillion */
--ctp-red: #d55e00;
--ctp-flamingo: #f472b6;
--ctp-pink: #e879f9;
--ctp-rosewater: #f0abfc;
--bg-app: #0a1628;
--bg-sidebar: #060e1c;
--bg-card: #112038;
--bg-hover: #1a2e48;
--bg-player: #040c18;
--bg-glass: rgba(10, 22, 40, 0.84);
--accent: #ffd700;
--accent-dim: rgba(255, 215, 0, 0.14);
--accent-glow: rgba(255, 215, 0, 0.36);
--text-primary: #eef2f8;
--text-secondary: #c0c8d8;
--text-muted: #607080;
--border: #1a2e48;
--border-subtle: #112038;
--positive: #009e73;
--warning: #e69f00;
--danger: #d55e00;
--volume-accent: #ffd700;
}