added computer stats widget

modules/ewwbar/eww-config/dashboard/dashboard.scss

@@ -7,7 +7,7 @@
     // background-image: linear-gradient(45deg, #7d7d7d, #262626 30%, #262626 60%, #10384a);
     border-radius: 16px;
     background-repeat: no-repeat;
-    background-size: 400px 150px;
+    background-size: 500px 150px;
 }
 
 .dash_clock_bg {
@@ -70,11 +70,29 @@
 	all: unset;
 	background-color: #3A404C;
 	border-radius: 8px;
-	min-height: 20px;
+	min-height: 10px;
-	min-width: 200px;
+	min-width: 210px;
 	margin : 10px 0px 0px 0px;
 }
 
+.arc_container {
+    margin-left: 25px;
+    margin-right: 25px;
+}
+
+.res_cpu {
+    color: #FD5B85;
+    background-color: #7e2d42;
+}
+.res_mem {
+    color: #B1A6EE;
+    background-color: #585376;
+}
+.res_hdd {
+    color: #67D4F1;
+    background-color: #336a78;
+}
+
 .btn_logout, .btn_restart, .btn_shutdown, .btn_switch_windows {
     font-size: 40px;
     font-weight: bold;

modules/ewwbar/eww-config/dashboard/dashboard.yuck

@@ -68,11 +68,11 @@
               :spacing 10 
               :space-evenly "false"
               :vexpand "false"
-              :hexpand "false" 
+              :hexpand "true" 
              (label :class "music_title"
                     :halign "center"
                     :wrap "true"
-                    :limit-width 20
+                    :limit-width 30
                     :text music_title
                     )
              (label :class "music_artist"
@@ -94,10 +94,68 @@
             )
             (box :class "music_bar" :halign "center" :vexpand "false" :hexpand "false" 
 				(scale :min 0 :active "true" :max 100 :value music_percentage)
-            )
+            ))))
+
+(defwidget dash_computer_status []
+    (box :class "dash_window" 
+         :orientation "v"
+         :space-evenly "false"
+         :hexpand "false"
+         :vexpand "false"
+         (box :class "arc_container"
+              :hexpand "false"
+              :width 200
+              :height 200
+              :valign "center"
+              :halign "center"
+               (circular-progress :class "res_cpu"
+                                  :value {EWW_CPU.avg}
+                                  :thickness 5
+                        (box :orientation "v"
+                             :halign "center"
+                             :valign "center"
+                             :vexpand "false"
+                            (label :class "small_circle_text" :text "CPU")
+                            (label :class "small_circle_text" :text "${round(EWW_CPU.avg, 2)}%")
+                    ))
         )
-    )
+         (box :orientation "h"
-)
+              :vexpand "true"
+              :valign "center"
+              (box :class "arc_container"
+                   :width 125
+                   :height 125
+                   :valign "center"
+                   :halign "center"
+                   (circular-progress :class "res_mem"
+                                      :value {EWW_RAM.used_mem_perc}
+                                      :thickness 5
+                        (box :orientation "v"
+                             :halign "center"
+                             :valign "center"
+                             :vexpand "false"
+                            (label :class "small_circle_text" :text "RAM")
+                            (label :class "small_circle_text" :text "${round(EWW_RAM.used_mem_perc, 2)}%")
+                    )
+                )
+              )
+              (box :class "arc_container"
+                   :width 125
+                   :height 125
+                   :valign "center"
+                   :halign "center"
+                   (circular-progress :class "res_hdd"
+                                      :value {EWW_DISK["/"].used_perc}
+                                      :thickness 5
+                        (box :orientation "v"
+                             :halign "center"
+                             :valign "center"
+                             :vexpand "false"
+                            (label :class "small_circle_text" :text "Disk")
+                            (label :class "small_circle_text" :text "${round(EWW_DISK["/"].used_perc, 2)}%")
+                    ))
+                ))))
+
 
 (defwidget logout []
     (box :class "dash_window"
@@ -136,9 +194,9 @@
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 760
+    :geometry (geometry :x 710
-                        :y 200
+                        :y 300
-                        :width 400
+                        :width 500
                         :height 150)
     (dash_clock)
 )
@@ -147,9 +205,9 @@
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 760
+    :geometry (geometry :x 710
-                        :y 200
+                        :y 300
-                        :width 400
+                        :width 500
                         :height 150)
     (dash_clock_bg)
 )
@@ -158,19 +216,30 @@
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 760
+    :geometry (geometry :x 710
-                        :y 575
+                        :y 475
-                        :width 400
+                        :width 500
                         :height 150)
     (dash_music_state)
 )
 
+(defwindow dash_computer_status
+    :stacking "bg"
+    :focusable "false"
+    :monitor 0
+    :geometry (geometry :x 450 
+                        :y 300
+                        :width 250
+                        :height 350)
+    (dash_computer_status)
+)
+
 (defwindow logout
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 1400
+    :geometry (geometry :x 1220
-                        :y 200
+                        :y 300
                         :width 75 
                         :height 75)
     (logout))
@@ -179,8 +248,8 @@
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 1400
+    :geometry (geometry :x 1220
-                        :y 280
+                        :y 395
                         :width 75 
                         :height 75)
     (restart))
@@ -189,8 +258,8 @@
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 1400
+    :geometry (geometry :x 1220
-                        :y 360
+                        :y 485
                         :width 75 
                         :height 75)
     (shutdown))
@@ -199,8 +268,8 @@
     :stacking "bg"
     :focusable "false"
     :monitor 0
-    :geometry (geometry :x 1400
+    :geometry (geometry :x 1220
-                        :y 440
+                        :y 580
                         :width 75 
                         :height 75)
     (reboot_windows))

modules/ewwbar/eww-config/eww.scss

@@ -20,7 +20,7 @@ $light_bkgrnd: rgba(60, 60, 60, 0.8);
 
 .bar-section {
 	background-color: rgba(200, 200, 200, 0.5);
-	border-radius: 15;
+	border-radius: 15px;
 }
 
 .sep {

modules/ewwbar/eww-config/modules/center-clock.scss

@@ -1,5 +1,5 @@
 .center-clock {
-    border-radius: 15;
+    border-radius: 15px;
 	background-color: rgba(20, 20, 20, 0.9);
     color: rgba(200, 200, 200, 1.0);
     padding-left: 20px;

modules/hyprland/default.nix

@@ -44,8 +44,9 @@ in
 
       exec-once = [
         "${pkgs.swww}/bin/swww init & sleep 0.5 & ${pkgs.swww}/bin/swww /home/nixolas/Downloads/RecountERD.png"
-        "eww open bar;eww open logout;eww open restart;eww open shutdown;eww open reboot_windows"
+        "eww open-many bar logout restart shutdown reboot_windows dash_music dash_computer_status"
         "eww open dash_clock_bg;eww open dash_clock" # the order here matters
+        
       ];
 
       input = {