Color and Transperencyof Bar, Added TODOs, Rectangle width and height depending on Text inside

modules/bar/Bar.qml

@@ -3,9 +3,13 @@ import Quickshell
 import Quickshell.Hyprland
 import "./widgets"
 
+// TODO: interact with PyWal
+
 PanelWindow {
     id: panel
 
+    color: "transparent"
+
     anchors.top: true
     anchors.left: true
     anchors.right: true
@@ -25,7 +29,7 @@ PanelWindow {
     Rectangle { // Bar
         id: bar
         anchors.fill: parent   
-        color: "#1a1a1a"
+        color: "#800a0a0a"
         radius: 0
 
         Row {   // bar widgets left
@@ -42,7 +46,7 @@ PanelWindow {
                 thisMonitor: barThisMonitor 
                 anchors.verticalCenter: parent.verticalCenter
             }
-
+            // TODO: Maybe add current Apps in workspace
 
         }
 
@@ -53,6 +57,8 @@ PanelWindow {
 
             Clock {}
 
+            // TODO: Add a way to see Date (maybe hover or click)
+
         }
 
         Row { // bar widgets right
@@ -63,7 +69,11 @@ PanelWindow {
             anchors.rightMargin: 16
             spacing: 8
 
+            // TODO: Add bluetooth, network, audio, power, maybe HW monitor
+
         }
 
+        // TODO: Somewhere add Tray
+
     }
 }

modules/bar/widgets/Clock.qml

@@ -2,6 +2,14 @@ import QtQuick
 import Quickshell
 import Quickshell.Hyprland
 
+Rectangle {  //workspace
+    width: timeDisplay.width + 16
+    height: timeDisplay.height + 16
+    radius: 4
+    color: "#333333"
+    border.color: "#555555"
+    border.width: 2
+
     Text {
         id: timeDisplay
 
@@ -9,9 +17,11 @@ Text {
 
         text: currentTime
         color: "#ffffff"
-    font.pixelSize: 14
+        font.pixelSize: 18
         font.family: "Inter, sans-serif"
 
+        anchors.centerIn: parent
+
         //Update time every second
         Timer {
             interval: 1000
@@ -23,3 +33,4 @@ Text {
             }
         }
     }
+}

modules/bar/widgets/Workspaces.qml

@@ -14,8 +14,8 @@ Row {   // Workspace Row
 
         Rectangle {  //workspace
             visible: modelData.monitor === thisMonitor  
-            width: 32
-            height: 24
+            width: workspaceNum.width + 16
+            height: workspaceNum.height + 8
             radius: 4
             color: modelData.active ? "#4a93ff": "#333333"
             border.color: "#555555"
@@ -29,19 +29,21 @@ Row {   // Workspace Row
             }
 
             Text {
+                id: workspaceNum
                 text: modelData.id
                 anchors.centerIn: parent
                 color: modelData.active ? "#ffffff" : "#cccccc"
-                font.pixelSize: 12
+                font.pixelSize: 18
                 font.family: "Inter, sans-serif"
             }
         }
+
     }
 
     Text {
         visible: Hyprland.workspaces.length === 0
         text: "No Workspaces"
         color: "#ffffff"
-        font.pixelSize: 12
+        font.pixelSize: 18
     }
 }