From d3787c546e049ac7261192cab4771575ad623ff0 Mon Sep 17 00:00:00 2001
From: DashieTM <fabio.lenherr@gmail.com>
Date: Fri, 20 Jun 2025 03:31:06 +0200
Subject: [PATCH] feat(ironbar): Update config

---
 modules/programs/ironbar.nix | 431 +++++++++++++++++++++++------------
 1 file changed, 289 insertions(+), 142 deletions(-)

diff --git a/modules/programs/ironbar.nix b/modules/programs/ironbar.nix
index 300e1a2..98942a9 100644
--- a/modules/programs/ironbar.nix
+++ b/modules/programs/ironbar.nix
@@ -13,94 +13,150 @@
   ironbarDefaultConfig = {
     end = [
       {
-        type = "sys_info";
-        format = [" {memory_percent}"];
-        interval.memory = 30;
-        class = "memory-usage";
+        class = "music";
+        type = "music";
+        format = "";
+        truncate = {
+          mode = "end";
+          max_length = 0;
+        };
+        icons = {
+          play = "";
+          pause = "";
+        };
+        truncate_popup_title = {
+          mode = "end";
+          max_length = 15;
+        };
+        truncate_popup_album = {
+          mode = "end";
+          max_length = 15;
+        };
+        truncate_popup_artist = {
+          mode = "end";
+          max_length = 15;
+        };
       }
       {
-        type = "custom";
         bar = [
           {
-            type = "button";
             class = "popup-button";
             label = "";
             on_click = "popup:toggle";
+            type = "button";
           }
         ];
         class = "popup-button-box";
         popup = [
           {
-            type = "box";
-            orientation = "vertical";
             class = "audio-box";
+            orientation = "vertical";
+            type = "box";
             widgets = [
               {
-                type = "box";
+                class = "audio-button-box";
                 orientation = "horizontal";
+                type = "box";
                 widgets = [
                   {
-                    type = "button";
                     class = "audio-button";
                     label = "";
-                    on_click = lib.mkIf config.mods.scripts.audioControl "!audioControl bluetooth";
+                    on_click = "!audioControl bluetooth";
+                    type = "button";
                   }
                   {
-                    type = "button";
                     class = "audio-button";
                     label = "󰋋";
-                    on_click = lib.mkIf config.mods.scripts.audioControl "!audioControl internal";
+                    on_click = "!audioControl internal";
+                    type = "button";
                   }
                 ];
-                class = "audio-button-box";
               }
               {
-                type = "label";
+                class = "audio-label";
                 label = "Output";
-              }
-              {
-                type = "slider";
-                class = "audio-slider";
-                step = 1.0;
-                length = 200;
-                value = "pactl get-sink-volume @DEFAULT_SINK@ | awk -F'/' '{ print $2 }' | tr -d ' %'";
-                on_change = "!pactl set-sink-volume @DEFAULT_SINK@ $0%";
-              }
-              {
                 type = "label";
-                label = "Input";
               }
               {
-                type = "slider";
                 class = "audio-slider";
-                step = 1.0;
                 length = 200;
-                value = "pactl get-source-volume @DEFAULT_SOURCE@ | awk -F'/' '{ print $2 }' | tr -d ' %'";
+                on_change = "!pactl set-sink-volume @DEFAULT_SINK@ $0%";
+                step = 1.0;
+                type = "slider";
+                value = "pactl get-sink-volume @DEFAULT_SINK@ | awk -F'/' '{ print $2 }' | tr -d ' %'";
+                label = "{{pactl get-sink-volume @DEFAULT_SINK@ | awk -F'/' '{ print $2 }'}}";
+              }
+              {
+                class = "audio-label";
+                label = "Input";
+                type = "label";
+              }
+              {
+                class = "audio-slider";
+                length = 200;
                 on_change = "!pactl set-source-volume @DEFAULT_SOURCE@ $0%";
+                step = 1.0;
+                type = "slider";
+                value = "pactl get-source-volume @DEFAULT_SOURCE@ | awk -F'/' '{ print $2 }' | tr -d ' %'";
+              }
+            ];
+          }
+        ];
+        type = "custom";
+      }
+      {
+        bar = [
+          {
+            class = "popup-button";
+            label = "";
+            on_click = "!oxidash --css /home/dashie/gits/oxidash/style.css";
+            type = "button";
+          }
+        ];
+        class = "popup-button-box";
+        type = "custom";
+      }
+      {
+        bar = [
+          {
+            class = "popup-button";
+            label = "";
+            on_click = "popup:toggle";
+            type = "button";
+          }
+        ];
+        type = "custom";
+        class = "popup-button-box";
+        popup = [
+          {
+            class = "system-box";
+            type = "box";
+            widgets = [
+              {
+                class = "memory-usage";
+                format = [
+                  "  {cpu_percent}%"
+                  "  {memory_used} / {memory_total} GB ({memory_percent}%)"
+                  "  {swap_used} / {swap_total} GB ({swap_free} | {swap_percent}%)"
+                  "󰥔  {uptime}"
+                ];
+                direction = "vertical";
+                interval = {
+                  memory = 30;
+                  cpu = 5;
+                  temps = 5;
+                  disks = 5;
+                  network = 5;
+                };
+                type = "sys_info";
               }
             ];
           }
         ];
       }
       {
-        type = "custom";
-        bar = [
-          {
-            type = "button";
-            class = "popup-button";
-            label = "";
-            on_click = "!oxidash --css /home/${username}/gits/oxidash/style.css";
-          }
-        ];
-        class = "popup-button-box";
+        type = "tray";
       }
-      {
-        type = "clock";
-        format = "%I:%M";
-        format_popup = "%I:%M:%S";
-        locale = "en_US";
-      }
-      {type = "tray";}
     ];
     position = "top";
     height = 10;
@@ -113,11 +169,10 @@
     ];
     center = [
       {
-        type = "focused";
-        show_icon = true;
-        show_title = true;
-        icon_size = 20;
-        truncate = "end";
+        format = "%I:%M";
+        format_popup = "%a %d:%m/%I:%M %p";
+        locale = "en_US";
+        type = "clock";
       }
     ];
   };
