60 lines
1.2 KiB
Plaintext
60 lines
1.2 KiB
Plaintext
import { Palette } from "std-widgets.slint";
|
|
|
|
export component FooterButton inherits Rectangle {
|
|
in property <string> title: "Button";
|
|
in property <image> icon;
|
|
callback clicked <=> touch.clicked;
|
|
|
|
states [
|
|
pressed when touch.pressed: {
|
|
background: #0000ff30;
|
|
}
|
|
hovered when touch.has-hover: {
|
|
background: #0000ff15;
|
|
}
|
|
default: {
|
|
background: #0000;
|
|
}
|
|
]
|
|
|
|
animate background {
|
|
duration: 0.1s;
|
|
easing: ease-in-out;
|
|
}
|
|
|
|
border-radius: 20px;
|
|
|
|
VerticalLayout {
|
|
padding: 10px;
|
|
padding-left: 20px;
|
|
padding-right: 20px;
|
|
Image {
|
|
source: icon;
|
|
colorize: #accbfa;
|
|
}
|
|
Text {
|
|
text: title;
|
|
horizontal-alignment: center;
|
|
}
|
|
}
|
|
|
|
touch := TouchArea {}
|
|
}
|
|
|
|
export component Footer inherits Rectangle {
|
|
width: 100%;
|
|
height: 88px;
|
|
background: Palette.alternate-background;
|
|
|
|
HorizontalLayout {
|
|
height: parent.height;
|
|
spacing: 16px;
|
|
padding-top: 8px;
|
|
padding-bottom: 16px;
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
|
|
@children
|
|
}
|
|
}
|