Files
qbz/crates/qbz-slint/ui/shell/Sidebar.slint
T
vicrodh 8c27de5651 feat(qbz-slint): header redesign, Lucide icons, scrollbar fixes
- Replace every Unicode glyph placeholder with Lucide icons via QbzIcon
  (player transport, carousel nav, album-card overlay, album-page
  actions, gear, search, checkbox, sidebar).
- Header: the search field is centered to the window width and gets a
  search icon; the header and player bar now use the elevated surface,
  so all chrome (header, sidebar, player bar) shares one color over the
  darker content area.
- The sidebar user card moves to the header as a user element (name +
  QBZ logo) that opens a dropdown — Settings, Keyboard Shortcuts,
  Documentation, Report an Issue, About, plus Log Out and Close. Log Out
  clears the session and returns to login; Close quits the app.
- Content ScrollViews disable the horizontal scrollbar — no view scrolls
  horizontally, so the phantom reserved lane is gone.

cc
2026-05-18 14:58:58 -06:00

54 lines
1.8 KiB
Plaintext

// Left navigation sidebar — the playlists list.
//
// The playlist list is empty until real playlist data is wired (the
// sidebar is a later milestone). The user element now lives in the
// header, not at the bottom of the sidebar.
import { Theme } from "../foundation/semantic-colors.slint";
import { Spacing } from "../foundation/spacing.slint";
import { Layout } from "../foundation/layout.slint";
import { QbzIcon } from "../primitives/QbzIcon.slint";
import { ScrollView } from "std-widgets.slint";
export component Sidebar inherits Rectangle {
width: Layout.sidebar-width;
// The sidebar sits one surface above the content area, matching the
// QBZ dark theme (--bg-secondary sidebar over --bg-primary content).
background: Theme.surface-card;
VerticalLayout {
padding: Spacing.md;
spacing: Spacing.md;
HorizontalLayout {
Text {
text: "PLAYLISTS";
color: Theme.text-muted;
font-size: 11px;
letter-spacing: 1.5px;
vertical-alignment: center;
horizontal-stretch: 1;
}
VerticalLayout {
alignment: center;
QbzIcon {
source: @image-url("../assets/icons/plus.svg");
width: 16px;
height: 16px;
tint: Theme.text-muted;
}
}
}
ScrollView {
vertical-stretch: 1;
horizontal-scrollbar-policy: ScrollBarPolicy.always-off;
VerticalLayout {
spacing: 2px;
// Real playlist rows are populated when the sidebar
// milestone wires playlist data. No fixtures.
}
}
}
}