fix: Icon size to 25

eww/bar/eww.scss

@@ -12,7 +12,6 @@ $workspace_hover:        #2E5DFF;
 $widget_bg:              rgba(40, 40, 40, 0.5);
 $weather:                rgba(180, 220, 235, 0.8);
 $weather_end:            rgba(171, 233, 179, 0.8);
-$clock:                  rgba(171, 233, 179, 1.0);
 
 $media-progress-bg:   #333333;
 $media:           rgba(224, 232, 224, 0.7);
@@ -20,7 +19,7 @@ $media-paused:    rgba(224, 200, 200, 0.7);
 
 // Dims the desktop background so status icons can be seen against darker wallpapers
 $status_bg: rgba(0, 0, 0, 0.3);
-$tray_bg:   rgba(204, 204, 204, 0.1);
+$tray-bg:   rgba(204, 204, 204, 0.3);
 $tray:                 #c9cbff;
 $keyboard:             #f2cdcd;
 $idle_inhibitor:       #f28fad;
@@ -28,18 +27,34 @@ $volume:               #fae3b0;
 $microphone:           #e8a2af;
 $network:              #f8bd96;
 $backlight:            #bd93f9;
-$cpu_bg:               #333333;
+$cpu-bg:               #333333;
 $cpu:                  #96cdfb;
-$memory_bg:            #333333;
+$memory-bg:            #333333;
 // previously bluetooth colour
 $memory:               #caa9c7;
 //$memory:               #88bbeb;
-$temperature:          #ddb6f2;
+$temperature-bg:       rgba(180, 180, 180, 0.5);
-$temperature_critical: #ff6666;
+$temperature:          #b6b2b3;
-$battery:              #b6b2b3;
+$temperature-critical: #ff6666;
+$battery:          #ddb6f2;
+$clock:                  rgba(171, 233, 179, 1.0);
 
 
 // Styles all scales
+progressbar trough {
+  all: unset;
+  background-color: #333333;
+  border-radius: 5px;
+  min-height: 80px;
+  min-width: 2px;
+  //margin: .3rem 0 .3rem 0;
+}
+trough progress {
+  all: unset;
+  background-color: #00ff00;
+  border-radius: 5px;
+  min-width: 2px;
+}
 scale trough {
   all: unset;
   background-color: #333333;
@@ -61,7 +76,7 @@ trough slider {
 
 .vbar {
   background-color: transparent;
-  font-size: 15px;
+  font-size: 20px;
   font-family: monospace;
 }
 
@@ -161,6 +176,7 @@ box .weather {
 	font-family: "Noto Serif";
   min-height: 15px;
   min-width: 15px;
+  font-size: 15px;
 	color: $media;
 	border: none;
 
@@ -181,9 +197,25 @@ box .weather {
   }
 }
 
+box .temperature {
+  color: $temperature;
+	border-left: 2px solid $temperature-bg;
+  margin-bottom: 1px;
+  margin-top: 1px;
+}
+.temperature-progress-cpu trough progress {
+  background-color: mix($cpu, $temperature, 50%);
+}
+.temperature-progress-gpu trough progress {
+  background-color: $temperature;
+}
+.temperature-progress-critical trough progress {
+  background-color: $temperature-critical;
+}
+
 box .cpu {
   .progress {
-    background-color: $cpu_bg;
+    background-color: $cpu-bg;
   }
   color: $cpu;
 	border-left: 2px solid $cpu;
@@ -192,7 +224,7 @@ box .cpu {
 }
 box .memory {
   .progress {
-    background-color: $memory_bg;
+    background-color: $memory-bg;
   }
   color: $memory;
 	border-left: 2px solid $memory;
@@ -209,4 +241,5 @@ box .clock {
   //background-color: $tray_bg;
   color: $tray;
 	border-left: 2px dotted $tray;
+	border-bottom: 2px dotted $tray-bg;
 }

eww/bar/eww.yuck

@@ -1,4 +1,5 @@
 (defvar amixer "amixer -D pulse")
+(defvar temperature-monitor "psensor")
 
 (defwindow vbar
 	:exclusive true
@@ -7,16 +8,19 @@
 	:geometry (geometry
 		:x "0%"
 		:y "0%"
-		:width "20px"
+		:width "25px"
 		:height "99%"
 		:anchor "center left"
 	)
 	:reserve (struts :side "left" :distance "20px")
 	(centerbox
 		:orientation "v"
-		(box :orientation "v" :space-evenly false :valign "start"
+		(box
+			:orientation "v" :space-evenly false :valign "start"
 			(label
-				:class "launcher" :valign "start" :width "20px" :height "20px"
+				:class "launcher"
+				:valign "start"
+				:width "20px" :height "20px"
 				:unindent true
 				:tooltip active-window-title
 				:text "☯")
@@ -29,7 +33,7 @@
 			(widget-tray)
 			(widget-volume)
 			(widget-microphone)
-			;(widget-temperature)
+			(widget-temperature)
 			(widget-cpu)
 			(widget-memory)
 			(widget-clock)
@@ -41,7 +45,8 @@
 		:class "workspaces"
 		:orientation "v"
 		:space-evenly true
-		:valign "start" :spacing 10
+		:spacing 10
+		:valign "start"
 		:halign "center"
 		(for workspace in workspaces
 			(button
@@ -61,6 +66,7 @@
 		:orientation "v"
 		:space-evenly false
 		:valign "center"
+		:tooltip {media-position-text}
 		(eventbox
 			:onclick "playerctl play-pause"
 			(circular-progress
@@ -68,7 +74,6 @@
 				:width 20
 				:height 20
 				:thickness 5
-				:tooltip {media-position-text}
 				:value {100.0 * media-position / (media-length / 1000000.0)}
 				:visible {media-current != "" && media-length != 1}
 			))
@@ -117,7 +122,7 @@
 					:onchange "${amixer} sset Master {}%" ))
 			(label
 				:class "icon"
-				:width 20 :height 20
+				:width 25 :height 20
 				:xalign 0.5 :yalign 0.5
 				:noindent true
 				:text { current-volume-state == "off" ? "" : (current-volume > 50 ? "" : "") }))))
@@ -144,7 +149,7 @@
 					:onchange "${amixer} sset Capture {}%" ))
 			(label
 				:class "icon"
-				:width 20 :height 20
+				:width 25 :height 20
 				:xalign 0.5 :yalign 0.5
 				:noindent true
 				:text { current-microphone-state == "off" ? "" : "" }))))
