do some moving

modules/de/home/eww/configDir/topBar/sysinfo.yuck

@@ -0,0 +1,23 @@
+(deflisten bat 
+  :initial "<span foreground=\"#cc241d\">BAT0 ERR</span>"
+  { "~/.config/eww/scripts/bat.nu auto"}
+)
+
+(defwidget cpu [] 
+  (box
+    :class "cpuIndicator"
+    (label
+      :markup "<span foreground=\"#d65d0e\"></span> ${strlength(round(EWW_CPU.avg, 0)) == 1 ? " ${round(EWW_CPU.avg, 0)}" : round(EWW_CPU.avg, 0)}<span foreground=\"#7c6f64\">%</span>"
+    )
+  )
+)
+
+(defwidget mem []
+  (box 
+    :class "memIndicator"
+    (label
+      :markup "<span foreground=\"#d65d0e\"> </span> ${round(EWW_RAM.used_mem_perc, 0)}<span foreground=\"#7c6f64\">%</span>"
+    )
+  )
+)
+

modules/de/home/eww/configDir/topBar/time.yuck

@@ -0,0 +1,10 @@
+(defwidget time []
+  (label 
+    :markup { 
+      formattime(
+        EWW_TIME, 
+        "<span foreground=\"#d65d0e\"></span> %Y<span foreground=\"#7c6f64\">-</span>%m<span foreground=\"#7c6f64\">-</span>%d <span foreground=\"#d65d0e\"></span> %H<span foreground=\"#7c6f64\">:</span>%M<span foreground=\"#7c6f64\">:</span>%S "
+      ) 
+    }
+  )
+)

modules/de/home/eww/configDir/topBar/topBar.yuck

@@ -0,0 +1,55 @@
+(include "topBar/time.yuck")
+(include "topBar/sysinfo.yuck")
+(include "util.yuck")
+
+(defwindow topBar
+  :monitor 0 
+  :stacking "fg"
+  :wm-ignore true
+  :exclusive true
+  :geometry (geometry
+              :width "100%"
+              :height "33px"
+              :anchor "top center")
+  (topBar))
+
+(defwidget topBar []
+  (overlay
+    :class "topBar"
+    (transform
+      :translate-y "-1.5px"
+      (centerbox
+        (box
+          :halign "start"
+          :spacing 12
+          :space-evenly false
+          (label :text " ")
+          (cpu)
+          (sep)
+          (mem)
+          (label :markup bat)
+        )
+        (box
+          :halign "center"
+          (systray
+            :icon-size 18
+            :spacing 3
+          )
+        )
+        (box
+          :halign "end"
+          (time)
+        )
+      )
+    )
+    (box
+      :class "transFlag"
+      :height 1
+      ( flagEl :flipped false :color "#5BCEFA")
+      ( flagEl :flipped false :color "#F5A9B8")
+      ( flagEl :flipped false :color "#FFFFFF")
+      ( flagEl :flipped false :color "#F5A9B8")
+      ( flagEl :flipped false :color "#5BCEFA")
+    )
+  )
+)