236 lines
7.8 KiB
Plaintext
236 lines
7.8 KiB
Plaintext
import { ListView } from "std-widgets.slint";
|
|
import { Theme } from "./theme.slint";
|
|
import { BrowserConfig, RememberedEntry } from "./types.slint";
|
|
|
|
export component SettingsView inherits Rectangle {
|
|
in property <[BrowserConfig]> browsers;
|
|
in property <[RememberedEntry]> remembered;
|
|
callback back();
|
|
callback remove-browser(string);
|
|
callback remove-remembered(string);
|
|
callback redetect();
|
|
|
|
background: transparent;
|
|
|
|
VerticalLayout {
|
|
padding: 16px;
|
|
spacing: 12px;
|
|
|
|
HorizontalLayout {
|
|
spacing: 8px;
|
|
|
|
Rectangle {
|
|
width: 32px;
|
|
border-radius: 8px;
|
|
background: back-touch.has-hover ? Theme.surface-hover : transparent;
|
|
|
|
back-touch := TouchArea {
|
|
mouse-cursor: pointer;
|
|
clicked => {
|
|
root.back();
|
|
}
|
|
}
|
|
|
|
Image {
|
|
x: (parent.width - self.width) / 2;
|
|
y: (parent.height - self.height) / 2;
|
|
width: 20px;
|
|
height: 20px;
|
|
source: @image-url("../icons/arrow_left.svg");
|
|
colorize: back-touch.has-hover ? Theme.text-main : Theme.text-muted;
|
|
}
|
|
}
|
|
|
|
VerticalLayout {
|
|
alignment: center;
|
|
|
|
Text {
|
|
text: "Настройки";
|
|
color: Theme.text-main;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
vertical-alignment: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
HorizontalLayout {
|
|
spacing: 8px;
|
|
|
|
Text {
|
|
text: "Браузеры";
|
|
color: Theme.text-muted;
|
|
font-size: 13px;
|
|
vertical-alignment: center;
|
|
}
|
|
|
|
Rectangle {}
|
|
|
|
Rectangle {
|
|
width: 120px;
|
|
height: 26px;
|
|
border-radius: 8px;
|
|
background: redetect-touch.has-hover ? Theme.surface-hover : Theme.surface-elevated;
|
|
border-width: 1px;
|
|
border-color: Theme.border-main;
|
|
|
|
redetect-touch := TouchArea {
|
|
mouse-cursor: pointer;
|
|
clicked => {
|
|
root.redetect();
|
|
}
|
|
}
|
|
|
|
Text {
|
|
width: 100%;
|
|
height: 100%;
|
|
text: "Автодетект";
|
|
color: redetect-touch.has-hover ? Theme.text-main : Theme.text-control;
|
|
font-size: 12px;
|
|
horizontal-alignment: center;
|
|
vertical-alignment: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
vertical-stretch: 3;
|
|
border-radius: 8px;
|
|
background: Theme.surface-elevated;
|
|
clip: true;
|
|
|
|
ListView {
|
|
for b in root.browsers: Rectangle {
|
|
height: 52px;
|
|
background: transparent;
|
|
|
|
HorizontalLayout {
|
|
padding-left: 12px;
|
|
padding-right: 8px;
|
|
spacing: 10px;
|
|
|
|
Image {
|
|
width: 22px;
|
|
y: (parent.height - self.height) / 2;
|
|
source: b.icon;
|
|
}
|
|
|
|
VerticalLayout {
|
|
horizontal-stretch: 1;
|
|
alignment: center;
|
|
|
|
Text {
|
|
text: b.name;
|
|
color: Theme.text-main;
|
|
font-size: 14px;
|
|
}
|
|
|
|
Text {
|
|
text: b.path;
|
|
color: Theme.text-hint;
|
|
font-size: 11px;
|
|
font-family: "Consolas";
|
|
overflow: elide;
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width: 28px;
|
|
border-radius: 6px;
|
|
background: del-touch.has-hover ? #ef444420 : transparent;
|
|
|
|
del-touch := TouchArea {
|
|
mouse-cursor: pointer;
|
|
clicked => {
|
|
root.remove-browser(b.name);
|
|
}
|
|
}
|
|
|
|
Image {
|
|
x: (parent.width - self.width) / 2;
|
|
y: (parent.height - self.height) / 2;
|
|
width: 15px;
|
|
height: 15px;
|
|
source: @image-url("../icons/trash.svg");
|
|
colorize: del-touch.has-hover ? #ef4444 : Theme.text-muted;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Text {
|
|
text: "Запомненные домены";
|
|
color: Theme.text-muted;
|
|
font-size: 13px;
|
|
}
|
|
|
|
Rectangle {
|
|
vertical-stretch: 2;
|
|
border-radius: 8px;
|
|
background: Theme.surface-elevated;
|
|
clip: true;
|
|
|
|
ListView {
|
|
for r in root.remembered: Rectangle {
|
|
height: 40px;
|
|
background: transparent;
|
|
|
|
HorizontalLayout {
|
|
padding-left: 12px;
|
|
padding-right: 8px;
|
|
spacing: 10px;
|
|
|
|
VerticalLayout {
|
|
horizontal-stretch: 1;
|
|
alignment: center;
|
|
|
|
HorizontalLayout {
|
|
spacing: 6px;
|
|
|
|
Text {
|
|
text: r.domain;
|
|
color: Theme.text-main;
|
|
font-size: 13px;
|
|
font-family: "Consolas";
|
|
vertical-alignment: center;
|
|
}
|
|
|
|
Text {
|
|
text: "→ " + r.browser;
|
|
color: Theme.text-hint;
|
|
font-size: 12px;
|
|
vertical-alignment: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width: 28px;
|
|
border-radius: 6px;
|
|
background: del2-touch.has-hover ? #ef444420 : transparent;
|
|
|
|
del2-touch := TouchArea {
|
|
mouse-cursor: pointer;
|
|
clicked => {
|
|
root.remove-remembered(r.domain);
|
|
}
|
|
}
|
|
|
|
Image {
|
|
x: (parent.width - self.width) / 2;
|
|
y: (parent.height - self.height) / 2;
|
|
width: 15px;
|
|
height: 15px;
|
|
source: @image-url("../icons/trash.svg");
|
|
colorize: del2-touch.has-hover ? #ef4444 : Theme.text-muted;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|