Adds more visual hour notify

.config/eww/eww.scss

@@ -11,6 +11,10 @@
   background: $background;
   border-radius: $border-radius;
   border: 1px solid $border-color;
+
+  &.default-padding {
+    padding: 1rem;
+  }
 }
 
 @import "./widgets/media/style.scss"

.config/eww/eww.yuck

@@ -1 +1,2 @@
 (include "./widgets/media/media.yuck")
+(include "./widgets/hour-notify/widget.yuck")

.config/eww/widgets/hour-notify/widget.yuck

@@ -0,0 +1,46 @@
+(defpoll hour-time :interval '1s' :initial '0' `date +"%H"`)
+
+(defwidget hour-notify []
+  (eventbox 
+    :onclick "${EWW_CMD} close hour"
+    (box 
+      :class "widget default-padding"
+      :height 150
+      :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"
+      )
+      (label
+        :text "Now: ${hour-time}:00"
+      )
+    )
+  )
+
+)
+
+(defwindow hour
+  :monitor 1
+  :geometry (geometry 
+    :x "0"
+    :y "50px"
+    :width "50px"
+    :height "50px"
+    :anchor "top center")
+  :stacking "fg"
+  (hour-notify)
+  )