wbar: add volume and battery icons

dots/.config/quickshell/ii/modules/waffle/bar/SystemButton.qml

@@ -16,9 +16,28 @@ BarButton {
         Row {
             id: column
             anchors.centerIn: parent
+            spacing: 4
             
             FluentIcon {
-                icon: "speaker" // System icon
+                icon: WIcons.internetIcon
+            }
+            
+            FluentIcon {
+                icon: {
+                    const muted = Audio.sink?.audio.muted ?? false;
+                    const volume = Audio.sink?.audio.volume ?? 0;
+                    if (muted) return volume > 0 ? "speaker-off" : "speaker-none";
+                    if (volume == 0) return "speaker-none";
+                    if (volume < 0.5) return "speaker-1";
+                    return "speaker";
+                }
+            }
+
+            FluentIcon {
+                icon: {
+                    print(WIcons.batteryIcon)
+                    return WIcons.batteryIcon
+                }
             }
         }
     }

dots/.config/quickshell/ii/modules/waffle/looks/FluentIcon.qml

@@ -6,12 +6,15 @@ import qs.modules.waffle.looks
 Kirigami.Icon {
     id: root
     required property string icon
-    property int implicitSize: 18 // Should be 16, but it appears the icons have some padding
+    // Should be 16, but it appears the icons have some padding, 
+    // Unlike the Windows-only Segoe UI icons, the open source FluentUI ones are hella small
+    property int implicitSize: 20
     implicitWidth: implicitSize
     implicitHeight: implicitSize
 
+    source: `${Looks.iconsPath}/${root.icon}.svg`
     roundToIconSize: false
     color: Looks.colors.fg
     isMask: true
-    source: `${Looks.iconsPath}/${root.icon}.svg`
+    animated: true
 }

dots/.config/quickshell/ii/modules/waffle/looks/Looks.qml

@@ -42,17 +42,13 @@ Singleton {
         property QtObject family: QtObject {
             property string ui: "Noto Sans"
         }
-        property QtObject weight: QtObject {
-            property int regular: Font.Normal
+        property QtObject weight: QtObject { // Noto is not Segoe, so we might use slightly different weights
+            property int regular: Font.Medium
             property int strong: Font.DemiBold
             property int stronger: Font.Bold
-        }
-        property QtObject variableAxes: QtObject {
-            
         }
         property QtObject pixelSize: QtObject {
-            property int small: 10
-            property int normal: 11
+            property real normal: 11
         }
     }
 

dots/.config/quickshell/ii/modules/waffle/looks/WIcons.qml

@@ -0,0 +1,31 @@
+pragma Singleton
+import QtQuick
+import Quickshell
+import qs.services
+
+Singleton {
+    id: root
+
+    property string internetIcon: {
+        if (Network.ethernet) return "ethernet";
+        if (Network.wifiEnabled) {
+            const strength = Network.networkStrength;
+            if (strength > 75) return "wifi-1";
+            if (strength > 50) return "wifi-2";
+            if (strength > 25) return "wifi-3";
+            return "wifi-4";
+        }
+        if (Network.wifiStatus === "connecting") return "wifi-4";
+        if (Network.wifiStatus === "disconnected") return "wifi-off";
+        if (Network.wifiStatus === "disabled") return "wifi-off";
+        return "wifi-warning";
+    }
+
+    property string batteryIcon: {
+        if (Battery.isCharging) return "battery-charge";
+        if (Battery.isCriticalAndNotCharging) return "battery-warning";
+        if (Battery.percentage >= 0.9) return "battery-full";
+        return `battery-${Math.ceil(Battery.percentage * 10)}`;
+    }
+    
+}