diff --git a/modules/hyprland/settings.nix b/modules/hyprland/settings.nix
index 0592c27..577c338 100644
--- a/modules/hyprland/settings.nix
+++ b/modules/hyprland/settings.nix
@@ -145,6 +145,7 @@
     ];
     layerrule = [
       "match:namespace ^(notifications)$, no_screen_share true"
+      "match:namespace ^(quickshell)$, blur true"
     ];
     # exec-once = [
     # ];
diff --git a/modules/quickshell/quickshell/bar/widgets/Battery.qml b/modules/quickshell/quickshell/bar/widgets/Battery.qml
index e82e9df..2b0b33e 100644
--- a/modules/quickshell/quickshell/bar/widgets/Battery.qml
+++ b/modules/quickshell/quickshell/bar/widgets/Battery.qml
@@ -10,12 +10,18 @@ import Quickshell.Services.UPower
 import "common" as Common
 
 Rectangle {
-	// TODO eventually fix the alignment (it isnt centered horizentally)
+    // TODO eventually fix the alignment (it isnt centered horizentally)
     id: root
     property int battPercent: 58
     implicitWidth: itemContent.width + 8
     implicitHeight: 24
-		visible: {if (UPower.displayDevice.ready) { true } else {false}}
+    visible: {
+        if (UPower.displayDevice.ready) {
+            true;
+        } else {
+            false;
+        }
+    }
     radius: 5.5
     Layout.alignment: Qt.AlignVCenter
     color: "#2a2a2a" // Define item color
@@ -24,53 +30,57 @@ Rectangle {
         implicitWidth: 24
         implicitHeight: 24
         anchors.centerIn: parent
-				Text {
-					// anchors.centerIn: parent
-					text: UPower.displayDevice.percentage + "%"
-					color: Common.Colors.colors.primary
-					font.weight: Font.DemiBold
-					font.pointSize: 12
-				}
-				Item {
-					Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
-					Text {
-						anchors.centerIn: parent
-						text: root.getBatteryState(UPower.displayDevice.percentage, (UPower.displayDevice.changeRate > 0))
-						color: root.getBatteryColor(UPower.displayDevice.percentage)
-						font.weight: Font.DemiBold
-						font.pointSize: 24/1.4
-				}
-			}
+        Text {
+            // anchors.centerIn: parent
+            text: UPower.displayDevice.percentage * 100 + "%"
+            color: Common.Colors.colors.primary
+            font.weight: Font.DemiBold
+            font.pointSize: 12
+        }
+        Item {
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+            implicitWidth: icon.width
+            implicitHeight: icon.height
+            Text {
+                id: icon
+                anchors.centerIn: parent
+                text: root.getBatteryState(UPower.displayDevice.percentage * 100, (UPower.displayDevice.changeRate))
+                color: root.getBatteryColor(UPower.displayDevice.percentage * 100)
+                font.weight: Font.DemiBold
+                font.pointSize: 24 / 1.4
+            }
+        }
     }
-function getBatteryState(level, isCharging) {
-    if (level === null || level === 0) {
-        // Return the battery empty icon
-        return isCharging ? Common.Icons.battery.charging["1"] : Common.Icons.battery["0"];
+    function getBatteryState(level, isCharging) {
+        if (level === null || level === 0) {
+            // Return the battery empty icon
+            return isCharging ? Common.Icons.battery.charging["1"] : Common.Icons.battery["0"];
+        }
+
+        if (level === 100) {
+            // Return the battery full icon
+            return isCharging ? Common.Icons.battery.charging["10"] : Common.Icons.battery["10"];
+        }
+
+        // Calculate step as a value between 1 and 10 (divide level into 10 ranges)
+        let step = Math.ceil(level / 10); // Range mapping
+        if (step > 10)
+            step = 10; // Clamp to 10 if it exceeds bounds
+
+        // Return the correct icon based on state
+        return isCharging ? Common.Icons.battery.charging[String(step)] : Common.Icons.battery[String(step)];
     }
+    function getBatteryColor(level) {
+        if (level === null || level === 0) {
+            // Use critical color for empty battery
+            return Common.Colors.colors.critial2;
+        }
 
-    if (level === 100) {
-        // Return the battery full icon
-        return isCharging ? Common.Icons.battery.charging["10"] : Common.Icons.battery["10"];
+        if (level > 0 && level <= 20) {
+            // Use critical color for low battery
+            return Common.Colors.colors.critial2;
+        }
+        // Default color if no specific condition is met
+        return Common.Colors.colors.primary;
     }
-
-    // Calculate step as a value between 1 and 10 (divide level into 10 ranges)
-    let step = Math.ceil(level / 10); // Range mapping
-    if (step > 10) step = 10; // Clamp to 10 if it exceeds bounds
-
-    // Return the correct icon based on state
-    return isCharging ? Common.Icons.battery.charging[String(step)] : Common.Icons.battery[String(step)];
-}
-function getBatteryColor(level) {
-    if (level === null || level === 0) {
-        // Use critical color for empty battery
-        return Common.Colors.colors.critial2;
-    }
-
-    if (level > 0 && level <= 20) {
-        // Use critical color for low battery
-        return Common.Colors.colors.critial2;
-    }
-    // Default color if no specific condition is met
-    return Common.Colors.colors.primary;
-}
 }
diff --git a/modules/quickshell/quickshell/bar/widgets/common/Icons.qml b/modules/quickshell/quickshell/bar/widgets/common/Icons.qml
index 722355c..74b71df 100755
--- a/modules/quickshell/quickshell/bar/widgets/common/Icons.qml
+++ b/modules/quickshell/quickshell/bar/widgets/common/Icons.qml
@@ -12,31 +12,32 @@ Singleton {
     //         speaker: "../../../assets/bar/V2/speaker.svg",
     //         speakerOff: "../../../assets/bar/V2/speakerOff.svg"
     //     })
-		readonly property var battery: ({
-			"0": "󰂎",
-			"1": "󰁺",
-			"2": "󰁻",
-			"3": "󰁼",
-			"4": "󰁾",
-			"5": "󰁾",
-			"6": "󰁿",
-			"7": "󰂀",
-			"8": "󰂁",
-			"9": "󰂂",
-			"10": "󰁹",
-			charging: ({
-				"1": "󰢜",
-				"2": "󰂆",
-				"3": "󰂇",
-				"4": "󰂈",
-				"5": "󰢝",
-				"6": "󰂉",
-				"7": "󰢞",
-				"8": "󰂊",
-				"9": "󰂋",
-				"10": "󰂅",
-			})
-		})
+    // TODO replace all these icons with svg's
+    readonly property var battery: ({
+            "0": "󰂎",
+            "1": "󰁺",
+            "2": "󰁻",
+            "3": "󰁼",
+            "4": "󰁾",
+            "5": "󰁾",
+            "6": "󰁿",
+            "7": "󰂀",
+            "8": "󰂁",
+            "9": "󰂂",
+            "10": "󰁹",
+            charging: ({
+                    "1": "󰢜",
+                    "2": "󰂆",
+                    "3": "󰂇",
+                    "4": "󰂈",
+                    "5": "󰢝",
+                    "6": "󰂉",
+                    "7": "󰢞",
+                    "8": "󰂊",
+                    "9": "󰂋",
+                    "10": "󰂅"
+                })
+        })
 
     readonly property var audioIcons: ({
             microphone: "󰍬",