vicrodh
2e47fbb544
The album card now has a fully deterministic 266px height (artwork 220 + 6 spacer + 40 meta, with fixed-height title and artist text). The section row's ScrollView pins viewport-height to its height, so the vertical scroll range is zero — the row can no longer scroll vertically, even invisibly. cc
40 lines
1.3 KiB
Plaintext
40 lines
1.3 KiB
Plaintext
// One Discover section — a title and a horizontally scrollable row of
|
|
// album cards.
|
|
//
|
|
// The Svelte original paginates by slice; the MVP uses a horizontal
|
|
// scroll, which is simpler and behaviorally equivalent for browsing.
|
|
|
|
import { Theme } from "../foundation/semantic-colors.slint";
|
|
import { Typography } from "../foundation/typography.slint";
|
|
import { DiscoverSection } from "../state.slint";
|
|
import { AlbumCard } from "AlbumCard.slint";
|
|
import { ScrollView } from "std-widgets.slint";
|
|
|
|
export component SectionRow inherits VerticalLayout {
|
|
in property <DiscoverSection> section;
|
|
|
|
spacing: 12px;
|
|
|
|
Text {
|
|
text: root.section.title;
|
|
color: Theme.text-primary;
|
|
font-size: 18px;
|
|
font-weight: Typography.semibold;
|
|
}
|
|
|
|
// Pinned to the AlbumCard height: viewport-height equals height, so
|
|
// the vertical scroll range is zero — the row cannot scroll vertically
|
|
// (visibly or not). Only horizontal scrolling remains.
|
|
ScrollView {
|
|
height: 266px;
|
|
viewport-height: 266px;
|
|
vertical-scrollbar-policy: ScrollBarPolicy.always-off;
|
|
HorizontalLayout {
|
|
spacing: 32px;
|
|
for album in root.section.albums: AlbumCard {
|
|
album: album;
|
|
}
|
|
}
|
|
}
|
|
}
|