diff --git a/.config/eww/widgets/bar/elements/time.yuck b/.config/eww/widgets/bar/elements/time.yuck
index eebda11..d257755 100644
--- a/.config/eww/widgets/bar/elements/time.yuck
+++ b/.config/eww/widgets/bar/elements/time.yuck
@@ -3,6 +3,26 @@
 (defwidget bar-time []
   (box
     :class "widget default-padding"
+    :space-evenly false
+    :spacing 10
     {bar-time-display}
+    "|"
+
+    (label
+      :visible {hour-time <= 6 || hour-time > 22}
+      :text ""
+    )
+    (label
+      :visible {hour-time > 6 && hour-time <= 10}
+      :text ""
+    )
+    (label
+      :visible {hour-time > 10 && hour-time <= 18}
+      :text ""
+    )
+    (label
+      :visible {hour-time > 18 && hour-time <= 22}
+      :text ""
     )
   )
+)
diff --git a/.config/eww/widgets/bar/style.scss b/.config/eww/widgets/bar/style.scss
index 271c0a8..be23bca 100644
--- a/.config/eww/widgets/bar/style.scss
+++ b/.config/eww/widgets/bar/style.scss
@@ -2,6 +2,7 @@
   margin: 0 10px;
   .default-padding {
     padding: 0.5rem 1rem;
+    padding-right: 1.3rem;
   }
 }
 
diff --git a/.config/eww/widgets/hour-notify/widget.yuck b/.config/eww/widgets/hour-notify/widget.yuck
index 3a3e850..a594671 100644
--- a/.config/eww/widgets/hour-notify/widget.yuck
+++ b/.config/eww/widgets/hour-notify/widget.yuck
@@ -1,5 +1,26 @@
 (defpoll hour-time :interval '1s' :initial '0' `date +"%H"`)
 
+(defwidget hour-icon [] 
+  (box 
+    (image
+      :visible {hour-time <= 6 || hour-time > 22}
+      :icon "time_moon"
+    )
+    (image
+      :visible {hour-time > 6 && hour-time <= 10}
+      :icon "time_moon_to_sun"
+    )
+    (image
+      :visible {hour-time > 10 && hour-time <= 18}
+      :icon "time_sun"
+    )
+    (image
+      :visible {hour-time > 18 && hour-time <= 22}
+      :icon "time_sun_to_moon"
+    )
+  )
+)
+
 (defwidget hour-notify []
   (eventbox 
     :onclick "${EWW_CMD} close hour"
@@ -9,22 +30,7 @@
       :width 150
       :orientation "v"
       :space-evenly false
-      (image
-        :visible {hour-time <= 6 || hour-time > 22}
-        :icon "time_moon"
-      )
-      (image
-        :visible {hour-time > 6 && hour-time <= 10}
-        :icon "time_moon_to_sun"
-      )
-      (image
-        :visible {hour-time > 10 && hour-time <= 18}
-        :icon "time_sun"
-      )
-      (image
-        :visible {hour-time > 18 && hour-time <= 22}
-        :icon "time_sun_to_moon"
-      )
+      (hour-icon)
       (label
         :text "Now: ${hour-time}:00"
       )