vicrodh
b51ec1509e
Bring the album view closer to 1:1 with the Tauri original. - Track list: favorite and offline-cache columns, and the context-menu button now always shows in the muted column color (it brightens on hover) instead of being hidden until hover - Toolbar above the track list: a QualityBadgeFull port of the Tauri QualityBadgeStatic (icon + tier + exact bit-depth/sample-rate), plus a track search box - Editorial album description, truncated, with a Read more link that opens the full text in a modal - Label/awards sidebar: drop the resting card background; awards use the Tauri laurels SVG - Control buttons on both album and artist views are ghost circles (translucent fill, faint ring) instead of solid fills cc
78 lines
2.4 KiB
Plaintext
78 lines
2.4 KiB
Plaintext
// Full quality badge — a faithful port of the Tauri QualityBadgeStatic
|
|
// (full mode): a contained pill with the format icon, the tier label, and
|
|
// the exact bit-depth / sample-rate line.
|
|
//
|
|
// Intentionally not a creative reinterpretation — the Tauri layout is the
|
|
// contract. Used wherever a track list or detail view advertises its
|
|
// stored quality.
|
|
|
|
import { Theme } from "../foundation/semantic-colors.slint";
|
|
import { QbzIcon } from "QbzIcon.slint";
|
|
|
|
export component QualityBadgeFull inherits Rectangle {
|
|
// "hires" | "cd" | "mp3" | "".
|
|
in property <string> tier;
|
|
// Exact quality, e.g. "24-bit / 96 kHz".
|
|
in property <string> detail;
|
|
|
|
property <string> tier-label: root.tier == "hires"
|
|
? "HI-RES"
|
|
: (root.tier == "mp3" ? "MP3" : "CD");
|
|
|
|
visible: root.tier != "";
|
|
height: 36px;
|
|
width: Math.max(content.preferred-width, 136px);
|
|
border-radius: 4px;
|
|
background: Theme.surface-hover;
|
|
border-width: 1px;
|
|
border-color: Theme.border-subtle;
|
|
|
|
content := HorizontalLayout {
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
spacing: 6px;
|
|
|
|
// Format icon. The Hi-Res brand mark keeps its own colors; the
|
|
// CD / MP3 marks render in muted grey.
|
|
VerticalLayout {
|
|
alignment: center;
|
|
if root.tier == "hires": Image {
|
|
source: @image-url("../assets/hi-res.svg");
|
|
width: 24px;
|
|
height: 24px;
|
|
image-fit: contain;
|
|
}
|
|
if root.tier == "cd": QbzIcon {
|
|
source: @image-url("../assets/cd.svg");
|
|
width: 16px;
|
|
height: 16px;
|
|
tint: #b0b0b0;
|
|
}
|
|
if root.tier == "mp3": QbzIcon {
|
|
source: @image-url("../assets/mp3.svg");
|
|
width: 16px;
|
|
height: 16px;
|
|
tint: #b0b0b0;
|
|
}
|
|
}
|
|
|
|
VerticalLayout {
|
|
alignment: center;
|
|
spacing: 1px;
|
|
Text {
|
|
text: root.tier-label;
|
|
color: #b0b0b0;
|
|
font-size: 8px;
|
|
font-weight: 100;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
Text {
|
|
text: root.detail;
|
|
color: #999999;
|
|
font-size: 9px;
|
|
font-weight: 100;
|
|
}
|
|
}
|
|
}
|
|
}
|