From ca8b8a58c4f527aca034788d36f85973bc241056 Mon Sep 17 00:00:00 2001
From: Mason Dear <83663766+SomeGuyNamedMy@users.noreply.github.com>
Date: Fri, 31 Mar 2023 13:54:20 -0400
Subject: [PATCH] fix waybar modules (#76)

---
 modules/waybar/base.css   |  65 +++++++++++++++++++++
 modules/waybar/center.css |  88 +++++++++++++++++++++++++++++
 modules/waybar/hm.nix     | 115 +++++++++++++++++++-------------------
 modules/waybar/left.css   |  86 ++++++++++++++++++++++++++++
 modules/waybar/right.css  |  86 ++++++++++++++++++++++++++++
 5 files changed, 383 insertions(+), 57 deletions(-)
 create mode 100644 modules/waybar/base.css
 create mode 100644 modules/waybar/center.css
 create mode 100644 modules/waybar/left.css
 create mode 100644 modules/waybar/right.css

diff --git a/modules/waybar/base.css b/modules/waybar/base.css
new file mode 100644
index 00000000..749308a6
--- /dev/null
+++ b/modules/waybar/base.css
@@ -0,0 +1,65 @@
+window#waybar {
+    background: @base00;
+    color: @base05;
+}
+
+#wireplumber,
+#pulseaudio,
+#sndio {
+    padding: 0 5px;
+}
+#wireplumber.muted,
+#pulseaudio.muted,
+#sndio.muted {
+    padding: 0 5px;
+}
+#upower,
+#battery {
+    padding: 0 5px;
+}
+#upower.charging,
+#battery.Charging {
+    padding: 0 5px;
+}
+#network {
+    padding: 0 5px;
+}
+#network.disconnected {
+    padding: 0 5px;
+}
+#user {
+    padding: 0 5px;
+}
+#clock {
+    padding: 0 5px;
+}
+#backlight {
+    padding: 0 5px;
+}
+#cpu {
+    padding: 0 5px;
+}
+#disk {
+    padding: 0 5px;
+}
+#idle_inhibitor {
+    padding: 0 5px;
+}
+#temperature {
+    padding: 0 5px;
+}
+#mpd {
+    padding: 0 5px;
+}
+#language {
+    padding: 0 5px;
+}
+#keyboard-state {
+    padding: 0 5px;
+}
+#memory {
+    padding: 0 5px;
+}
+#window {
+    padding: 0 5px;
+}
diff --git a/modules/waybar/center.css b/modules/waybar/center.css
new file mode 100644
index 00000000..53a037cc
--- /dev/null
+++ b/modules/waybar/center.css
@@ -0,0 +1,88 @@
+window .modules-center #workspaces button {
+    background-color: @base07;
+    color: @base00;
+}
+.modules-center #wireplumber,
+.modules-center #pulseaudio,
+.modules-center #sndio {
+    background-color: @base09;
+    color: @base00;
+}
+.modules-center #workspaces button.focused,
+.modules-center #workspaces button.active {
+    background: @base03;
+}
+.modules-center #workspaces button.urgent {
+    background-color: @base08;
+}
+.modules-center #wireplumber.muted,
+.modules-center #pulseaudio.muted,
+.modules-center #sndio.muted {
+    background-color: @base0C;
+}
+.modules-center #upower,
+.modules-center #battery {
+    background-color: @base0D;
+    color: @base00;
+}
+.modules-center #upower.charging,
+.modules-center #battery.Charging {
+    background-color: @base0E;
+}
+.modules-center #network {
+    background-color: @base0B;
+    color: @base00;
+}
+.modules-center #network.disconnected {
+    background-color: @base0C;
+}
+.modules-center #user {
+    background-color: @base0F;
+    color: @base00;
+}
+.modules-center #clock {
+    background-color: @base03;
+    color: @base00;
+}
+.modules-center #backlight {
+    background-color: @base0E;
+    color: @base00;
+}
+.modules-center #cpu {
+    background-color: @base0B;
+    color: @base00;
+}
+.modules-center #disk {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-center #idle_inhibitor {
+    background-color: @base06;
+    color: @base00;
+}
+.modules-center #temperature {
+    background-color: @base07;
+    color: @base00;
+}
+.modules-center #mpd {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-center #language {
+    background-color: @base02;
+    color: @base00;
+}
+
+.modules-center #keyboard-state {
+    background-color: @base03;
+    color: @base00;
+}
+
+.modules-center #memory {
+    background-color: @base09;
+    color: @base00;
+}
+.modules-center #window {
+    background-color: @base0C;
+    color: @base00;
+}
diff --git a/modules/waybar/hm.nix b/modules/waybar/hm.nix
index 23bf930a..01b8acd9 100644
--- a/modules/waybar/hm.nix
+++ b/modules/waybar/hm.nix
@@ -3,65 +3,66 @@ with config.lib.stylix.colors.withHashtag;
 with config.stylix.fonts;
 
 {
-  options.stylix.targets.waybar.enable = config.lib.stylix.mkEnableTarget "Waybar" true;
+  options.stylix.targets.waybar = {
+      enable = config.lib.stylix.mkEnableTarget "Waybar" true;
+      enableLeftBackColors = lib.mkOption {
+          type = lib.types.bool;
+          default = false;
+          description = lib.mdDoc "enables background colors on the left side of the bar";
+      };
+      enableCenterBackColors = lib.mkOption {
+          type = lib.types.bool;
+          default = false;
+          description = lib.mdDoc "enables background colors on the center of the bar";
+      };
+      enableRightBackColors = lib.mkOption {
+          type = lib.types.bool;
+          default = false;
+          description = lib.mdDoc "enables background colors on the right side of the bar";
+      };
+  };
 
   config = lib.mkIf config.stylix.targets.waybar.enable {
     programs.waybar.style = ''
-      * {
-          border: none;
-          border-radius: 0;
-          font-family: ${sansSerif.name};
-          font-size: ${builtins.toString sizes.desktop};
-      }
-      window#waybar {
-          background: ${base00};
-          color: ${base05};
-      }
-      #workspaces button {
-          padding: 0 5px;
-          background-color: ${base01};
-          color: ${base04};
-      }
-      #workspaces button.focused, #workspaces button.active {
-          background: ${base02};
-      }
-      #workspaces button.urgent {
-          background-color: ${base08};
-      }
-      #wireplumber, #pulseaudio, #sndio {
-          background-color: ${base09};
-          color: ${base04};
-          padding: 0 5px;
-      }
-      #wireplumber.muted, #pulseaudio.muted, #sndio.muted {
-          background-color: ${base0C};
-      }
-      #upower, #battery {
-          background-color: ${base0D};
-          color: ${base04};
-          padding: 0 5px;
-      }
-      #upower.charging, #battery.Charging {
-          background-color: ${base0E};
-      }
-      #network {
-          background-color: ${base0B};
-          color: ${base04};
-          padding: 0 5px;
-      }
-      #network.disconnected {
-          background-color: ${base0C};
-      }
-      #user {
-          background-color: ${base0F};
-          color: ${base04};
-          padding: 0 5px;
-      }
-      #clock {
-          background-color: ${base03};
-          color: ${base04};
-          padding: 0 5px;
-      }
-    '';
+    @define-color base00 ${base00}; @define-color base01 ${base01}; @define-color base02 ${base02}; @define-color base03 ${base03};
+    @define-color base04 ${base04}; @define-color base05 ${base05}; @define-color base06 ${base06}; @define-color base07 ${base07};
+
+    @define-color base08 ${base08}; @define-color base09 ${base09}; @define-color base0A ${base0A}; @define-color base0B ${base0B};
+    @define-color base0C ${base0C}; @define-color base0D ${base0D}; @define-color base0E ${base0E}; @define-color base0F ${base0F};
+    * {
+        border: none;
+        border-radius: 0;
+        font-family: ${sansSerif.name};
+        font-size: ${builtins.toString sizes.desktop};
+    }
+    ''
+    + (builtins.readFile ./base.css)
+    + (if config.stylix.targets.waybar.enableLeftBackColors then builtins.readFile ./left.css else ''
+    .modules-left #workspaces button {
+        border-bottom: 3px solid transparent;
+    }
+    .modules-left #workspaces button.focused,
+    .modules-left #workspaces button.active {
+        border-bottom: 3px solid @base05;
+    }
+    '')
+    + (if config.stylix.targets.waybar.enableCenterBackColors then builtins.readFile ./center.css else ''
+    .modules-center #workspaces button {
+        border-bottom: 3px solid transparent;
+    }
+    .modules-center #workspaces button.focused,
+    .modules-center #workspaces button.active {
+        border-bottom: 3px solid @base05;
+    }
+    '')
+    + (if config.stylix.targets.waybar.enableRightBackColors then builtins.readFile ./right.css else ''
+    .modules-right #workspaces button {
+        border-bottom: 3px solid transparent;
+    }
+    .modules-right #workspaces button.focused,
+    .modules-right #workspaces button.active {
+        border-bottom: 3px solid @base05;
+    }
+    '');
   };
 }
