feat(settings): add a Compact buttons appearance toggle (#1189)

* feat(ui): prototype compact hero and toolbar buttons (Large/Small appearance setting)

* feat(settings): rename action-button size toggle to "Compact buttons"

Promote the hero-button prototype to a real, app-wide setting.

- rename heroButtonSize → buttonSize, data-hero-buttons → data-button-size,
  hero-action-bar/hero-btn-label → compact-action-bar/compact-btn-label
- relabel "Hero buttons" → "Compact buttons" and broaden the description
  (action + toolbar buttons across detail pages and browse views) in all 11 locales
- move the feature CSS out of cover-lightbox.css into its own compact-buttons.css
- add tests: themeStore buttonSize toggle, SelectionToggleButton

* docs(changelog): compact buttons appearance toggle (#1189)

* docs(credits): compact buttons appearance toggle (#1189)

src/locales/de/settings.ts

@@ -648,6 +648,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Aktive Zeile oben mit sanfter Animation.',
   seekbarStyle: 'Seekbar-Stil',
   seekbarStyleDesc: 'Aussehen der Wiedergabe-Seekbar auswählen',
+  buttonSizeTitle: 'Kompakte Buttons',
+  buttonSizeLabel: 'Buttongröße',
+  buttonSizeDesc: 'Verkleinert die Aktions- und Toolbar-Buttons auf Symbole — in Detailseiten und Übersichten.',
+  buttonSize_large: 'Groß',
+  buttonSize_small: 'Klein',
   seekbarTruewave: 'Echte Wellenform',
   seekbarPseudowave: 'Pseudo-Wellenform',
   seekbarLinedot: 'Linie & Punkt',

src/locales/en/settings.ts

@@ -715,6 +715,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Active line anchors near the top with smooth spring transitions.',
   seekbarStyle: 'Seekbar Style',
   seekbarStyleDesc: 'Choose the look of the player seek bar',
+  buttonSizeTitle: 'Compact buttons',
+  buttonSizeLabel: 'Button size',
+  buttonSizeDesc: 'Shrink the action and toolbar buttons to icons on detail pages and browse views.',
+  buttonSize_large: 'Large',
+  buttonSize_small: 'Small',
   seekbarTruewave: 'Truewave',
   seekbarPseudowave: 'Pseudowave',
   seekbarLinedot: 'Line & Dot',

src/locales/es/settings.ts

@@ -647,6 +647,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'La línea activa se ancla arriba con animación suave.',
   seekbarStyle: 'Estilo de Barra de Progreso',
   seekbarStyleDesc: 'Elige la apariencia de la barra de progreso del reproductor',
+  buttonSizeTitle: 'Botones compactos',
+  buttonSizeLabel: 'Tamaño de los botones',
+  buttonSizeDesc: 'Reduce los botones de acción y de barra de herramientas a iconos en las páginas de detalle y las vistas de exploración.',
+  buttonSize_large: 'Grande',
+  buttonSize_small: 'Pequeño',
   seekbarTruewave: 'Forma de Onda Real',
   seekbarPseudowave: 'Forma de Onda Pseudo',
   seekbarLinedot: 'Línea y Punto',

src/locales/fr/settings.ts

@@ -635,6 +635,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: "La ligne active reste en haut avec une animation fluide.",
   seekbarStyle: 'Style de la barre de lecture',
   seekbarStyleDesc: 'Choisir l\'apparence de la barre de progression',
+  buttonSizeTitle: 'Boutons compacts',
+  buttonSizeLabel: 'Taille des boutons',
+  buttonSizeDesc: 'Réduit les boutons d\'action et de barre d\'outils à des icônes sur les pages de détail et les vues de navigation.',
+  buttonSize_large: 'Grande',
+  buttonSize_small: 'Petite',
   seekbarTruewave: 'Forme d\'onde réelle',
   seekbarPseudowave: 'Forme d\'onde pseudo',
   seekbarLinedot: 'Ligne & point',

src/locales/hu/settings.ts

@@ -715,6 +715,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Az aktív sor a tetejéhez közel rögzül, sima rugós átmenetekkel.',
   seekbarStyle: 'Keresősáv stílusa',
   seekbarStyleDesc: 'Válaszd ki a lejátszó keresősávjának kinézetét',
+  buttonSizeTitle: 'Kompakt gombok',
+  buttonSizeLabel: 'Gombméret',
+  buttonSizeDesc: 'Ikonokká zsugorítja a műveleti és eszköztár gombokat a részletoldalakon és a böngészőnézetekben.',
+  buttonSize_large: 'Nagy',
+  buttonSize_small: 'Kicsi',
   seekbarTruewave: 'Truewave',
   seekbarPseudowave: 'Pseudowave',
   seekbarLinedot: 'Vonal és pont',

src/locales/ja/settings.ts

@@ -709,6 +709,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'アクティブ行を上部付近に固定し、滑らかなスプリング遷移を使います。',
   seekbarStyle: 'シークバー形式',
   seekbarStyleDesc: 'プレイヤーシークバーの見た目を選びます',
+  buttonSizeTitle: 'コンパクトボタン',
+  buttonSizeLabel: 'ボタンサイズ',
+  buttonSizeDesc: '詳細ページや一覧ビューで、アクションボタンやツールバーボタンをアイコンのみに縮小します。',
+  buttonSize_large: '大',
+  buttonSize_small: '小',
   seekbarTruewave: 'Truewave',
   seekbarPseudowave: 'Pseudowave',
   seekbarLinedot: 'Line & Dot',

src/locales/nb/settings.ts

@@ -634,6 +634,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Aktiv linje forankres øverst med jevn animasjon.',
   seekbarStyle: 'Søkefelt-stil',
   seekbarStyleDesc: 'Velg utseendet på avspillingssøkefeltet',
+  buttonSizeTitle: 'Kompakte knapper',
+  buttonSizeLabel: 'Knappestørrelse',
+  buttonSizeDesc: 'Krymper handlings- og verktøylinjeknappene til ikoner på detaljsider og oversikter.',
+  buttonSize_large: 'Stor',
+  buttonSize_small: 'Liten',
   seekbarTruewave: 'Ekte bølgeform',
   seekbarPseudowave: 'Pseudo-bølgeform',
   seekbarLinedot: 'Linje & punkt',

src/locales/nl/settings.ts

@@ -635,6 +635,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Actieve regel verankerd bovenaan met vloeiende animatie.',
   seekbarStyle: 'Zoekbalkstijl',
   seekbarStyleDesc: 'Kies het uiterlijk van de afspeelbalk',
+  buttonSizeTitle: 'Compacte knoppen',
+  buttonSizeLabel: 'Knopgrootte',
+  buttonSizeDesc: 'Verkleint de actie- en werkbalkknoppen tot pictogrammen op detailpagina\'s en overzichten.',
+  buttonSize_large: 'Groot',
+  buttonSize_small: 'Klein',
   seekbarTruewave: 'Echte golfvorm',
   seekbarPseudowave: 'Pseudo-golfvorm',
   seekbarLinedot: 'Lijn & punt',

src/locales/ro/settings.ts

@@ -650,6 +650,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Linia activă este ancorată aproape de vârf cu animații netede.',
   seekbarStyle: 'Stilul barei de redare',
   seekbarStyleDesc: 'Alege aspectul barei de redare a playerului',
+  buttonSizeTitle: 'Butoane compacte',
+  buttonSizeLabel: 'Dimensiunea butoanelor',
+  buttonSizeDesc: 'Reduce butoanele de acțiune și din bara de instrumente la pictograme pe paginile de detalii și vizualizările de navigare.',
+  buttonSize_large: 'Mari',
+  buttonSize_small: 'Mici',
   seekbarTruewave: 'Truewave',
   seekbarPseudowave: 'Pseudowave',
   seekbarLinedot: 'Linie & Punct',

src/locales/ru/settings.ts

@@ -735,6 +735,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: 'Активная строка фиксируется сверху с плавной анимацией.',
   seekbarStyle: 'Стиль прогресс-бара',
   seekbarStyleDesc: 'Выбор внешнего вида полосы воспроизведения',
+  buttonSizeTitle: 'Компактные кнопки',
+  buttonSizeLabel: 'Размер кнопок',
+  buttonSizeDesc: 'Уменьшает кнопки действий и панели инструментов до значков на страницах сведений и в списках.',
+  buttonSize_large: 'Большие',
+  buttonSize_small: 'Маленькие',
   seekbarTruewave: 'Реальная форма волны',
   seekbarPseudowave: 'Псевдо форма волны',
   seekbarLinedot: 'Линия и точка',

src/locales/zh/settings.ts

@@ -634,6 +634,11 @@ export const settings = {
   sidebarLyricsStyleAppleDesc: '活动行固定在顶部，带有平滑弹簧动画。',
   seekbarStyle: '进度条样式',
   seekbarStyleDesc: '选择播放进度条的外观',
+  buttonSizeTitle: '紧凑按钮',
+  buttonSizeLabel: '按钮大小',
+  buttonSizeDesc: '在详情页和浏览视图中将操作按钮和工具栏按钮缩小为图标。',
+  buttonSize_large: '大',
+  buttonSize_small: '小',
   seekbarTruewave: '真实波形',
   seekbarPseudowave: '伪波形',
   seekbarLinedot: '线条与点',