feat(ui): scale the whole window with Interface Scale (#781)

* experiment(zoom): allow setting webview zoom via core capability

* experiment(zoom): drive uiScale through Tauri's native webview zoom

Replace the CSS `zoom: uiScale` on `.main-content-zoom` (which only
scaled the main content column, leaving the sidebar, queue panel,
player bar and portaled overlays at 1.0) with a `setZoom` call on the
current webview. That scales everything inside the window the same way
Ctrl+/− does in a browser, including portals and the queue panel.

Effect runs whenever `uiScale` changes and once on mount, so the
persisted setting is reapplied on launch.

* docs: changelog + credits for interface scale (#781)

CHANGELOG.md

@@ -34,6 +34,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 
 
+### Interface Scale — covers the whole window
+
+**By [@Psychotoxical](https://github.com/Psychotoxical), PR [#781](https://github.com/Psychotoxical/psysonic/pull/781)**
+
+* Settings → Appearance → Interface Scale now scales sidebar, queue, player bar, modals/portals and the fullscreen player alongside the main content — same behaviour as browser Ctrl+/−.
+
+
+
 ## [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.

src-tauri/capabilities/default.json

@@ -38,6 +38,7 @@
     "core:window:allow-create",
     "core:window:allow-set-size",
     "core:webview:allow-create-webview-window",
+    "core:webview:allow-set-webview-zoom",
     "process:allow-restart",
     "updater:default"
   ]

src/app/AppShell.tsx

@@ -2,6 +2,7 @@ import React, { Suspense, useCallback, useEffect, useState } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import { ensurePlaybackServerActive } from '../utils/playback/playbackServer';
 import { invoke } from '@tauri-apps/api/core';
+import { getCurrentWebview } from '@tauri-apps/api/webview';
 import { PanelRight } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import Sidebar from '../components/Sidebar';
@@ -122,6 +123,13 @@ export function AppShell() {
     useEqStore.getState().syncToRust();
   }, []);
 
+  useEffect(() => {
+    getCurrentWebview().setZoom(uiScale).catch(() => {
+      /* setZoom may fail on platforms where the capability is unavailable;
+         fall back silently so the rest of the shell still renders. */
+    });
+  }, [uiScale]);
+
   useNowPlayingTrayTitle(currentTrack, isPlaying);
 
   // Post-update changelog is now surfaced via a dismissible banner in the
@@ -178,7 +186,7 @@ export function AppShell() {
         />
       )}
       <main className="main-content">
-        <div className="main-content-zoom" style={uiScale !== 1 ? { zoom: uiScale } : undefined}>
+        <div className="main-content-zoom">
         <header className="content-header">
           <LiveSearch />
           <div className="spacer" />

src/config/settingsCredits.ts

@@ -311,6 +311,7 @@ const CONTRIBUTOR_ENTRIES = [
       'Accessibility: OpenDyslexic font option in the Settings picker — bundled locally via @fontsource/opendyslexic, asymmetric glyph shapes for easier b/d, p/q tracking, Latin-only with translated subtitle in all 9 locales calling out the dyslexia-friendly intent and the Cyrillic/CJK fallback (PR #507)',
       'Settings: tri-state Clock Format (Auto / 24h / 12h) overriding the locale default for the queue ETA and the sleep-timer preview (PR #742)',
       'Servers: per-server library scan triggers (Quick / Full) and inline edit for existing profiles (PR #780)',
+      'Interface Scale: scales the entire window — sidebar, queue, player bar, modals and the fullscreen player follow the main content (PR #781)',
     ],
   },
 ] as const;