diff --git a/modules/waybar/left.css b/modules/waybar/left.css
new file mode 100644
index 00000000..264bfae9
--- /dev/null
+++ b/modules/waybar/left.css
@@ -0,0 +1,86 @@
+window .modules-left #workspaces button {
+    background-color: @base07;
+    color: @base00;
+}
+.modules-left #wireplumber,
+.modules-left #pulseaudio,
+.modules-left #sndio {
+    background-color: @base09;
+    color: @base00;
+}
+.modules-left #workspaces button.focused,
+.modules-left #workspaces button.active {
+    background: @base03;
+}
+.modules-left #workspaces button.urgent {
+    background-color: @base08;
+}
+.modules-left #wireplumber.muted,
+.modules-left #pulseaudio.muted,
+.modules-left #sndio.muted {
+    background-color: @base0C;
+}
+.modules-left #upower,
+.modules-left #battery {
+    background-color: @base0D;
+    color: @base00;
+}
+.modules-left #upower.charging,
+.modules-left #battery.Charging {
+    background-color: @base0E;
+}
+.modules-left #network {
+    background-color: @base0B;
+    color: @base00;
+}
+.modules-left #network.disconnected {
+    background-color: @base0C;
+}
+.modules-left #user {
+    background-color: @base0F;
+    color: @base00;
+}
+.modules-left #clock {
+    background-color: @base03;
+    color: @base00;
+}
+.modules-left #backlight {
+    background-color: @base0E;
+    color: @base00;
+}
+.modules-left #cpu {
+    background-color: @base0B;
+    color: @base00;
+}
+.modules-left #disk {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-left #idle_inhibitor {
+    background-color: @base06;
+    color: @base00;
+}
+.modules-left #temperature {
+    background-color: @base07;
+    color: @base00;
+}
+.modules-left #mpd {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-left #language {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-left #keyboard-state {
+    background-color: @base03;
+    color: @base00;
+}
+.modules-left #memory {
+    background-color: @base09;
+    color: @base00;
+}
+.modules-left #window {
+    background-color: @base0C;
+    color: @base00;
+}
diff --git a/modules/waybar/right.css b/modules/waybar/right.css
new file mode 100644
index 00000000..49c1b41b
--- /dev/null
+++ b/modules/waybar/right.css
@@ -0,0 +1,86 @@
+window .modules-right #workspaces button {
+    background-color: @base07;
+    color: @base00;
+}
+.modules-right #wireplumber,
+.modules-right #pulseaudio,
+.modules-right #sndio {
+    background-color: @base09;
+    color: @base00;
+}
+.modules-right #workspaces button.focused,
+.modules-right #workspaces button.active {
+    background: @base03;
+}
+.modules-right #workspaces button.urgent {
+    background-color: @base08;
+}
+.modules-right #wireplumber.muted,
+.modules-right #pulseaudio.muted,
+.modules-right #sndio.muted {
+    background-color: @base0C;
+}
+.modules-right #upower,
+.modules-right #battery {
+    background-color: @base0D;
+    color: @base00;
+}
+.modules-right #upower.charging,
+.modules-right #battery.Charging {
+    background-color: @base0E;
+}
+.modules-right #network {
+    background-color: @base0B;
+    color: @base00;
+}
+.modules-right #network.disconnected {
+    background-color: @base0C;
+}
+.modules-right #user {
+    background-color: @base0F;
+    color: @base00;
+}
+.modules-right #clock {
+    background-color: @base03;
+    color: @base00;
+}
+.modules-right #backlight {
+    background-color: @base0E;
+    color: @base00;
+}
+.modules-right #cpu {
+    background-color: @base0B;
+    color: @base00;
+}
+.modules-right #disk {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-right #idle_inhibitor {
+    background-color: @base06;
+    color: @base00;
+}
+.modules-right #temperature {
+    background-color: @base07;
+    color: @base00;
+}
+.modules-right #mpd {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-right #language {
+    background-color: @base02;
+    color: @base00;
+}
+.modules-right #keyboard-state {
+    background-color: @base03;
+    color: @base00;
+}
+.modules-right #memory {
+    background-color: @base09;
+    color: @base00;
+}
+.modules-right #window {
+    background-color: @base0C;
+    color: @base00;
+}