diff --git a/de/home/.config/eww/modules/bar/battery.yuck b/de/home/.config/eww/modules/bar/battery.yuck
index b480ef2..106a188 100644
--- a/de/home/.config/eww/modules/bar/battery.yuck
+++ b/de/home/.config/eww/modules/bar/battery.yuck
@@ -5,7 +5,8 @@
     :revealvar reveal_battery
     :revealvar-name "reveal_battery"
     (label
-      :class "revealer-preview {(EWW_BATTERY == '' || jq(EWW_BATTERY,'.[].status?','r') == 'Charging') ? 'active' : '' }"
+      :class "revealer-preview ${(EWW_BATTERY == '' || jq(EWW_BATTERY,'.[].status?','r') == 'Charging') ? 'active' : '' }"
+;      :class "revealer-preview ${(EWW_BATTERY == '' || jq(EWW_BATTERY,'.[].status?','r') == 'Charging') ? 'active' : 'inactive' }"
 ;            :tooltip "${jq(EWW_BATTERY,'.[].capacity?')}%"
 ;      {(EWW_BATTERY == "") ? "" : `${(jq(EWW_BATTERY,'.[].status?') == '"Charging"') ? " ${jq(EWW_BATTERY,'.[].capacity?')}%" : " ${jq(EWW_BATTERY,'.[].capacity?')}%"}`})
       :text `${(EWW_BATTERY == "" || jq(EWW_BATTERY,'.[].status?') == '"Charging"') ? " " : "󰁹 "}${(EWW_BATTERY == "") ? "" : "${round(jq(EWW_BATTERY,'.[].capacity?'),0)}%"}`)
diff --git a/de/home/.config/eww/style/bar.scss b/de/home/.config/eww/style/bar.scss
index 7342263..229a756 100644
--- a/de/home/.config/eww/style/bar.scss
+++ b/de/home/.config/eww/style/bar.scss
@@ -90,7 +90,7 @@ $transition-time: 0.3s;
   @import "./bar/volume.scss";
   @import "./bar/networking.scss";
   @import "./bar/bluetooth.scss";
-  @import "./bar/power.scss";
+//  @import "./bar/battery.scss";
 //  @import "./bar/disk.scss";
 //  @import "./bar/memory.scss";
   @import "./bar/sys.scss";
diff --git a/de/home/.config/eww/style/bar/battery.scss b/de/home/.config/eww/style/bar/battery.scss
new file mode 100644
index 0000000..07bbdff
--- /dev/null
+++ b/de/home/.config/eww/style/bar/battery.scss
@@ -0,0 +1,6 @@
+.battery {
+  margin: 0px 5px;
+  $module-color: $color3;
+//  $module-color: mix($color9, $color0, 75%);
+  @import "./styles/revealer.scss";
+}
diff --git a/de/home/.config/eww/style/bar/styles/revealer.scss b/de/home/.config/eww/style/bar/styles/revealer.scss
index daae045..6a94543 100644
--- a/de/home/.config/eww/style/bar/styles/revealer.scss
+++ b/de/home/.config/eww/style/bar/styles/revealer.scss
@@ -11,17 +11,18 @@
 //  background: linear-gradient($bar-bg-color 65%, $module-color);
   background-color: rgba($bar-bg-color,0.5);
     &.active {
-//      background-color: rgba($module-color,0.5);
-      background: mix(rgba($bar-bg-color,0.5), rgba($module-color,0.5));
+      background: mix(rgba($bar-bg-color,0.5), rgba($module-color,0.5),25%);
       &:hover {
-        background: mix(rgba($bar-bg-color,0.75), rgba($module-color,0.75));        
+        background: linear-gradient(mix(rgba($bar-bg-color,0.5), rgba($module-color,0.5)) 15%, rgba($bar-bg-color,0.5));
+//        background: mix(rgba($bar-bg-color,0.75), rgba($module-color,0.75));        
       }
     }
     &.inactive {
-      background-color: rgba($bar-bg-color,0.5);
+      background-color: rgba($bar-bg-color,0.3);
       color: rgba($bar-fg-color,0.5);
       &:hover {
-        background: mix(rgba($bar-bg-color,0.5), rgba($module-color,0.5));
+        background: linear-gradient(rgba($bar-bg-color,0.3) 15%, rgba($module-color,0.3));
+//        background: mix(rgba($bar-bg-color,0.5), rgba($module-color,0.5));
       }
     }
 /*    &:hover {
diff --git a/de/home/.config/eww/style/bar/sys.scss b/de/home/.config/eww/style/bar/sys.scss
index d3ef7a1..8b2b4e6 100644
--- a/de/home/.config/eww/style/bar/sys.scss
+++ b/de/home/.config/eww/style/bar/sys.scss
@@ -10,6 +10,6 @@
 }
 .battery {
   margin: 0px 5px;
-  $module-color: mix($color0,$color2,25%);
+  $module-color: mix($color0,$color3,20%);
   @import "./styles/revealer.scss"
 }