updated quickshell

home/hypr/quickshell/components/TopStrip.qml

@@ -5,6 +5,11 @@ import Quickshell.Wayland
 import "../theme"
 import ".."
 
+// Nerd Font glyphs (JetBrainsMono Nerd Font, installed system-wide)
+// \uF1EB wifi   \uF796 ethernet   \uF538 memory   \uF1C0 disk
+// \uF028 volume \uF185 brightness \uF240 battery \uF0E7 charging
+// \uF017 clock  \uF2DB cpu
+
 PanelWindow {
     id: root
 
@@ -38,33 +43,87 @@ PanelWindow {
         color: Theme.glassBorder
     }
 
+    // --------------------------------------------------------------------
+    // Helpers to compose rich-text status segments
+    // --------------------------------------------------------------------
+    function pad(num) {
+        if (num === undefined || num === null) return "00";
+        return num < 10 ? "0" + num : num.toString();
+    }
+
+    function seg(icon, value, iconColor, valueColor) {
+        return "<font color=\"" + iconColor + "\">" + icon + "</font><font color=\"" + valueColor + "\"> " + value + "</font>";
+    }
+
+    function buildStats() {
+        const c = "#e5e2e1";
+        const dim = "#adaaaa";
+        const volt = "#CFFC00";
+        const coral = "#FF7A59";
+        const sep = "<font color=\"#2a2929\">  //  </font>";
+        const parts = [];
+
+        // Network: type icon + SSID (wifi) + IP
+        if (GlobalState.wifiConnected) {
+            const icon = GlobalState.connectionType === "wifi" ? "\uF1EB" : "\uF796";
+            const label = (GlobalState.connectionType === "wifi" && GlobalState.wifiSsid !== "") ? GlobalState.wifiSsid : "eth";
+            parts.push(seg(icon, label + " " + (GlobalState.ipAddress !== "" ? GlobalState.ipAddress : "\u2014"), volt, c));
+        } else {
+            parts.push(seg("\uF1EB", "offline", coral, dim));
+        }
+
+        // Memory (used GB / total GB)
+        parts.push(seg("\uF538", GlobalState.memUsedGb + "G / " + GlobalState.memTotalGb + "G",
+                       GlobalState.memPercent > 85 ? coral : dim, c));
+
+        // Disk (root filesystem percent)
+        parts.push(seg("\uF1C0", GlobalState.diskPercent + "%",
+                       GlobalState.diskPercent > 90 ? coral : dim, c));
+
+        // Audio (mute state flips icon + color)
+        if (GlobalState.volumeMuted) {
+            parts.push(seg("\uF026", "mute", coral, dim));
+        } else {
+            parts.push(seg("\uF028", GlobalState.volume + "%", dim, c));
+        }
+
+        // Display brightness
+        parts.push(seg("\uF185", GlobalState.brightness + "%", dim, c));
+
+        // Battery (only when present, e.g. laptops)
+        if (GlobalState.batteryPresent) {
+            const icon = GlobalState.batteryCharging ? "\uF0E7" : "\uF240";
+            parts.push(seg(icon, GlobalState.batteryPercent + "%",
+                           GlobalState.batteryPercent < 20 ? coral : dim, c));
+        }
+
+        return parts.join(sep);
+    }
+
     RowLayout {
         anchors.fill: parent
         anchors.leftMargin: 16
         anchors.rightMargin: 16
         spacing: 16
 
-        // Left Section
+        // Left Section: workspace indicator
         Text {
             id: workspaceIndicator
             Layout.alignment: Qt.AlignVCenter
-            font.family: Theme.fontMono
+            textFormat: Text.RichText
+            font.family: "JetBrainsMono Nerd Font"
             font.pixelSize: 12
-            color: Theme.textMuted
-            
-            function pad(num) {
-                if (num === undefined || num === null) return "00";
-                return num < 10 ? "0" + num : num.toString();
-            }
 
-            text: pad(GlobalState.activeWorkspace) + " // " + (GlobalState.workspaceNames[GlobalState.activeWorkspace] !== undefined ? GlobalState.workspaceNames[GlobalState.activeWorkspace] : "main")
-
-            Behavior on color {
-                ColorAnimation { duration: 150 }
+            text: {
+                const name = GlobalState.workspaceNames[GlobalState.activeWorkspace] !== undefined
+                    ? GlobalState.workspaceNames[GlobalState.activeWorkspace] : "main";
+                return "<font color=\"#CFFC00\">" + pad(GlobalState.activeWorkspace) + "</font>"
+                     + "<font color=\"#2a2929\"> // </font>"
+                     + "<font color=\"#adaaaa\">" + name + "</font>";
             }
         }
 
-        // Center Section
+        // Center Section: focused window title
         Text {
             id: windowTitle
             Layout.fillWidth: true
@@ -84,18 +143,35 @@ PanelWindow {
             }
         }
 
-        // Right Section
+        // Right Section: live system stats (click to open the System HUD)
+        Text {
+            id: stats
+            Layout.alignment: Qt.AlignVCenter
+            textFormat: Text.RichText
+            font.family: "JetBrainsMono Nerd Font"
+            font.pixelSize: 11
+
+            text: buildStats()
+
+            MouseArea {
+                id: statsMouse
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                onClicked: GlobalState.toggleSystemHud()
+            }
+        }
+
+        // Clock
         Text {
             id: clock
             Layout.alignment: Qt.AlignVCenter
-            font.family: Theme.fontMono
+            textFormat: Text.RichText
+            font.family: "JetBrainsMono Nerd Font"
             font.pixelSize: 12
-            color: Theme.textPrimary
-            text: GlobalState.timeString
 
-            Behavior on color {
-                ColorAnimation { duration: 150 }
-            }
+            text: "<font color=\"#adaaaa\">\uF017</font>"
+                + "<font color=\"#ffffff\"> " + GlobalState.timeString + "</font>"
         }
     }
 }