feat(ui): Major UI update to Slint components

- Add real-time system status components

- Add theme support

- Improve layouts
This commit is contained in:
mihai2mn
2026-01-24 16:52:20 +01:00
parent 5d4b164b3b
commit a0dd0b36dd
26 changed files with 1818 additions and 771 deletions

View File

@@ -1,10 +1,14 @@
import { Palette, VerticalBox, HorizontalBox, GroupBox } from "std-widgets.slint";
import { VerticalBox, HorizontalBox, GroupBox } from "std-widgets.slint";
import { SystemToggleVert, SystemDropdown } from "common.slint";
import { PowerZones } from "../types/aura_types.slint";
import { RogPalette } from "../themes/rog_theme.slint";
export component AuraPowerGroup inherits Rectangle {
min-width: row.min-width;
opacity: 0.9;
border-radius: 8px;
background: RogPalette.control-background;
border-width: 1px;
border-color: RogPalette.control-border;
in-out property <string> group-title;
in-out property <bool> boot_checked;
in-out property <bool> awake_checked;
@@ -14,12 +18,11 @@ export component AuraPowerGroup inherits Rectangle {
callback awake_toggled(bool);
callback sleep_toggled(bool);
callback shutdown_toggled(bool);
VerticalBox {
spacing: 10px;
Text {
font-size: 18px;
color: Palette.alternate-foreground;
color: RogPalette.text-primary;
horizontal-alignment: TextHorizontalAlignment.center;
text <=> root.group-title;
}
@@ -27,7 +30,7 @@ export component AuraPowerGroup inherits Rectangle {
row := HorizontalBox {
alignment: LayoutAlignment.center;
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Boot");
checked <=> root.boot_checked;
@@ -37,7 +40,7 @@ export component AuraPowerGroup inherits Rectangle {
}
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Awake");
checked <=> root.awake_checked;
@@ -47,7 +50,7 @@ export component AuraPowerGroup inherits Rectangle {
}
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Sleep");
checked <=> root.sleep_checked;
@@ -57,7 +60,7 @@ export component AuraPowerGroup inherits Rectangle {
}
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Shutdown");
checked <=> root.shutdown_checked;
@@ -71,7 +74,10 @@ export component AuraPowerGroup inherits Rectangle {
export component AuraPowerGroupOld inherits Rectangle {
min-width: row.min-width;
opacity: 0.9;
border-radius: 8px;
background: RogPalette.control-background;
border-width: 1px;
border-color: RogPalette.control-border;
in-out property <int> current_zone;
in-out property <[int]> zones;
in-out property <[string]> zone_strings;
@@ -83,12 +89,11 @@ export component AuraPowerGroupOld inherits Rectangle {
callback awake_toggled(bool);
callback sleep_toggled(bool);
callback selected_zone(int);
VerticalBox {
spacing: 10px;
Text {
font-size: 18px;
color: Palette.alternate-foreground;
color: RogPalette.text-primary;
horizontal-alignment: TextHorizontalAlignment.center;
text <=> root.group-title;
}
@@ -107,7 +112,7 @@ export component AuraPowerGroupOld inherits Rectangle {
}
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Boot");
checked <=> root.boot_checked;
@@ -117,7 +122,7 @@ export component AuraPowerGroupOld inherits Rectangle {
}
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Awake");
checked <=> root.awake_checked;
@@ -127,7 +132,7 @@ export component AuraPowerGroupOld inherits Rectangle {
}
SystemToggleVert {
min-width: 128px;
min-width: 96px;
max-height: 42px;
text: @tr("Sleep");
checked <=> root.sleep_checked;