mirror of
https://github.com/kilyabin/psysonic.git
synced 2026-07-21 22:15:40 +00:00
fix(ui): consolidate Orbit / Server / Live header dropdowns (#725)
* fix(ui): consolidate Orbit / Server / Live header dropdowns The three header dropdown popovers each had their own container style. Live used a glass utility class with backdrop-filter that read poorly on many themes (reported by cucadmuh). Move all three onto the shared `.nav-library-dropdown-panel` container — same bg, border, shadow and radius via existing semantic tokens (`--bg-card`, `--border-dropdown`, `--shadow-dropdown`, `--radius-md`). Item styles per dropdown stay case-specific. - NowPlayingDropdown: replace `glass animate-fade-in` with `nav-library-dropdown-panel animate-fade-in`; drop now-redundant inline borderRadius / boxShadow / zIndex; keep padding + gap for the user-list breathing room. - OrbitStartTrigger: add `nav-library-dropdown-panel` alongside `orbit-launch-pop`. The component-local class is now reduced to the menu-specific min-width + tighter item gap; bg / border / shadow / radius / padding inherit from the shared container. - Drop the unused `.glass` utility class; no other call sites. * docs(changelog): header dropdown consistency fix (#725)
This commit is contained in:
committed by
GitHub
parent
ccf4d5d8cb
commit
c16134dab5
@@ -121,7 +121,7 @@ export default function NowPlayingDropdown() {
|
||||
{isOpen && createPortal(
|
||||
<div
|
||||
ref={panelRef}
|
||||
className="glass animate-fade-in"
|
||||
className="nav-library-dropdown-panel animate-fade-in"
|
||||
style={{
|
||||
position: 'fixed',
|
||||
top: panelPos.top,
|
||||
@@ -129,13 +129,8 @@ export default function NowPlayingDropdown() {
|
||||
width: `${PANEL_WIDTH}px`,
|
||||
maxHeight: '400px',
|
||||
overflowY: 'auto',
|
||||
borderRadius: '12px',
|
||||
boxShadow: 'var(--shadow-lg)',
|
||||
padding: '1rem',
|
||||
zIndex: 10050,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '1rem'
|
||||
gap: '1rem',
|
||||
}}
|
||||
>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', borderBottom: '1px solid var(--border-subtle)', paddingBottom: '0.5rem' }}>
|
||||
|
||||
@@ -82,7 +82,7 @@ export default function OrbitStartTrigger() {
|
||||
</button>
|
||||
|
||||
{popoverOpen && createPortal(
|
||||
<div ref={popRef} className="orbit-launch-pop" style={popoverStyle} role="menu">
|
||||
<div ref={popRef} className="nav-library-dropdown-panel orbit-launch-pop" style={popoverStyle} role="menu">
|
||||
<button type="button" className="orbit-launch-pop__item" onClick={pickCreate}>
|
||||
<Plus size={14} />
|
||||
<span>{t('orbit.launchCreate')}</span>
|
||||
|
||||
Reference in New Issue
Block a user