From 562218f447d0b524d4be55a518de727398a2af27 Mon Sep 17 00:00:00 2001 From: Frank Stellmacher <171614930+Psychotoxical@users.noreply.github.com> Date: Mon, 18 May 2026 15:21:45 +0200 Subject: [PATCH] =?UTF-8?q?feat(settings):=20dim=20disabled=20toggle=20row?= =?UTF-8?q?s=20+=20rename=20Clear=20=E2=86=92=20Clear=20queue=20(#778)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat(settings): dim disabled toggle rows + rename Clear → Clear queue * Settings toggle rows (`.settings-toggle-row`, `.sidebar-customizer-row`) dim their non-toggle content to 0.6 opacity when the switch is off. Driven by a single `:has(.toggle-switch input:not(:checked):not(:disabled))` rule so it applies across every Settings tab without per-row markup. Mutex-disabled toggles (Crossfade/Gapless) are excluded to avoid stacking with the existing inline 0.45 dim on their row. * Queue toolbar "Clear" button now reads "Clear queue" in all 9 locales for parity with "Shuffle queue" and to distinguish from playlist clear/delete. Adopted from @kveld9's PR #558 — cherry-picked the spirit, rewrote the dim as a single global selector instead of three inline-styled customizer rows, and extended the rename to the Romanian locale that landed after #558 was opened. Co-Authored-By: kveld9 <179108235+kveld9@users.noreply.github.com> * docs(changelog,credits): credit @kveld9 for #778 Co-Authored-By: kveld9 <179108235+kveld9@users.noreply.github.com> --------- Co-authored-by: kveld9 <179108235+kveld9@users.noreply.github.com> --- CHANGELOG.md | 11 +++++++++++ src/components/QueuePanel.test.tsx | 2 +- src/config/settingsCredits.ts | 1 + src/locales/de/queue.ts | 2 +- src/locales/en/queue.ts | 2 +- src/locales/es/queue.ts | 2 +- src/locales/fr/queue.ts | 2 +- src/locales/nb/queue.ts | 2 +- src/locales/nl/queue.ts | 2 +- src/locales/ro/queue.ts | 2 +- src/locales/ru/queue.ts | 2 +- src/locales/zh/queue.ts | 2 +- src/styles/components/settings.css | 9 +++++++++ 13 files changed, 31 insertions(+), 10 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c1f5e620..21c552d7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 > **📦 Version jump 1.34.x → 1.40.0:** The 1.34.x patch series was bumped a lot as each small feature landed. 1.40.0 consolidates the last few weeks of work — macOS signing + auto-updater, the Device-Sync overhaul, theme work and contrast audits — into a single coherent release. The next major bump (2.0.0) is planned once Windows code-signing + Windows auto-updater are active as well. +## [1.47.0] + +### Settings + Queue polish + +**By [@kveld9](https://github.com/kveld9) + [@Psychotoxical](https://github.com/Psychotoxical), adopted from PR [#558](https://github.com/Psychotoxical/psysonic/pull/558), rewritten in PR [#778](https://github.com/Psychotoxical/psysonic/pull/778)** + +* Settings toggle rows dim non-toggle content to 0.6 opacity when their switch is off; mutex-disabled rows (Crossfade/Gapless) unchanged. +* Queue toolbar `Clear` → `Clear queue` across all 9 locales. + + + ## [1.46.0] - 2026-05-18 > **🙏 Special thanks to [@zz5zz](https://github.com/zz5zz)** for his tireless quirk-spotting and bug reports on the [Psysonic Discord](https://discord.gg/AMnDRErm4u) — several of the polish fixes in this release landed directly off the back of his messages. diff --git a/src/components/QueuePanel.test.tsx b/src/components/QueuePanel.test.tsx index cec17d0f..95af954d 100644 --- a/src/components/QueuePanel.test.tsx +++ b/src/components/QueuePanel.test.tsx @@ -112,7 +112,7 @@ describe('QueuePanel — toolbar', () => { expect(getByLabelText('Save Playlist')).toBeInTheDocument(); expect(getByLabelText('Load Playlist')).toBeInTheDocument(); expect(getByLabelText('Copy queue share link')).toBeInTheDocument(); - expect(getByLabelText('Clear')).toBeInTheDocument(); + expect(getByLabelText('Clear queue')).toBeInTheDocument(); }); it('Shuffle button is disabled when the queue has fewer than 2 tracks', () => { diff --git a/src/config/settingsCredits.ts b/src/config/settingsCredits.ts index 87f60aee..3ea8be6e 100644 --- a/src/config/settingsCredits.ts +++ b/src/config/settingsCredits.ts @@ -176,6 +176,7 @@ const CONTRIBUTOR_ENTRIES = [ 'Playlist page layout — per-element visibility toggles (Add Songs, Import CSV, Download ZIP, Cache Offline, Suggestions) under Settings → Personalisation (PR #556)', 'Player bar layout — per-control visibility toggles (Star rating, Favorite, Last.fm love, Equalizer, Mini player) under Settings → Personalisation (PR #627)', 'Queue panel — persist header duration mode (total / remaining / ETA) across app restarts (PR #625)', + 'Settings: dim disabled toggle rows; Queue toolbar "Clear" → "Clear queue" rename across 9 locales (adopted from PR #558, rewritten in PR #778)', ], }, { diff --git a/src/locales/de/queue.ts b/src/locales/de/queue.ts index 28d6834c..4b8ee77d 100644 --- a/src/locales/de/queue.ts +++ b/src/locales/de/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'An Warteschlange anhängen', delete: 'Löschen', deleteConfirm: 'Playlist "{{name}}" löschen?', - clear: 'Leeren', + clear: 'Warteschlange leeren', shuffle: 'Warteschlange mischen', gapless: 'Nahtlos', crossfade: 'Crossfade', diff --git a/src/locales/en/queue.ts b/src/locales/en/queue.ts index 05cf57b8..491e9ad3 100644 --- a/src/locales/en/queue.ts +++ b/src/locales/en/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Append to queue', delete: 'Delete', deleteConfirm: 'Delete playlist "{{name}}"?', - clear: 'Clear', + clear: 'Clear queue', shuffle: 'Shuffle queue', gapless: 'Gapless', crossfade: 'Crossfade', diff --git a/src/locales/es/queue.ts b/src/locales/es/queue.ts index 453517ac..472cd15f 100644 --- a/src/locales/es/queue.ts +++ b/src/locales/es/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Agregar a cola', delete: 'Eliminar', deleteConfirm: '¿Eliminar lista "{{name}}"?', - clear: 'Limpiar', + clear: 'Limpiar cola', shuffle: 'Mezclar cola', gapless: 'Gapless', crossfade: 'Crossfade', diff --git a/src/locales/fr/queue.ts b/src/locales/fr/queue.ts index 8440ca3b..694fdb6e 100644 --- a/src/locales/fr/queue.ts +++ b/src/locales/fr/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Ajouter à la file', delete: 'Supprimer', deleteConfirm: 'Supprimer la liste « {{name}} » ?', - clear: 'Vider', + clear: 'Vider la file', shuffle: 'Mélanger la file', gapless: 'Sans blanc', crossfade: 'Fondu', diff --git a/src/locales/nb/queue.ts b/src/locales/nb/queue.ts index b4398d79..f83cfd74 100644 --- a/src/locales/nb/queue.ts +++ b/src/locales/nb/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Legg til i kø', delete: 'Slett', deleteConfirm: 'Slett spillelisten "{{name}}"?', - clear: 'Fjern', + clear: 'Tøm kø', shuffle: 'Bland kø', gapless: 'Uten mellomrom', crossfade: 'Crossfade', diff --git a/src/locales/nl/queue.ts b/src/locales/nl/queue.ts index d7592024..75dc1f14 100644 --- a/src/locales/nl/queue.ts +++ b/src/locales/nl/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Toevoegen aan wachtrij', delete: 'Verwijderen', deleteConfirm: 'Afspeellijst "{{name}}" verwijderen?', - clear: 'Leegmaken', + clear: 'Wachtrij leegmaken', shuffle: 'Wachtrij shufflen', gapless: 'Naadloos', crossfade: 'Overgang', diff --git a/src/locales/ro/queue.ts b/src/locales/ro/queue.ts index 7f773e52..54c6b841 100644 --- a/src/locales/ro/queue.ts +++ b/src/locales/ro/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Adaugă la coadă', delete: 'Șterge', deleteConfirm: 'Șterge playlist "{{name}}"?', - clear: 'Golește', + clear: 'Golește coada', shuffle: 'Amestecă coada', gapless: 'Gapless', crossfade: 'Crossfade', diff --git a/src/locales/ru/queue.ts b/src/locales/ru/queue.ts index 0744b91c..a3d7d644 100644 --- a/src/locales/ru/queue.ts +++ b/src/locales/ru/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: 'Добавить в очередь', delete: 'Удалить', deleteConfirm: 'Удалить плейлист «{{name}}»?', - clear: 'Очистить', + clear: 'Очистить очередь', shuffle: 'Перемешать', gapless: 'Без пауз', crossfade: 'Кроссфейд', diff --git a/src/locales/zh/queue.ts b/src/locales/zh/queue.ts index ac48e914..8ccccdf9 100644 --- a/src/locales/zh/queue.ts +++ b/src/locales/zh/queue.ts @@ -13,7 +13,7 @@ export const queue = { appendToQueue: '追加到队列', delete: '删除', deleteConfirm: '删除播放列表 "{{name}}"？', - clear: '清空', + clear: '清空队列', shuffle: '随机打乱队列', gapless: '无缝播放', crossfade: '交叉淡入淡出', diff --git a/src/styles/components/settings.css b/src/styles/components/settings.css index b055358f..3842a347 100644 --- a/src/styles/components/settings.css +++ b/src/styles/components/settings.css @@ -520,3 +520,12 @@ color: var(--text-secondary); } +/* Dim the non-toggle content of a settings row when its toggle is off. + * `:not(:disabled)` excludes mutex-disabled toggles (e.g. Crossfade/Gapless) + * whose row already carries an inline opacity — avoids dim-stacking. */ +.settings-toggle-row:has(.toggle-switch input:not(:checked):not(:disabled)) > *:not(.toggle-switch), +.sidebar-customizer-row:has(.toggle-switch input:not(:checked):not(:disabled)) > *:not(.toggle-switch) { + opacity: 0.6; + transition: opacity 150ms ease; +} +