mini player + dark glass: eight shapes run by the hidden main as the one brain, dissolving covers and accents, drag from anywhere, and the space between the panes turned to real acrylic - with the webview flags that keep rest frames honest

This commit is contained in:
KeelrLeek committed 2026-08-26 07:56:00 -05:00
1 parent 9b84b30aef
commit dc7ea16b22
33 files changed
+2432 -5

No files matched your search

+28
View File
@@ -1,6 +1,7 @@
<script>
import { app, clearCatalogHeroArtCache, refreshSourcePrefs } from "../lib/state.svelte.js";
import { setWordFill } from "../lib/lyrics.svelte.js";
import { applyGlass } from "../lib/glass.js";
import * as api from "../lib/api.js";
import Icon from "../components/Icon.svelte";
@@ -105,6 +106,14 @@
}
}
async function setGlassMode(next) {
if (next !== settings.glass_mode) {
// Applies live — the acrylic backdrop and the CSS thinning land
// together the moment the save succeeds.
if (await commit({ glassMode: next })) applyGlass(next);
}
}
async function setWordTiming(next) {
if (next !== settings.word_timing) {
await commit({ wordTiming: next });
@@ -280,6 +289,25 @@
</p>
</section>
<section>
<h2>Appearance</h2>
<div class="row">
<div class="label">
<div class="name">Dark glass</div>
<div class="hint">Lets whatever is behind the window glow through the app's dark surfaces with a live blur (Windows acrylic). Panels, menus and cards stay solid so nothing gets hard to read.</div>
</div>
<select
class="device-select"
value={settings.glass_mode ? "on" : "off"}
disabled={saving}
onchange={(e) => setGlassMode(e.currentTarget.value === "on")}
>
<option value="off">Off — solid</option>
<option value="on">On — dark glass</option>
</select>
</div>
</section>
<section>
<h2>Playback</h2>
<div class="row">