Add CPU and Memory to waybar

sericea/.config/waybar/config

@@ -33,7 +33,7 @@
 	"layer": "top",
 	"position": "bottom",
 	"height": 40,
-	"modules-left": ["idle_inhibitor", "gamemode", "mpris"],
+	"modules-left": ["idle_inhibitor", "gamemode", "cpu", "memory", "mpris"],
 	"modules-center": [],
 	"modules-right": ["network", "pulseaudio", "backlight", "battery", "clock"],
 	"clock": {
@@ -85,6 +85,24 @@
 		"on-scroll-down": "/usr/libexec/sway/volume-helper --limit 100 --decrease 5",
 		"on-click": "pactl set-sink-mute @DEFAULT_SINK@ toggle && /usr/libexec/sway/volume-helper"
 	},
+	"cpu": {
+		"interval": 3,
+		"format": " {usage}%",
+		"states": {
+			"critical": 90,
+			"warning": 80,
+			"regular": 50
+		}
+	},
+	"memory": {
+		"interval": 5,
+		"format": " {percentage}%",
+		"states": {
+			"critical": 90,
+			"warning": 80,
+			"regular": 50
+		}
+	},
 	"mpris": {
 		"interval": 1,
 		"artist-len": 30,

sericea/.config/waybar/style.css

@@ -96,6 +96,35 @@ window#waybar {
 #gamemode.running {
 	color: #b8bb26;
 }
+/* Memory */
+#memory {
+	padding: 0 1em;
+	color: #504945;
+}
+#memory.critical {
+	color: #fb4934;
+}
+#memory.warning {
+	color: #fabd2f;
+}
+#memory.regular {
+	color: #ebdbb2;
+}
+/* CPU */
+#cpu {
+	padding: 0 1em;
+	color: #504945;
+}
+#cpu.critical {
+	color: #fb4934;
+}
+#cpu.warning {
+	color: #fabd2f;
+}
+#cpu.regular {
+	color: #ebdbb2;
+}
+/* Battery */
 #battery {
 	padding: 0 1em;
 }