fix(ui): shrink-wrap floating player bar instead of full-width strip (#969)

* fix(ui): shrink-wrap floating player bar instead of full-width strip

The bar used fixed left and right insets, which stretched its background
across the whole main column. Center it with max-content width so only
the pill-shaped controls are painted, and soften the drop shadow.

* docs: note PR #969 in changelog and settings credits
This commit is contained in:
cucadmuh
2026-06-04 00:03:24 +03:00
committed by GitHub
parent e8962c21ab
commit c9b2d140d9
7 changed files with 65 additions and 14 deletions
+4
View File
@@ -40,3 +40,7 @@
"sidebar main queue";
}
.app-shell.floating-player .resizer {
bottom: 0;
}
+4 -5
View File
@@ -21,19 +21,18 @@
.player-bar.floating {
position: fixed;
bottom: 12px;
/* left/right handled dynamically by JS */
/* left / max-width set by useFloatingPlayerBar — center + shrink-wrap */
z-index: 1000;
border-radius: 50px;
width: auto;
min-width: 100px;
max-width: none;
width: max-content;
max-width: min(100%, calc(100vw - 48px));
grid-area: unset;
padding: 0 24px 0 8px;
gap: 16px;
background: var(--bg-player);
border: 1px solid rgba(255, 255, 255, 0.12);
box-shadow:
0 8px 32px rgba(0, 0, 0, 0.8),
0 8px 32px rgba(0, 0, 0, 0.45),
0 0 0 1px rgba(255, 255, 255, 0.05),
inset 0 1px 0 rgba(255, 255, 255, 0.08);
}