vicrodh
16e6232220
Phase-2 Slice 12c (user directive: use the app's circular controls, no invented buttons; fix the glyph-stuck-left bug). - Hero §3.6: deleted the local ActionCircle; the 4 hero controls are now the shared CircleAction (Play primary = filled white disc + black glyph; the loading spinner is now available = more 1:1). Added `enabled` to CircleAction (additive). - All MyQBZ modal footers (Create / Edit / Mix / AddTo / Discography) now use the shared QbzPrimaryButton (+ a new `destructive` variant for Delete) and a new shared SecondaryButton (promoted from AppearanceSettings' inline copy). QbzPrimaryButton auto-sizes as a footer chip while staying full-width in login (verified: login stretches it in a VerticalLayout; footers take preferred width). - Kept legitimately-local icon+label controls (grid "+ New" CTA, AddToMixtape picker chips, toolbar sort/filter/view-mode pills) but verified every glyph is centered. - Fixed 3 glyph-stuck-left bugs (DiscographyBuilder checkboxes used non-snapped centering -> the Math.round(.../1px)*1px crisp idiom). Backend crates untouched. cargo check -p qbz-slint green. cc
49 lines
1.6 KiB
Plaintext
49 lines
1.6 KiB
Plaintext
// Full-width accent button primitive.
|
|
|
|
import { Theme } from "../foundation/semantic-colors.slint";
|
|
import { Radius } from "../foundation/radius.slint";
|
|
import { Typography } from "../foundation/typography.slint";
|
|
|
|
export component QbzPrimaryButton inherits Rectangle {
|
|
in property <string> label;
|
|
in property <bool> enabled: true;
|
|
// Destructive variant (e.g. the Delete confirm) — a red fill instead of the
|
|
// accent. Additive; existing callers default to the accent primary.
|
|
in property <bool> destructive: false;
|
|
callback clicked();
|
|
|
|
height: 48px;
|
|
border-radius: Radius.sm;
|
|
opacity: root.enabled ? 1.0 : 0.5;
|
|
background: root.destructive
|
|
? (ta.has-hover && root.enabled ? #e57373d9 : #e57373)
|
|
: (ta.has-hover && root.enabled ? Theme.accent-hover : Theme.accent);
|
|
|
|
animate background { duration: 150ms; }
|
|
|
|
// A padded layout drives the preferred-width (label + 20px each side) so the
|
|
// button auto-sizes as a footer chip inside an `alignment: end` row, while
|
|
// still stretching full-width when the parent layout stretches it (login).
|
|
HorizontalLayout {
|
|
alignment: center;
|
|
padding-left: 20px;
|
|
padding-right: 20px;
|
|
Text {
|
|
text: root.label;
|
|
color: Theme.accent-text;
|
|
font-size: Typography.button;
|
|
font-weight: Typography.semibold;
|
|
horizontal-alignment: center;
|
|
vertical-alignment: center;
|
|
}
|
|
}
|
|
|
|
ta := TouchArea {
|
|
enabled: root.enabled;
|
|
mouse-cursor: root.enabled ? pointer : default;
|
|
clicked => {
|
|
root.clicked();
|
|
}
|
|
}
|
|
}
|