@@ -155,22 +160,46 @@
 (defvar show-volume false)
 (defvar show-microphone false)
 
+; FIXME: Maybe use a env var here instead
+(defvar cpu-temp-key "ASUS_WMI_SENSORS_CPU_TEMPERATURE")
+(defvar gpu-temp-key "AMDGPU_MEM")
+(defvar temperature-threshold 80)
+
 (defwidget widget-temperature []
-	(label
+	(eventbox
+		:onclick temperature-monitor
+		(box
 			:class "temperature"
-		:width 20
+			:orientation "h"
-		:height 20
+			:tooltip "CPU ${EWW_TEMPS[cpu-temp-key]}C; GPU ${EWW_TEMPS[gpu-temp-key]}C"
-		:tooltip {EWW_TEMPS}
+			:space-evenly true
-		:text ""
+			:width 25
-	))
+			:halign "" :valign "center"
+			(progress
+				:class { EWW_TEMPS[cpu-temp-key] > temperature-threshold ? "temperature-progress-critical" : "temperature-progress-cpu" }
+				:halign "center" :valign "center"
+				:flipped "true"
+				:width 3
+				:orientation "v"
+				:value {EWW_TEMPS[cpu-temp-key]}
+			)
+			(progress
+				:class { EWW_TEMPS[gpu-temp-key] > temperature-threshold ? "temperature-progress-critical" : "temperature-progress-gpu" }
+				:halign "center" :valign "center"
+				:flipped "true"
+				:width 3
+				:orientation "v"
+				:value {EWW_TEMPS[gpu-temp-key]}
+			)
+		)))
 (defwidget widget-cpu []
 	(box
 		:class "cpu"
 		:orientation "v"
 		(circular-progress
 			:class "progress"
-			:width 20
+			:width 25
-			:height 20
+			:height 25
 			:thickness 4
 			:tooltip " ${round(EWW_CPU.avg, 2)}%"
 			:value {EWW_CPU.avg}
@@ -181,8 +210,8 @@
 		:orientation "v"
 		(circular-progress
 			:class "progress"
-			:width 20
+			:width 25
-			:height 20
+			:height 25
 			:thickness 4
 			:tooltip " ${round(100 * EWW_RAM.used_mem / EWW_RAM.total_mem, 2)}%"
 			:value {EWW_RAM.used_mem_perc}
@@ -192,7 +221,7 @@
 		:class "systray"
 		:orientation "v"
 		:space-evenly true
-		:icon-size 20
+		:icon-size 25
 		:prepend-new true
 	))
 
@@ -205,9 +234,11 @@
 		:width 20
 		:tooltip {formattime(EWW_TIME, "%F (%a) %T [%Z]")}
 		;(box :class "icon" "")
-		"${clock.m}" "${clock.d}"
+		(label :text "${clock.m}")
-		(box :class "icon" "")
+		(label :text "${clock.d}")
-		"${clock.H}" "${clock.M}"
+		(label :class "icon" :text "")
+		(label :text "${clock.H}")
+		(label :text "${clock.M}")
 	))
 
 (defpoll clock :initial "{}" :interval "10s"