d69d931ea9
- button-bg lighter (#565970) to stand out from bg-secondary - Border on DarkButton and DarkComboBox (#6272a4) - Primary button: dark text on purple bg - Tab titles: inactive #9a9ebb (was #6272a4), 13px, bold 700 when active Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
37 lines
1.2 KiB
Text
37 lines
1.2 KiB
Text
import { Theme } from "../theme.slint";
|
|
|
|
export component DarkButton inherits Rectangle {
|
|
in property <string> text;
|
|
in property <bool> enabled: true;
|
|
in property <bool> primary: false;
|
|
callback clicked();
|
|
|
|
min-width: btn-text.preferred-width + 24px;
|
|
height: 28px;
|
|
border-radius: 4px;
|
|
border-width: 1px;
|
|
border-color: !root.enabled ? transparent
|
|
: root.primary ? Theme.accent-purple.darker(0.1)
|
|
: Theme.button-border;
|
|
background: !root.enabled ? Theme.bg-primary
|
|
: root.primary && ta.has-hover ? Theme.accent-purple.darker(0.2)
|
|
: root.primary ? Theme.accent-purple
|
|
: ta.has-hover ? Theme.button-hover
|
|
: Theme.button-bg;
|
|
opacity: root.enabled ? 1.0 : 0.4;
|
|
|
|
btn-text := Text {
|
|
text: root.text;
|
|
color: root.primary ? #282a36 : root.enabled ? Theme.fg-primary : Theme.fg-secondary;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
horizontal-alignment: center;
|
|
vertical-alignment: center;
|
|
}
|
|
|
|
ta := TouchArea {
|
|
enabled: root.enabled;
|
|
clicked => { root.clicked(); }
|
|
mouse-cursor: root.enabled ? pointer : default;
|
|
}
|
|
}
|