feat: Moves most configuration

env/.config/waybar/config.jsonc

@@ -0,0 +1,79 @@
+// -*- mode: jsonc -*-
+{
+  "layer": "top",
+  "position": "top",
+  "modules-left": ["hyprland/workspaces"],
+  "modules-center": ["clock"],
+  "modules-right": [
+    "pulseaudio",
+    "tray",
+    "cpu",
+    "memory",
+    "battery",
+    "network",
+    "custom/lock",
+  ],
+  "hyprland/workspaces": {
+    "format": "{name}: {icon}",
+    "format-icons": {
+      "active": "",
+      "default": "",
+    },
+  },
+  "tray": {
+    "icon-size": 21,
+    "spacing": 10,
+  },
+  "clock": {
+    "timezone": "America/New_York",
+    "tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>",
+    "format": "{:%d - %H:%M}",
+  },
+  "network": {
+    "format-wifi": "󰤢 ",
+    "format-ethernet": "󰈀 ",
+    "format-disconnected": "󰤠 ",
+    "interval": 5,
+    "tooltip": false,
+  },
+  "cpu": {
+    "interval": 1,
+    "format": "  {icon0}{icon1}{icon2}{icon3} {usage:>2}%",
+    "format-icons": ["▁", "▂", "▃", "▄", "▅", "▆", "▇", "█"],
+  },
+  "memory": {
+    "interval": 30,
+    "format": "  {used:0.1f}G/{total:0.1f}G",
+  },
+  "pulseaudio": {
+    "format": "{icon} {volume}%",
+    "format-muted": "",
+    "format-icons": {
+      "default": ["", "", " "],
+    },
+    "on-click": "pavucontrol",
+  },
+  "custom/lock": {
+    "tooltip": false,
+    "on-click": "sh -c '(sleep 0.5s; hyprlock)' & disown",
+    "format": "",
+  },
+  "later": {
+    "format": "<span class='icon'>{icon}</span> <span class='text'>{text}</span>",
+  },
+  "battery": {
+    "states": {
+      // "good": 95,
+      "warning": 30,
+      "critical": 15,
+    },
+    "format": "{capacity}% {icon}",
+    "format-full": "{capacity}% {icon}",
+    "format-charging": "{capacity}% ",
+    "format-plugged": "{capacity}% ",
+    "format-alt": "{time} {icon}",
+    // "format-good": "", // An empty format will hide the module
+    // "format-full": "",
+    "format-icons": ["", "", "", "", ""],
+  },
+}

env/.config/waybar/style.css

@@ -0,0 +1,132 @@
+@define-color foreground #cdd6f4;
+@define-color background rgba(24, 24, 37, 0.7);
+@define-color skyblue #89dceb;
+@define-color blue #89b4fa;
+@define-color red #f38ba8;
+@define-color yellow #f9e2af;
+@define-color peach #fab387;
+@define-color maroon #eba0ac;
+@define-color green #a6e3a1;
+
+* {
+  font-family: JetbrainsMono Nerd Font;
+  font-size: 15px;
+  min-height: 0;
+  margin: 0px;
+}
+
+#waybar {
+  background: transparent;
+  color: @foreground;
+  margin: 0px;
+}
+
+#workspaces {
+  background: @background;
+  border-radius: 10px;
+  margin-top: 5px;
+  margin-bottom: 5px;
+  margin-left: 0.4rem;
+}
+
+#workspaces button {
+  color: @foreground;
+  border-radius: 5px;
+}
+
+#workspaces button.active {
+  color: @skyblue;
+  border-radius: 5px;
+}
+
+#workspaces button:hover {
+  color: #85c1dc;
+  border-radius: 5px;
+}
+
+#custom-music,
+#tray,
+#backlight,
+#clock,
+#battery,
+#pulseaudio,
+#network,
+#cpu,
+#memory,
+#custom-lock,
+#custom-power {
+  background-color: @background;
+  padding: 0.5rem 1rem;
+  margin: 5px 0;
+  color: @foreground;
+  /* border-radius: 0px 5px 5px 0px; */
+}
+
+#clock {
+  color: @foreground;
+  border-radius: 5px;
+  margin-right: 1rem;
+  font-weight: 900;
+}
+
+#pulseaudio {
+  color: @red;
+  border-radius: 10px 0px 0px 10px;
+  margin-left: 1rem;
+}
+
+#tray {
+  color: @blue;
+  border-radius: 0px 10px 10px 0px;
+  margin-right: 1rem;
+}
+
+#cpu {
+  color: @lavender;
+  border-radius: 10px 0px 0px 10px;
+}
+
+#memory {
+  color: @peach;
+  margin-right: 1rem;
+  border-radius: 0px 10px 10px 0px;
+}
+
+#battery {
+  border-radius: 10px 0px 0px 10px;
+  color: @green;
+}
+
+#battery.warning:not(.charging) {
+  color: @yellow;
+}
+
+#battery.critical:not(.charging) {
+  color: @red;
+}
+
+#backlight {
+  color: #e5c890;
+}
+
+#custom-music {
+  color: #ca9ee6;
+  border-radius: 5px;
+}
+
+#network {
+  margin-right: 1rem;
+  border-radius: 0px 10px 10px 0px;
+}
+
+#custom-lock {
+  border-radius: 10px;
+  color: @yellow;
+  margin-right: 0.4rem;
+}
+
+#custom-power {
+  margin-right: 1rem;
+  border-radius: 0px 5px 5px 0px;
+  color: #e78284;
+}