diff --git a/de/home/.config/eww/modules/bar/volume.yuck b/de/home/.config/eww/modules/bar/volume.yuck
index d22953b..9a0c112 100644
--- a/de/home/.config/eww/modules/bar/volume.yuck
+++ b/de/home/.config/eww/modules/bar/volume.yuck
@@ -5,14 +5,14 @@
     :revealvar reveal_volume
     :revealvar-name "reveal_volume"
     (button :onclick 'pavucontrol-qt --tab 3'
-            :class {(volume == 0) ? '' : 'active'}
+            :class "${(volume == 0) ? '' : 'active'} revealer-preview"
       {(volume == 0) ? "" : ((volume > 50) ? "" : "")})
     (volume_children)))
 
 (deflisten volume :initial "50"
   "scripts/bar/volume")
 (defwidget volume_children []
-  (box :class "reveal_children"
+  (box :class "reveal-children"
     :orientation "h"
     :space-evenly false
     :halign "center"
diff --git a/de/home/.config/eww/style/bar/bluetooth.scss b/de/home/.config/eww/style/bar/bluetooth.scss
index 8a5c41d..97d9c22 100644
--- a/de/home/.config/eww/style/bar/bluetooth.scss
+++ b/de/home/.config/eww/style/bar/bluetooth.scss
@@ -1,8 +1,4 @@
 .bluetooth {
-//  .revealer-preview {
-//    background-color: $color4;
-//    border-radius: $bar-module-border-radius - 4;
-//  }
   margin: 0px 5px;
   $module-color: $color4;
   @import "./revealer.scss";
diff --git a/de/home/.config/eww/style/bar/networking.scss b/de/home/.config/eww/style/bar/networking.scss
index 9dac29b..b365ee7 100644
--- a/de/home/.config/eww/style/bar/networking.scss
+++ b/de/home/.config/eww/style/bar/networking.scss
@@ -1,5 +1,7 @@
 .networks {
-  margin: 0px 10px;
+  margin: 0px 5px;
+  $module-color: darker($color5);
+  @import "./revealer.scss";
 }
 
 .vpn {
diff --git a/de/home/.config/eww/style/bar/revealer.scss b/de/home/.config/eww/style/bar/revealer.scss
index 53cd01c..8f24d65 100644
--- a/de/home/.config/eww/style/bar/revealer.scss
+++ b/de/home/.config/eww/style/bar/revealer.scss
@@ -1,27 +1,27 @@
-//background-color: blue;
 &.revealer-on-hover {
   border: 2px solid $module-color;
   border-radius: $bar-module-border-radius;//
 }
-.revealer-preview {
+.revealer-preview,
+.reveal-children>* {
   padding: 0px 5px;
+  min-width: $bar-module-width;
+}
+.revealer-preview {
   background-color: $module-color;
-//  border: 2px solid $module-color;
   border-radius: $bar-module-border-radius - 4;
+  transition: all 0.3s;
 }
 &.true .revealer-preview {
   border-radius: $bar-module-border-radius - 4 0 0 $bar-module-border-radius - 4;
 }
-//&.false {
-//  color: red;
-//}
 .reveal-children>* {
   border-left: 2px solid $module-color;
-//  background-color: $module-color;
 }
+
 //.revealer-on-hover>widget>box>box>* {
 //  
 //  padding: 0px 5px;
-//  min-width: $bar-module-width;
+//  
 //  transition: all 0.3s;
 //}
diff --git a/de/home/.config/eww/style/bar/volume.scss b/de/home/.config/eww/style/bar/volume.scss
index 2c3c22a..b22c9d6 100644
--- a/de/home/.config/eww/style/bar/volume.scss
+++ b/de/home/.config/eww/style/bar/volume.scss
@@ -1,3 +1,5 @@
 .volume {
-  margin: 0px 10px;
+  margin: 0px 5px;
+  $module-color: darker($color3);
+  @import "./revealer.scss";
 }