@@ -188,132 +243,224 @@ in {
             ''
               @import url("/home/${username}/.config/gtk-3.0/gtk.css");
 
+              @define-color primary #${scheme.base0D};
+              @define-color muted-text #${scheme.base05};
+              @define-color background #${scheme.base00};
+              @define-color secondary-background #${scheme.base02};
+
+              * slider {
+                background-color: @muted-text;
+              }
+
               * {
-                color: #${scheme.base0D};
-                padding: 0px;
-                margin: 0px;
+                transition:
+                  background-color 0.15s ease-in-out,
+                  color 0.15s ease-in-out,
+                  border-color 0.15s ease-in-out;
               }
 
               .background {
                 background-color: rgba(0, 0, 0, 0);
-              }
-
-              .workspaces {
-                margin: 2px 0px 0px 5px;
-                border-radius: 10px;
-                background-color: #${scheme.base00};
-                padding: 2px 5px 2px 5px;
-              }
-
-              .workspaces .item {
-                margin: 0px 3px 0px 3px;
-                font-size: 13px;
-                border-radius: 100%;
-                padding: 0px 2px 0px 3px;
-                background-color: rgba(0, 0, 0, 0);
-              }
-
-              .workspaces .item:hover {
-                background-color: #${scheme.base02};
-              }
-
-              .workspaces .item.focused {
-                background-color: #${scheme.base02};
-              }
-
-              .audio-box {
-                padding: 2em;
-                background-color: #${scheme.base00};
-                border-radius: 5px;
-              }
-
-              .audio-slider {
-                padding: 5px;
-                margin: 5px;
-              }
-
-              .audio-button {
-                padding: 5px 10px 5px 10px;
-                margin: 0px 1em 20px 1em;
-                border-radius: 100%;
-                font-size: 17px;
-              }
-
-              .audio-button-box {
-                padding: 0px 2.5em 0px 2.5em;
+                padding: 0px;
+                margin: 0px;
               }
 
               .focused {
-                padding: 0px 5px 0px 5px;
-                background-color: #${scheme.base00};
+                padding: 0px 5px;
+                background-color: @background;
                 font-size: 17px;
                 border-radius: 10px;
               }
 
               #bar #end {
-                margin: 0px 5px 0px 0px;
-                padding: 0px 5px 0px 5px;
-                background-color: #${scheme.base00};
+                margin: 0px 5px;
+                padding: 0px 5px;
+                background-color: @background;
                 border-radius: 10px;
               }
 
               .popup-button {
-                padding: 0px 5px 0px 3px;
-                margin: 0em 3px;
+                padding: 0px 5px 0px 2px;
                 border-radius: 100%;
                 font-size: 13px;
-                background-color: #${scheme.base00};
+                background-color: @background;
               }
 
               .popup-button-box {
-                padding: 2px 0px 2px 0px;
-              }
-
-              .clock {
-                padding: 0px 5px 0px 5px;
-                font-size: 17px;
-                background-color: #${scheme.base00};
-              }
-
-              .clock:hover {
-                background-color: #${scheme.base02};
+                padding: 2px 0px;
+                margin-right: 4px;
               }
 
               .custom button {
-                background-color: #${scheme.base00};
+                background-color: @background;
+                color: @primary;
               }
 
               .custom button:hover {
-                background-color: #${scheme.base02};
+                background-color: @secondary-background;
+              }
+
+              /* audio */
+              .audio-box * {
+                color: @primary;
+              }
+
+              .audio-box {
+                padding: 2em;
+                background-color: @background;
+                border-radius: 5px;
+                border: 1px solid @primary;
+              }
+
+              .audio-slider {
+                padding: 5px;
+                margin: 5px 5px 15px;
+              }
+
+              .audio-label {
+                font-size: 19px;
+              }
+
+              .audio-button {
+                padding: 10px 10px 10px 8px;
+                min-height: 35px;
+                min-width: 35px;
+                margin: 0px 1em;
+                border-radius: 50%;
+                font-size: 25px;
+              }
+
+              .audio-button-box {
+                padding: 0px 2.5em 0px 2.5em;
+                margin: 0em 0em 1.5em;
+              }
+
+              /* clock  */
+              .clock {
+                padding: 0px 5px;
+                font-size: 20px;
+                border-radius: 5px;
+                background-color: @background;
+                color: @primary;
+              }
+
+              .clock:hover {
+                background-color: @secondary-background;
+              }
+
+              .popup-clock {
+                font-size: 2.5em;
+                background-color: @background;
+                border: 1px solid @primary;
+                padding: 0.5em;
+                border-radius: 8px;
+                color: @primary;
+              }
+
+              .popup-clock .calendar-clock {
+                margin: 0.25em 0em 0.75em;
+                color: @primary;
+              }
+
+              .popup-clock .calendar {
+                font-size: 24px;
+                color: @primary;
+              }
+
+              .popup-clock .calendar:selected {
+                background-color: @secondary-background;
+              }
+
+              /* workspaces */
+              .workspaces {
+                margin: 0px 0px 0px 5px;
+                border-radius: 10px;
+                background-color: @background;
+                padding: 2px 5px;
+              }
+
+              .workspaces .item {
+                margin: 0px 3px;
+                font-size: 13px;
+                border-radius: 100%;
+                padding: 0px 3px 0px 3px;
+                background-color: rgba(0, 0, 0, 0);
+                color: @primary;
+              }
+
+              .workspaces .item:hover {
+                background-color: @secondary-background;
+                color: @primary;
+              }
+
+              .workspaces .item.focused {
+                background-color: @primary;
+                color: @background;
+              }
+
+              /* music */
+              .music {
+                font-size: 13px;
+                padding: 0px 4px 0px 3px;
+                margin: 2px 0px 2px 0px;
+                background-color: @background;
+                color: @primary;
+              }
+
+              .music:hover {
+                background-color: @secondary-background;
+                border-radius: 100%;
+              }
+
+              .music .contents .icon {
+                margin: 0px 0px 0px 5px;
+              }
+
+              .popup-music {
+                background-color: @background;
+                color: @primary;
+                border-radius: 8px;
+                border: 1px solid @primary;
+                padding: 16px;
+                font-size: 20px;
+              }
+
+              .popup-music .controls .btn-prev {
+                color: @primary;
+                margin-right: 16px;
+              }
+
+              .popup-music .controls .btn-next {
+                color: @primary;
+                margin-right: 16px;
+              }
+
+              .popup-music .controls .btn-play {
+                color: @primary;
+                margin-right: 16px;
+              }
+
+              .popup-music .controls .btn-pause {
+                color: @primary;
+                margin-right: 16px;
+              }
+
+              /* system */
+              .system-box {
+                padding: 16px;
+                color: @primary;
+                border: 1px solid @primary;
+                background-color: @background;
+                border-radius: 8px;
               }
 
               .memory-usage {
                 font-size: 15px;
-                margin: 0px 5px 0px 0px;
+                color: @primary;
               }
 
               .memory-usage:hover {
-                background-color: #${scheme.base02};
-              }
-
-              .popup-clock {
-                background-color: #${scheme.base00};
-                border-radius: 5px;
-                padding: 2px 8px 10px 8px;
-              }
-
-              .popup-clock .calendar-clock {
-                font-size: 2.5em;
-                padding-bottom: 0.1em;
-              }
-
-              .popup-clock .calendar {
-                border-radius: 5px;
-                font-size: 1.05em;
-              }
-
-              .popup-clock .calendar:selected {
-                background-color: #${scheme.base02};
+                background-color: @secondary-background;
               }
             ''
             + config.mods.ironbar.customCss