Added Window Header and minor tweaks

ui/components/data-window.slint

@@ -2,6 +2,7 @@
 // Copyright (C) 2026 Association Exergie <association.exergie@gmail.com>
 // SPDX-License-Identifier: GPL-3.0-or-later
 import { Palette } from "../palette.slint";
+import { WindowHeader } from "window-header.slint";
 struct DataItem {
     label: string,
     value: float,
@@ -10,11 +11,7 @@ struct DataItem {
 
 component DataColumn {
     in property <[DataItem]> data;
-    preferred-width: 100%;
-    preferred-height: 100%;
     HorizontalLayout {
-        width: 100%;
-        height: 100%;
         VerticalLayout {
             alignment: center;
 
@@ -54,44 +51,61 @@ component DataColumn {
 export component DataWindow {
     in property <[DataItem]> data1;
     in property <[DataItem]> data2;
-    preferred-width: 100%;
-    preferred-height: 100%;
     HorizontalLayout {
         padding: 12px;
-
         Rectangle {
             area := TouchArea {
                 mouse-cursor: pointer;
             }
 
             background: Palette.bg-main;
-            border-color: area.has-hover ? Palette.border-focus : Palette.border;
-            border-width: 2px;
             border-radius: 8px;
             drop-shadow-color: black;
             drop-shadow-offset-x: 6px;
             drop-shadow-offset-y: 6px;
             drop-shadow-blur: 10px;
-            HorizontalLayout {
-                DataColumn {
-                    data: data1;
+            width: 500px;
+            vertical-stretch: 1;
+            VerticalLayout {
+                visible: true;
+                alignment: start;
+                WindowHeader {
+                    title: "Data";
                 }
 
                 HorizontalLayout {
-                    height: 100%;
-                    width: 1px;
-                    padding-top: 10px;
+                    padding-left: 10px;
+                    padding-right: 10px;
                     padding-bottom: 10px;
-                    Rectangle {
+                    alignment: space-between;
+                    DataColumn {
+                        width: 218px;
+                        data: data1;
+                    }
+
+                    HorizontalLayout {
+                        vertical-stretch: 1;
+                        width: 21px;
                         padding: 10px;
-                        width: 1px;
-                        background: Palette.bg-secondary;
+                        Rectangle {
+                            width: 1px;
+                            background: Palette.border;
+                        }
+                    }
+
+                    DataColumn {
+                        width: 218px;
+                        data: data2;
                     }
                 }
+            }
 
-                DataColumn {
-                    data: data2;
-                }
+            Rectangle {
+                background: transparent;
+                border-color: area.has-hover ? Palette.border-focus : Palette.border;
+                border-width: 2px;
+                border-radius: 8px;
+                vertical-stretch: 1;
             }
         }
     }