110 lines
3.0 KiB
Plaintext
110 lines
3.0 KiB
Plaintext
import { BrowserConfig } from "./types.slint";
|
|
import { Theme } from "./theme.slint";
|
|
import { GradientIcon } from "./gradient-icon.slint";
|
|
|
|
export component Header inherits Rectangle {
|
|
in property <string> url;
|
|
callback request-drag();
|
|
|
|
TouchArea {
|
|
width: 100%;
|
|
height: 100%;
|
|
mouse-cursor: move;
|
|
pointer-event(event) => {
|
|
if (event.kind == PointerEventKind.down) {
|
|
root.request-drag();
|
|
}
|
|
}
|
|
}
|
|
|
|
VerticalLayout {
|
|
width: 100%;
|
|
padding: Theme.spacing-md;
|
|
padding-top: Theme.spacing-xl;
|
|
spacing: Theme.spacing-md;
|
|
|
|
HorizontalLayout {
|
|
spacing: Theme.spacing-md;
|
|
|
|
// Rectangle {
|
|
// width: 48px;
|
|
// height: 48px;
|
|
// border-radius: Theme.radius;
|
|
// background: Theme.gradient-main;
|
|
|
|
// Image {
|
|
// source: @image-url("../icons/globe.svg");
|
|
// colorize: white;
|
|
// }
|
|
// }
|
|
|
|
GradientIcon {
|
|
width: 48px;
|
|
height: 48px;
|
|
icon: @image-url("../icons/globe.svg");
|
|
}
|
|
|
|
VerticalLayout {
|
|
alignment: center;
|
|
spacing: Theme.spacing-xs;
|
|
|
|
Text {
|
|
font-family: "Segpoe UI";
|
|
text: "Выберите браузер";
|
|
color: Theme.text-main;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
Text {
|
|
font-family: "Segpoe UI";
|
|
text: "Для открытия ссылки";
|
|
color: Theme.text-muted;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
height: 44px;
|
|
border-radius: Theme.radius;
|
|
background: Theme.surface-elevated;
|
|
border-width: 1px;
|
|
border-color: Theme.border-main;
|
|
|
|
HorizontalLayout {
|
|
padding: Theme.spacing-md;
|
|
padding-left: Theme.spacing-lg;
|
|
padding-right: Theme.spacing-lg;
|
|
spacing: Theme.spacing-sm;
|
|
alignment: start;
|
|
|
|
Image {
|
|
source: @image-url("../icons/external_link.svg");
|
|
width: 16px;
|
|
colorize: Theme.text-control-muted;
|
|
height: 16px;
|
|
}
|
|
|
|
VerticalLayout {
|
|
padding-top: 2px;
|
|
|
|
Text {
|
|
text: root.url;
|
|
color: Theme.text-control;
|
|
font-size: 14px;
|
|
font-family: "Consolas";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
height: 1px;
|
|
width: 100%;
|
|
y: parent.height - self.height;
|
|
background: Theme.border-main;
|
|
}
|
|
}
|