From b8062cc05ef0595f0c981b0727bca6043b57e244 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Tue, 10 Sep 2024 04:44:13 +0200
Subject: [PATCH 01/15] add new volume module options

---
 options.ts                                | 10 ++++++++--
 widget/settings/pages/config/bar/index.ts | 15 +++++++++++++++
 widget/settings/pages/theme/bar/index.ts  |  7 +++++--
 3 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/options.ts b/options.ts
index d600e0eb6..ad077147d 100644
--- a/options.ts
+++ b/options.ts
@@ -193,8 +193,11 @@ const options = mkOptions(OPTIONS, {
                 volume: {
                     background: opt(colors.base2),
                     hover: opt(colors.surface1),
-                    text: opt(colors.maroon),
-                    icon: opt(colors.maroon),
+                    output_text: opt(colors.maroon),
+                    output_icon: opt(colors.maroon),
+                    input_text: opt(colors.maroon),
+                    input_icon: opt(colors.maroon),
+                    separator: opt(colors.surface1),
                     icon_background: opt(colors.base2),
                     spacing: opt("0.5em"),
                 },
@@ -842,6 +845,9 @@ const options = mkOptions(OPTIONS, {
         },
         volume: {
             label: opt(true),
+            output: opt(true),
+            input: opt(false),
+            hide_muted_label: opt(false),
         },
         network: {
             truncation: opt(true),
diff --git a/widget/settings/pages/config/bar/index.ts b/widget/settings/pages/config/bar/index.ts
index d63fdd735..bdb77eb8b 100644
--- a/widget/settings/pages/config/bar/index.ts
+++ b/widget/settings/pages/config/bar/index.ts
@@ -272,11 +272,26 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
                  ******************************
                  */
                 Header("Volume"),
+                Option({
+                    opt: options.bar.volume.output,
+                    title: "Show Speaker",
+                    type: "boolean",
+                }),
+                Option({
+                    opt: options.bar.volume.input,
+                    title: "Show Microphone",
+                    type: "boolean",
+                }),
                 Option({
                     opt: options.bar.volume.label,
                     title: "Show Volume Percentage",
                     type: "boolean",
                 }),
+                Option({
+                    opt: options.bar.volume.hide_muted_label,
+                    title: "Hide Percentage On Mute",
+                    type: "boolean",
+                }),
                 Option({
                     opt: options.theme.bar.buttons.volume.spacing,
                     title: "Inner Spacing",
diff --git a/widget/settings/pages/theme/bar/index.ts b/widget/settings/pages/theme/bar/index.ts
index 59acac3e7..858975a2f 100644
--- a/widget/settings/pages/theme/bar/index.ts
+++ b/widget/settings/pages/theme/bar/index.ts
@@ -72,8 +72,11 @@ export const BarTheme = () => {
                 Header('Volume'),
                 Option({ opt: options.theme.bar.buttons.volume.background, title: 'Background', type: 'color' }),
                 Option({ opt: options.theme.bar.buttons.volume.hover, title: 'Hover', type: 'color' }),
-                Option({ opt: options.theme.bar.buttons.volume.text, title: 'Text', type: 'color' }),
-                Option({ opt: options.theme.bar.buttons.volume.icon, title: 'Icon', type: 'color' }),
+                Option({ opt: options.theme.bar.buttons.volume.output_text, title: 'Output Text', type: 'color' }),
+                Option({ opt: options.theme.bar.buttons.volume.output_icon, title: 'Output Icon', type: 'color' }),
+                Option({ opt: options.theme.bar.buttons.volume.input_text, title: 'Input Text', type: 'color' }),
+                Option({ opt: options.theme.bar.buttons.volume.input_icon, title: 'Input Icon', type: 'color' }),
+                Option({ opt: options.theme.bar.buttons.volume.separator, title: 'Separator', type: 'color' }),
                 Option({
                     opt: options.theme.bar.buttons.volume.icon_background,
                     title: 'Button Icon Background',

From f06b3e33e40613baa330f8dc30617df9f255e698 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Tue, 10 Sep 2024 05:04:33 +0200
Subject: [PATCH 02/15] implement volume module options

---
 modules/bar/volume/index.ts | 108 ++++++++++++++++++++++++++----------
 scss/style/bar/audio.scss   |  34 +++++++++++-
 2 files changed, 109 insertions(+), 33 deletions(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 937cac97c..24a5c95b1 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -2,48 +2,81 @@ import Gdk from 'gi://Gdk?version=3.0';
 const audio = await Service.import("audio");
 import { openMenu } from "../utils.js";
 import options from "options";
-import { Binding } from 'lib/utils.js';
 import { VolumeIcons } from 'lib/types/volume.js';
+import { Stream } from 'types/service/audio';
+import Separator from "types/widgets/separator";
+import Label from "types/widgets/label";
 
 const Volume = () => {
-    const icons: VolumeIcons = {
-        101: "󰕾",
+    const { label, input, output, hide_muted_label } = options.bar.volume;
+
+    const outputIcons: VolumeIcons = {
+        101: "󱄠",
         66: "󰕾",
         34: "󰖀",
         1: "󰕿",
         0: "󰝟",
     };
 
-    const getIcon = () => {
-        const icon: Binding<number> = Utils.merge(
-            [audio.speaker.bind("is_muted"), audio.speaker.bind("volume")],
-            (isMuted, vol) => {
-                return isMuted
-                    ? 0
-                    : [101, 66, 34, 1, 0].find((threshold) => threshold <= vol * 100) || 101;
-            },
-        );
+    const inputIcons: VolumeIcons = {
+        51: "󰍬",
+        1: "󰍮",
+        0: "󰍭",
+    };
 
-        return icon.as((i: number) => i !== undefined ? icons[i] : icons[101]);
+    const getIcon = (icons: VolumeIcons, volume: number, isMuted: (boolean | null)): string => {
+        const keys = Object.keys(icons).map(Number).reverse();
+        let icon: number;
+        if (isMuted !== false || Math.round(volume * 100) === 0) {
+            icon = 0;
+        } else {
+            icon = keys.find((threshold) => threshold <= Math.round(volume * 100)) ?? keys[0];
+        }
+        return icons[icon];
     };
 
-    const volIcn = Widget.Label({
-        hexpand: true,
-        label: getIcon(),
-        class_name: "bar-button-icon volume txt-icon bar",
-    });
+    const volIcn = (audio_type: Stream, icons: VolumeIcons, extra_class_name: string, showLabel: boolean, hideMutedLabel: boolean): Label<any> => {
+        const class_name = `bar-button-icon volume txt-icon bar ${extra_class_name}`;
+        return Widget.Label({
+            hexpand: true,
+            class_name
+        }).hook(audio_type, (self) => Utils.merge(
+            [audio_type.bind("volume"), audio_type.bind("is_muted")],
+            (volume, isMuted) => {
+                if (!self.is_destroyed) {
+                    self.set_text(getIcon(icons, volume, isMuted));
+                    self.class_name = `${class_name} ${!showLabel || (hideMutedLabel && (isMuted !== false || Math.round(volume * 100) === 0)) ? "no-label" : ""}`;
+                }
+            }));
+    };
 
-    const volPct = Widget.Label({
-        hexpand: true,
-        label: audio.speaker.bind("volume").as((v) => `${Math.round(v * 100)}%`),
-        class_name: "bar-button-label volume",
-    });
+    const volPctUpdate = (label: Label<any>, volume: number, isMuted: boolean | null, hideMutedLabel: boolean): void => {
+        if (!label.is_destroyed) {
+            label.set_text(isMuted !== false ? "0%" : `${Math.round(volume * 100)}%`);
+            label.set_visible(!(hideMutedLabel && (isMuted !== false || Math.round(volume * 100) === 0)));
+        }
+    };
+
+    const volPct = (audio_type: Stream, class_name: string, hideMutedLabel: boolean): Label<any> => {
+        const label: Label<any> = Widget.Label({
+            hexpand: true,
+            class_name: `bar-button-label volume ${class_name}`,
+        }).hook(audio_type, (self) => Utils.merge(
+            [audio_type.bind("is_muted"), audio_type.bind("volume")],
+            (isMuted, volume) => volPctUpdate(self, volume, isMuted, hideMutedLabel)));
+
+        // Workaround for ags setting the label visible on creation
+        if (hideMutedLabel) {
+            Utils.timeout(500, () => volPctUpdate(label, audio_type.volume, audio_type.is_muted, hideMutedLabel));
+        }
+        return label;
+    };
 
     return {
         component: Widget.Box({
             hexpand: true,
             vexpand: true,
-            className: Utils.merge([options.theme.bar.buttons.style.bind("value"), options.bar.volume.label.bind("value")], (style, showLabel) => {
+            className: Utils.merge([options.theme.bar.buttons.style.bind("value"), label.bind("value")], (style, showLabel) => {
                 const styleMap = {
                     default: "style1",
                     split: "style2",
@@ -53,12 +86,27 @@ const Volume = () => {
 
                 return `volume ${styleMap[style]} ${!showLabel ? "no-label" : ""}`;
             }),
-            children: options.bar.volume.label.bind("value").as((showLabel) => {
-                if (showLabel) {
-                    return [volIcn, volPct];
-                }
-                return [volIcn];
-            }),
+            children: Utils.merge(
+                [label.bind("value"), output.bind("value"), input.bind("value"), hide_muted_label.bind("value")],
+                (showLabel, showOutput, showInput, hideMutedLabel) => {
+                    let children: (Label<any> | Separator<any>)[] = [];
+                    if (showOutput) {
+                        children.push(volIcn(audio.speaker, outputIcons, "output", showLabel, hideMutedLabel));
+                        if (showLabel) {
+                            children.push(volPct(audio.speaker, `output ${!showInput ? "no-separator" : ""}`, hideMutedLabel));
+                        }
+                    }
+                    if (showInput) {
+                        if (showOutput) {
+                            children.push(Widget.Separator({ vertical: true, class_name: "bar-separator volume" }));
+                        }
+                        children.push(volIcn(audio.microphone, inputIcons, "input", showLabel, hideMutedLabel));
+                        if (showLabel) {
+                            children.push(volPct(audio.microphone, "input no-separator", hideMutedLabel));
+                        }
+                    }
+                    return children;
+                }),
         }),
         isVisible: true,
         boxClass: "volume",
diff --git a/scss/style/bar/audio.scss b/scss/style/bar/audio.scss
index adbee2251..281e598c7 100644
--- a/scss/style/bar/audio.scss
+++ b/scss/style/bar/audio.scss
@@ -1,12 +1,32 @@
 .bar-button-icon.volume {
   font-size: 1.3em;
-  color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-icon);
+
+  &.output {
+    color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-output-icon);
+  }
+
+  &.input {
+    color: if($bar-buttons-monochrome, $bar-buttons-icon, $bar-buttons-volume-input-icon);
+  }
 }
 
 .bar-button-label.volume {
-  color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-text);
   min-width: 2.2em;
   margin-left: $bar-buttons-volume-spacing;
+
+  &.output {
+    color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-output-text);
+  }
+
+  &.input {
+    color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-input-text);
+  }
+}
+
+.bar-separator.volume {
+  color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-separator);
+  margin-left: $bar-buttons-volume-spacing;
+  margin-right: $bar-buttons-volume-spacing;
 }
 
 .style2 {
@@ -17,12 +37,20 @@
     padding: $bar-buttons-padding_y 0em;
     padding-left: $bar-buttons-padding_x;
     padding-right: $bar-buttons-volume-spacing;
+
+    &.no-label {
+      border-top-right-radius: $bar-buttons-radius;
+      border-bottom-right-radius: $bar-buttons-radius;
+    }
   }
 
   .bar-button-label.volume {
     padding: $bar-buttons-padding_y 0em;
-    padding-right: $bar-buttons-padding_x;
     padding-left: $bar-buttons-volume-spacing;
     margin-left: 0em;
+
+    &.no-separator {
+      padding-right: $bar-buttons-padding_x;
+    }
   }
 }

From aa4823916695501b9bd71001407f660c4cc3bbe4 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 11 Sep 2024 05:26:14 +0200
Subject: [PATCH 03/15] add volume theme options to all themes

---
 themes/catppuccin_frappe.json          | 10 ++++++----
 themes/catppuccin_frappe_split.json    | 10 ++++++----
 themes/catppuccin_latte.json           | 10 ++++++----
 themes/catppuccin_latte_split.json     | 10 ++++++----
 themes/catppuccin_macchiato.json       | 10 ++++++----
 themes/catppuccin_macchiato_split.json | 10 ++++++----
 themes/catppuccin_mocha.json           |  7 +++++--
 themes/catppuccin_mocha_split.json     |  7 +++++--
 themes/cyberpunk.json                  |  9 ++++++---
 themes/cyberpunk_split.json            |  9 ++++++---
 themes/dracula.json                    |  9 ++++++---
 themes/dracula_split.json              |  9 ++++++---
 themes/everforest.json                 | 10 ++++++----
 themes/everforest_split.json           | 10 ++++++----
 themes/gruvbox.json                    |  9 ++++++---
 themes/gruvbox_split.json              |  9 ++++++---
 themes/monochrome.json                 | 10 ++++++----
 themes/monochrome_split.json           | 10 ++++++----
 themes/nord.json                       | 10 ++++++----
 themes/nord_split.json                 | 10 ++++++----
 themes/one_dark.json                   | 10 ++++++----
 themes/one_dark_split.json             | 10 ++++++----
 themes/rose_pine.json                  | 10 ++++++----
 themes/rose_pine_moon.json             | 11 ++++++-----
 themes/rose_pine_moon_split.json       | 10 ++++++----
 themes/rose_pine_split.json            | 10 ++++++----
 themes/tokyo_night.json                | 10 ++++++----
 themes/tokyo_night_split.json          | 10 ++++++----
 28 files changed, 166 insertions(+), 103 deletions(-)

diff --git a/themes/catppuccin_frappe.json b/themes/catppuccin_frappe.json
index a3d975a52..3886e1bf2 100644
--- a/themes/catppuccin_frappe.json
+++ b/themes/catppuccin_frappe.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#ca9ee6",
   "theme.bar.buttons.network.hover": "#51576d",
   "theme.bar.buttons.network.background": "#303446",
-  "theme.bar.buttons.volume.icon": "#ea999c",
-  "theme.bar.buttons.volume.text": "#ea999c",
   "theme.bar.buttons.volume.hover": "#51576d",
   "theme.bar.buttons.volume.background": "#303446",
   "theme.bar.buttons.media.hover": "#51576d",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#f4b8e4",
   "theme.bar.buttons.windowtitle.hover": "#51576d",
   "theme.bar.buttons.windowtitle.background": "#303446",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#232634",
   "theme.bar.buttons.workspaces.active": "#f4b8e4",
   "theme.bar.buttons.workspaces.occupied": "#eebebe",
   "theme.bar.buttons.workspaces.available": "#99d1db",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#e78284",
   "theme.bar.buttons.modules.netstat.icon_background": "#a6d189",
   "theme.bar.buttons.modules.kbLayout.text": "#99d1db",
-  "theme.bar.buttons.notifications.icon_background": "#babbf1"
+  "theme.bar.buttons.notifications.icon_background": "#babbf1",
+  "theme.bar.buttons.volume.output_text": "#ea999c",
+  "theme.bar.buttons.volume.input_icon": "#ea999c",
+  "theme.bar.buttons.volume.input_text": "#ea999c",
+  "theme.bar.buttons.volume.output_icon": "#ea999c",
+  "theme.bar.buttons.volume.separator": "#51576d"
 }
diff --git a/themes/catppuccin_frappe_split.json b/themes/catppuccin_frappe_split.json
index 52a2e9062..c9ffed8d5 100644
--- a/themes/catppuccin_frappe_split.json
+++ b/themes/catppuccin_frappe_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#ca9ee6",
   "theme.bar.buttons.network.hover": "#51576d",
   "theme.bar.buttons.network.background": "#303446",
-  "theme.bar.buttons.volume.icon": "#303446",
-  "theme.bar.buttons.volume.text": "#ea999c",
   "theme.bar.buttons.volume.hover": "#51576d",
   "theme.bar.buttons.volume.background": "#303446",
   "theme.bar.buttons.media.hover": "#51576d",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#f4b8e4",
   "theme.bar.buttons.windowtitle.hover": "#51576d",
   "theme.bar.buttons.windowtitle.background": "#303446",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#232634",
   "theme.bar.buttons.workspaces.active": "#f4b8e4",
   "theme.bar.buttons.workspaces.occupied": "#eebebe",
   "theme.bar.buttons.workspaces.available": "#99d1db",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#181825",
   "theme.bar.buttons.modules.cpu.text": "#e78284",
   "theme.bar.buttons.modules.netstat.icon_background": "#a6d189",
-  "theme.bar.buttons.modules.kbLayout.text": "#99d1db"
+  "theme.bar.buttons.modules.kbLayout.text": "#99d1db",
+  "theme.bar.buttons.volume.output_text": "#ea999c",
+  "theme.bar.buttons.volume.input_icon": "#303446",
+  "theme.bar.buttons.volume.input_text": "#ea999c",
+  "theme.bar.buttons.volume.output_icon": "#303446",
+  "theme.bar.buttons.volume.separator": "#51576d"
 }
diff --git a/themes/catppuccin_latte.json b/themes/catppuccin_latte.json
index fa5a94d8f..109dea5e6 100644
--- a/themes/catppuccin_latte.json
+++ b/themes/catppuccin_latte.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#8839ef",
   "theme.bar.buttons.network.hover": "#bcc0cc",
   "theme.bar.buttons.network.background": "#dcdfe8",
-  "theme.bar.buttons.volume.icon": "#e64553",
-  "theme.bar.buttons.volume.text": "#e64553",
   "theme.bar.buttons.volume.hover": "#bcc0cc",
   "theme.bar.buttons.volume.background": "#dcdfe8",
   "theme.bar.buttons.media.hover": "#bcc0cc",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#ea76cb",
   "theme.bar.buttons.windowtitle.hover": "#bcc0cc",
   "theme.bar.buttons.windowtitle.background": "#dcdfe8",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#dce0e8",
   "theme.bar.buttons.workspaces.active": "#ea76cb",
   "theme.bar.buttons.workspaces.occupied": "#dd7878",
   "theme.bar.buttons.workspaces.available": "#04a5e5",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#d20f39",
   "theme.bar.buttons.modules.netstat.icon_background": "#40a02b",
   "theme.bar.buttons.modules.kbLayout.text": "#04a5e5",
-  "theme.bar.buttons.notifications.icon_background": "#7287fd"
+  "theme.bar.buttons.notifications.icon_background": "#7287fd",
+  "theme.bar.buttons.volume.output_text": "#e64553",
+  "theme.bar.buttons.volume.input_icon": "#e64553",
+  "theme.bar.buttons.volume.input_text": "#e64553",
+  "theme.bar.buttons.volume.output_icon": "#e64553",
+  "theme.bar.buttons.volume.separator": "#bcc0cc"
 }
diff --git a/themes/catppuccin_latte_split.json b/themes/catppuccin_latte_split.json
index 6faf07b7e..43fa33d14 100644
--- a/themes/catppuccin_latte_split.json
+++ b/themes/catppuccin_latte_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#8839ef",
   "theme.bar.buttons.network.hover": "#bcc0cc",
   "theme.bar.buttons.network.background": "#dcdfe8",
-  "theme.bar.buttons.volume.icon": "#dcdee8",
-  "theme.bar.buttons.volume.text": "#e64553",
   "theme.bar.buttons.volume.hover": "#bcc0cc",
   "theme.bar.buttons.volume.background": "#dcdfe8",
   "theme.bar.buttons.media.hover": "#bcc0cc",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#ea76cb",
   "theme.bar.buttons.windowtitle.hover": "#bcc0cc",
   "theme.bar.buttons.windowtitle.background": "#dcdfe8",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#dce0e8",
   "theme.bar.buttons.workspaces.active": "#ea76cb",
   "theme.bar.buttons.workspaces.occupied": "#dd7878",
   "theme.bar.buttons.workspaces.available": "#04a5e5",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#181825",
   "theme.bar.buttons.modules.cpu.text": "#d20f39",
   "theme.bar.buttons.modules.netstat.icon_background": "#40a02b",
-  "theme.bar.buttons.modules.kbLayout.text": "#04a5e5"
+  "theme.bar.buttons.modules.kbLayout.text": "#04a5e5",
+  "theme.bar.buttons.volume.output_text": "#e64553",
+  "theme.bar.buttons.volume.input_icon": "#dcdfe8",
+  "theme.bar.buttons.volume.input_text": "#e64553",
+  "theme.bar.buttons.volume.output_icon": "#dcdfe8",
+  "theme.bar.buttons.volume.separator": "#bcc0cc"
 }
diff --git a/themes/catppuccin_macchiato.json b/themes/catppuccin_macchiato.json
index f716133cb..22025f760 100644
--- a/themes/catppuccin_macchiato.json
+++ b/themes/catppuccin_macchiato.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c6a0f6",
   "theme.bar.buttons.network.hover": "#494d64",
   "theme.bar.buttons.network.background": "#24273a",
-  "theme.bar.buttons.volume.icon": "#ee99a0",
-  "theme.bar.buttons.volume.text": "#ee99a0",
   "theme.bar.buttons.volume.hover": "#494d64",
   "theme.bar.buttons.volume.background": "#24273a",
   "theme.bar.buttons.media.hover": "#494d64",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#f5bde6",
   "theme.bar.buttons.windowtitle.hover": "#494d64",
   "theme.bar.buttons.windowtitle.background": "#24273a",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#181926",
   "theme.bar.buttons.workspaces.active": "#f5bde6",
   "theme.bar.buttons.workspaces.occupied": "#f0c6c6",
   "theme.bar.buttons.workspaces.available": "#91d7e3",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#ed8796",
   "theme.bar.buttons.modules.netstat.icon_background": "#a6da95",
   "theme.bar.buttons.modules.kbLayout.text": "#91d7e3",
-  "theme.bar.buttons.notifications.icon_background": "#b7bdf8"
+  "theme.bar.buttons.notifications.icon_background": "#b7bdf8",
+  "theme.bar.buttons.volume.output_text": "#ee99a0",
+  "theme.bar.buttons.volume.input_icon": "#ee99a0",
+  "theme.bar.buttons.volume.input_text": "#ee99a0",
+  "theme.bar.buttons.volume.output_icon": "#ee99a0",
+  "theme.bar.buttons.volume.separator": "#494d64"
 }
diff --git a/themes/catppuccin_macchiato_split.json b/themes/catppuccin_macchiato_split.json
index f56af8330..40b14c511 100644
--- a/themes/catppuccin_macchiato_split.json
+++ b/themes/catppuccin_macchiato_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c6a0f6",
   "theme.bar.buttons.network.hover": "#494d64",
   "theme.bar.buttons.network.background": "#24273a",
-  "theme.bar.buttons.volume.icon": "#24273a",
-  "theme.bar.buttons.volume.text": "#ee99a0",
   "theme.bar.buttons.volume.hover": "#494d64",
   "theme.bar.buttons.volume.background": "#24273a",
   "theme.bar.buttons.media.hover": "#494d64",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#f5bde6",
   "theme.bar.buttons.windowtitle.hover": "#494d64",
   "theme.bar.buttons.windowtitle.background": "#24273a",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#181926",
   "theme.bar.buttons.workspaces.active": "#f5bde6",
   "theme.bar.buttons.workspaces.occupied": "#f0c6c6",
   "theme.bar.buttons.workspaces.available": "#91d7e3",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#181825",
   "theme.bar.buttons.modules.cpu.text": "#ed8796",
   "theme.bar.buttons.modules.netstat.icon_background": "#a6da95",
-  "theme.bar.buttons.modules.kbLayout.text": "#91d7e3"
+  "theme.bar.buttons.modules.kbLayout.text": "#91d7e3",
+  "theme.bar.buttons.volume.output_text": "#ee99a0",
+  "theme.bar.buttons.volume.input_icon": "#24273a",
+  "theme.bar.buttons.volume.input_text": "#ee99a0",
+  "theme.bar.buttons.volume.output_icon": "#24273a",
+  "theme.bar.buttons.volume.separator": "#494d64"
 }
diff --git a/themes/catppuccin_mocha.json b/themes/catppuccin_mocha.json
index db3097aaa..baa56ae4d 100644
--- a/themes/catppuccin_mocha.json
+++ b/themes/catppuccin_mocha.json
@@ -276,8 +276,11 @@
   "theme.bar.buttons.network.hover": "#45475a",
   "theme.bar.buttons.network.background": "#242438",
   "theme.bar.buttons.volume.icon_background": "#eba0ac",
-  "theme.bar.buttons.volume.icon": "#eba0ac",
-  "theme.bar.buttons.volume.text": "#eba0ac",
+  "theme.bar.buttons.volume.output_icon": "#eba0ac",
+  "theme.bar.buttons.volume.output_text": "#eba0ac",
+  "theme.bar.buttons.volume.input_icon": "#eba0ac",
+  "theme.bar.buttons.volume.input_text": "#eba0ac",
+  "theme.bar.buttons.volume.separator": "#45475a",
   "theme.bar.buttons.volume.hover": "#45475a",
   "theme.bar.buttons.volume.background": "#242438",
   "theme.bar.buttons.media.icon_background": "#b4befe",
diff --git a/themes/catppuccin_mocha_split.json b/themes/catppuccin_mocha_split.json
index 24a09828e..0415a7dbc 100644
--- a/themes/catppuccin_mocha_split.json
+++ b/themes/catppuccin_mocha_split.json
@@ -276,8 +276,11 @@
   "theme.bar.buttons.network.hover": "#45475a",
   "theme.bar.buttons.network.background": "#242438",
   "theme.bar.buttons.volume.icon_background": "#eba0ac",
-  "theme.bar.buttons.volume.icon": "#242438",
-  "theme.bar.buttons.volume.text": "#eba0ac",
+  "theme.bar.buttons.volume.output_icon": "#242438",
+  "theme.bar.buttons.volume.output_text": "#eba0ac",
+  "theme.bar.buttons.volume.input_icon": "#242438",
+  "theme.bar.buttons.volume.input_text": "#eba0ac",
+  "theme.bar.buttons.volume.separator": "#45475a",
   "theme.bar.buttons.volume.hover": "#45475a",
   "theme.bar.buttons.volume.background": "#242438",
   "theme.bar.buttons.media.icon_background": "#b4befe",
diff --git a/themes/cyberpunk.json b/themes/cyberpunk.json
index d84376d3c..0f26a05d6 100644
--- a/themes/cyberpunk.json
+++ b/themes/cyberpunk.json
@@ -276,8 +276,6 @@
   "theme.bar.buttons.network.hover": "#303030",
   "theme.bar.buttons.network.background": "#121212",
   "theme.bar.buttons.volume.icon_background": "#FF4500",
-  "theme.bar.buttons.volume.icon": "#ff3f3f",
-  "theme.bar.buttons.volume.text": "#ff3f3f",
   "theme.bar.buttons.volume.hover": "#303030",
   "theme.bar.buttons.volume.background": "#121212",
   "theme.bar.buttons.media.icon_background": "#FFD700",
@@ -323,5 +321,10 @@
   "theme.notification.label": "#5bafff",
   "theme.notification.actions.text": "#0a0a0a",
   "theme.notification.actions.background": "#5bafff",
-  "theme.notification.background": "#0a0a0a"
+  "theme.notification.background": "#0a0a0a",
+  "theme.bar.buttons.volume.output_text": "#FF4500",
+  "theme.bar.buttons.volume.input_icon": "#FF4500",
+  "theme.bar.buttons.volume.input_text": "#FF4500",
+  "theme.bar.buttons.volume.output_icon": "#FF4500",
+  "theme.bar.buttons.volume.separator": "#333333"
 }
\ No newline at end of file
diff --git a/themes/cyberpunk_split.json b/themes/cyberpunk_split.json
index ec85eec1b..904d404ef 100644
--- a/themes/cyberpunk_split.json
+++ b/themes/cyberpunk_split.json
@@ -276,8 +276,6 @@
   "theme.bar.buttons.network.hover": "#303030",
   "theme.bar.buttons.network.background": "#121212",
   "theme.bar.buttons.volume.icon_background": "#ff3f3f",
-  "theme.bar.buttons.volume.icon": "#121212",
-  "theme.bar.buttons.volume.text": "#ff3f3f",
   "theme.bar.buttons.volume.hover": "#303030",
   "theme.bar.buttons.volume.background": "#121212",
   "theme.bar.buttons.media.icon_background": "#00ffff",
@@ -323,5 +321,10 @@
   "theme.notification.label": "#5bafff",
   "theme.notification.actions.text": "#0a0a0a",
   "theme.notification.actions.background": "#5bafff",
-  "theme.notification.background": "#0a0a0a"
+  "theme.notification.background": "#0a0a0a",
+  "theme.bar.buttons.volume.output_icon": "#121212",
+  "theme.bar.buttons.volume.output_text": "#ff3f3f",
+  "theme.bar.buttons.volume.input_icon": "#121212",
+  "theme.bar.buttons.volume.input_text": "#ff3f3f",
+  "theme.bar.buttons.volume.separator": "#303030"
 }
\ No newline at end of file
diff --git a/themes/dracula.json b/themes/dracula.json
index 50c46f95e..f0bb8606a 100644
--- a/themes/dracula.json
+++ b/themes/dracula.json
@@ -276,8 +276,6 @@
   "theme.bar.buttons.network.hover": "#6272a4",
   "theme.bar.buttons.network.background": "#44475a",
   "theme.bar.buttons.volume.icon_background": "#ffb86c",
-  "theme.bar.buttons.volume.icon": "#ffb86c",
-  "theme.bar.buttons.volume.text": "#ffb86c",
   "theme.bar.buttons.volume.hover": "#6272a4",
   "theme.bar.buttons.volume.background": "#44475a",
   "theme.bar.buttons.media.icon_background": "#bd93f9",
@@ -323,5 +321,10 @@
   "theme.notification.label": "#bd93f9",
   "theme.notification.actions.text": "#282a36",
   "theme.notification.actions.background": "#bd93f9",
-  "theme.notification.background": "#282a36"
+  "theme.notification.background": "#282a36",
+  "theme.bar.buttons.volume.output_text": "#ffb86c",
+  "theme.bar.buttons.volume.input_icon": "#ffb86c",
+  "theme.bar.buttons.volume.input_text": "#ffb86c",
+  "theme.bar.buttons.volume.output_icon": "#ffb86c",
+  "theme.bar.buttons.volume.separator": "#44475a"
 }
\ No newline at end of file
diff --git a/themes/dracula_split.json b/themes/dracula_split.json
index 991012935..c6d43469f 100644
--- a/themes/dracula_split.json
+++ b/themes/dracula_split.json
@@ -276,8 +276,6 @@
   "theme.bar.buttons.network.hover": "#6272a4",
   "theme.bar.buttons.network.background": "#44475a",
   "theme.bar.buttons.volume.icon_background": "#ffb86c",
-  "theme.bar.buttons.volume.icon": "#44475a",
-  "theme.bar.buttons.volume.text": "#ffb86c",
   "theme.bar.buttons.volume.hover": "#6272a4",
   "theme.bar.buttons.volume.background": "#44475a",
   "theme.bar.buttons.media.icon_background": "#bd93f9",
@@ -323,5 +321,10 @@
   "theme.notification.label": "#bd93f9",
   "theme.notification.actions.text": "#282a36",
   "theme.notification.actions.background": "#bd93f9",
-  "theme.notification.background": "#44475a"
+  "theme.notification.background": "#44475a",
+  "theme.bar.buttons.volume.output_text": "#ffb86c",
+  "theme.bar.buttons.volume.input_icon": "#44475a",
+  "theme.bar.buttons.volume.input_text": "#ffb86c",
+  "theme.bar.buttons.volume.output_icon": "#44475a",
+  "theme.bar.buttons.volume.separator": "#44475a"
 }
\ No newline at end of file
diff --git a/themes/everforest.json b/themes/everforest.json
index 98dede51e..c80f543d4 100644
--- a/themes/everforest.json
+++ b/themes/everforest.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#e69875",
   "theme.bar.buttons.network.hover": "#454b53",
   "theme.bar.buttons.network.background": "#323d43",
-  "theme.bar.buttons.volume.icon": "#dbbc7f",
-  "theme.bar.buttons.volume.text": "#dbbc7f",
   "theme.bar.buttons.volume.hover": "#454b53",
   "theme.bar.buttons.volume.background": "#323d43",
   "theme.bar.buttons.media.hover": "#454b53",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#dbbc7f",
   "theme.bar.buttons.windowtitle.hover": "#454b53",
   "theme.bar.buttons.windowtitle.background": "#323d43",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#2b3339",
   "theme.bar.buttons.workspaces.active": "#dbbc7f",
   "theme.bar.buttons.workspaces.occupied": "#e69875",
   "theme.bar.buttons.workspaces.available": "#a7c080",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#e67e80",
   "theme.bar.buttons.modules.netstat.icon_background": "#a7c080",
   "theme.bar.buttons.modules.kbLayout.text": "#83c092",
-  "theme.bar.buttons.notifications.icon_background": "#a7c080"
+  "theme.bar.buttons.notifications.icon_background": "#a7c080",
+  "theme.bar.buttons.volume.output_text": "#e67e80",
+  "theme.bar.buttons.volume.input_icon": "#e67e80",
+  "theme.bar.buttons.volume.input_text": "#e67e80",
+  "theme.bar.buttons.volume.output_icon": "#e67e80",
+  "theme.bar.buttons.volume.separator": "#445055"
 }
diff --git a/themes/everforest_split.json b/themes/everforest_split.json
index a2ba5c3d1..f3cc30589 100644
--- a/themes/everforest_split.json
+++ b/themes/everforest_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#e69875",
   "theme.bar.buttons.network.hover": "#454b53",
   "theme.bar.buttons.network.background": "#323d43",
-  "theme.bar.buttons.volume.icon": "#323d43",
-  "theme.bar.buttons.volume.text": "#dbbc7f",
   "theme.bar.buttons.volume.hover": "#454b53",
   "theme.bar.buttons.volume.background": "#323d43",
   "theme.bar.buttons.media.hover": "#454b53",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#dbbc7f",
   "theme.bar.buttons.windowtitle.hover": "#454b53",
   "theme.bar.buttons.windowtitle.background": "#323d43",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#2b3339",
   "theme.bar.buttons.workspaces.active": "#dbbc7f",
   "theme.bar.buttons.workspaces.occupied": "#e69875",
   "theme.bar.buttons.workspaces.available": "#a7c080",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#21252b",
   "theme.bar.buttons.modules.cpu.text": "#e67e80",
   "theme.bar.buttons.modules.netstat.icon_background": "#a7c080",
-  "theme.bar.buttons.modules.kbLayout.text": "#83c092"
+  "theme.bar.buttons.modules.kbLayout.text": "#83c092",
+  "theme.bar.buttons.volume.output_text": "#e67e80",
+  "theme.bar.buttons.volume.input_icon": "#323d43",
+  "theme.bar.buttons.volume.input_text": "#e67e80",
+  "theme.bar.buttons.volume.output_icon": "#323d43",
+  "theme.bar.buttons.volume.separator": "#445055"
 }
diff --git a/themes/gruvbox.json b/themes/gruvbox.json
index d1f890584..50514d0e1 100644
--- a/themes/gruvbox.json
+++ b/themes/gruvbox.json
@@ -276,8 +276,6 @@
   "theme.bar.buttons.network.hover": "#504945",
   "theme.bar.buttons.network.background": "#282828",
   "theme.bar.buttons.volume.icon_background": "#fe8018",
-  "theme.bar.buttons.volume.icon": "#fe8018",
-  "theme.bar.buttons.volume.text": "#fe8018",
   "theme.bar.buttons.volume.hover": "#504945",
   "theme.bar.buttons.volume.background": "#282828",
   "theme.bar.buttons.media.icon_background": "#83a598",
@@ -323,5 +321,10 @@
   "theme.notification.label": "#83a598",
   "theme.notification.actions.text": "#32302f",
   "theme.notification.actions.background": "#83a598",
-  "theme.notification.background": "#32302f"
+  "theme.notification.background": "#32302f",
+  "theme.bar.buttons.volume.output_text": "#fb4934",
+  "theme.bar.buttons.volume.input_icon": "#fb4934",
+  "theme.bar.buttons.volume.input_text": "#fb4934",
+  "theme.bar.buttons.volume.output_icon": "#fb4934",
+  "theme.bar.buttons.volume.separator": "#504945"
 }
diff --git a/themes/gruvbox_split.json b/themes/gruvbox_split.json
index 16eb2d27b..8c62c7add 100644
--- a/themes/gruvbox_split.json
+++ b/themes/gruvbox_split.json
@@ -276,8 +276,6 @@
   "theme.bar.buttons.network.hover": "#504945",
   "theme.bar.buttons.network.background": "#282828",
   "theme.bar.buttons.volume.icon_background": "#fe8018",
-  "theme.bar.buttons.volume.icon": "#282828",
-  "theme.bar.buttons.volume.text": "#fe8018",
   "theme.bar.buttons.volume.hover": "#504945",
   "theme.bar.buttons.volume.background": "#282828",
   "theme.bar.buttons.media.icon_background": "#83a598",
@@ -323,5 +321,10 @@
   "theme.notification.label": "#83a598",
   "theme.notification.actions.text": "#32302f",
   "theme.notification.actions.background": "#83a598",
-  "theme.notification.background": "#32302f"
+  "theme.notification.background": "#32302f",
+  "theme.bar.buttons.volume.output_text": "#fb4934",
+  "theme.bar.buttons.volume.input_icon": "#282828",
+  "theme.bar.buttons.volume.input_text": "#fb4934",
+  "theme.bar.buttons.volume.output_icon": "#282828",
+  "theme.bar.buttons.volume.separator": "#504945"
 }
\ No newline at end of file
diff --git a/themes/monochrome.json b/themes/monochrome.json
index 823400652..dbec3c55c 100644
--- a/themes/monochrome.json
+++ b/themes/monochrome.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#FFFFFF",
   "theme.bar.buttons.network.hover": "#444444",
   "theme.bar.buttons.network.background": "#090909",
-  "theme.bar.buttons.volume.icon": "#FFFFFF",
-  "theme.bar.buttons.volume.text": "#FFFFFF",
   "theme.bar.buttons.volume.hover": "#444444",
   "theme.bar.buttons.volume.background": "#090909",
   "theme.bar.buttons.media.hover": "#444444",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#FFFFFF",
   "theme.bar.buttons.windowtitle.hover": "#444444",
   "theme.bar.buttons.windowtitle.background": "#090909",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#000000",
   "theme.bar.buttons.workspaces.active": "#FFFFFF",
   "theme.bar.buttons.workspaces.occupied": "#FFFFFF",
   "theme.bar.buttons.workspaces.available": "#FFFFFF",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#ffffff",
   "theme.bar.buttons.modules.netstat.icon_background": "#ffffff",
   "theme.bar.buttons.modules.kbLayout.text": "#ffffff",
-  "theme.bar.buttons.notifications.icon_background": "#FFFFFF"
+  "theme.bar.buttons.notifications.icon_background": "#FFFFFF",
+  "theme.bar.buttons.volume.output_text": "#ffffff",
+  "theme.bar.buttons.volume.input_icon": "#ffffff",
+  "theme.bar.buttons.volume.input_text": "#ffffff",
+  "theme.bar.buttons.volume.output_icon": "#ffffff",
+  "theme.bar.buttons.volume.separator": "#333333"
 }
diff --git a/themes/monochrome_split.json b/themes/monochrome_split.json
index 00cc224f9..873559ac6 100644
--- a/themes/monochrome_split.json
+++ b/themes/monochrome_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#FFFFFF",
   "theme.bar.buttons.network.hover": "#444444",
   "theme.bar.buttons.network.background": "#090909",
-  "theme.bar.buttons.volume.icon": "#090909",
-  "theme.bar.buttons.volume.text": "#FFFFFF",
   "theme.bar.buttons.volume.hover": "#444444",
   "theme.bar.buttons.volume.background": "#090909",
   "theme.bar.buttons.media.hover": "#444444",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#FFFFFF",
   "theme.bar.buttons.windowtitle.hover": "#444444",
   "theme.bar.buttons.windowtitle.background": "#090909",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#000000",
   "theme.bar.buttons.workspaces.active": "#FFFFFF",
   "theme.bar.buttons.workspaces.occupied": "#FFFFFF",
   "theme.bar.buttons.workspaces.available": "#FFFFFF",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#21252b",
   "theme.bar.buttons.modules.cpu.text": "#ffffff",
   "theme.bar.buttons.modules.netstat.icon_background": "#ffffff",
-  "theme.bar.buttons.modules.kbLayout.text": "#ffffff"
+  "theme.bar.buttons.modules.kbLayout.text": "#ffffff",
+  "theme.bar.buttons.volume.output_text": "#ffffff",
+  "theme.bar.buttons.volume.input_icon": "#090909",
+  "theme.bar.buttons.volume.input_text": "#ffffff",
+  "theme.bar.buttons.volume.output_icon": "#090909",
+  "theme.bar.buttons.volume.separator": "#333333"
 }
diff --git a/themes/nord.json b/themes/nord.json
index d7b04d335..ff193f435 100644
--- a/themes/nord.json
+++ b/themes/nord.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#88c0d0",
   "theme.bar.buttons.network.hover": "#434c53",
   "theme.bar.buttons.network.background": "#3b4252",
-  "theme.bar.buttons.volume.icon": "#81a1c1",
-  "theme.bar.buttons.volume.text": "#81a1c1",
   "theme.bar.buttons.volume.hover": "#434c53",
   "theme.bar.buttons.volume.background": "#3b4252",
   "theme.bar.buttons.media.hover": "#434c53",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#8fbcbb",
   "theme.bar.buttons.windowtitle.hover": "#434c53",
   "theme.bar.buttons.windowtitle.background": "#3b4252",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#2e3440",
   "theme.bar.buttons.workspaces.active": "#8fbcbb",
   "theme.bar.buttons.workspaces.occupied": "#81a1c1",
   "theme.bar.buttons.workspaces.available": "#88c0d0",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#8fbcbb",
   "theme.bar.buttons.modules.netstat.icon_background": "#8fbcbb",
   "theme.bar.buttons.modules.kbLayout.text": "#88c0d0",
-  "theme.bar.buttons.notifications.icon_background": "#88c0d0"
+  "theme.bar.buttons.notifications.icon_background": "#88c0d0",
+  "theme.bar.buttons.volume.output_text": "#81a1c1",
+  "theme.bar.buttons.volume.input_icon": "#81a1c1",
+  "theme.bar.buttons.volume.input_text": "#81a1c1",
+  "theme.bar.buttons.volume.output_icon": "#81a1c1",
+  "theme.bar.buttons.volume.separator": "#434c53"
 }
diff --git a/themes/nord_split.json b/themes/nord_split.json
index b0a16604e..33bf3359b 100644
--- a/themes/nord_split.json
+++ b/themes/nord_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#88c0d0",
   "theme.bar.buttons.network.hover": "#434c53",
   "theme.bar.buttons.network.background": "#3b4252",
-  "theme.bar.buttons.volume.icon": "#3b4252",
-  "theme.bar.buttons.volume.text": "#81a1c1",
   "theme.bar.buttons.volume.hover": "#434c53",
   "theme.bar.buttons.volume.background": "#3b4252",
   "theme.bar.buttons.media.hover": "#434c53",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#8fbcbb",
   "theme.bar.buttons.windowtitle.hover": "#434c53",
   "theme.bar.buttons.windowtitle.background": "#3b4252",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#2e3440",
   "theme.bar.buttons.workspaces.active": "#8fbcbb",
   "theme.bar.buttons.workspaces.occupied": "#81a1c1",
   "theme.bar.buttons.workspaces.available": "#88c0d0",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#21252b",
   "theme.bar.buttons.modules.cpu.text": "#8fbcbb",
   "theme.bar.buttons.modules.netstat.icon_background": "#8fbcbb",
-  "theme.bar.buttons.modules.kbLayout.text": "#88c0d0"
+  "theme.bar.buttons.modules.kbLayout.text": "#88c0d0",
+  "theme.bar.buttons.volume.output_text": "#81a1c1",
+  "theme.bar.buttons.volume.input_icon": "#3b4252",
+  "theme.bar.buttons.volume.input_text": "#81a1c1",
+  "theme.bar.buttons.volume.output_icon": "#3b4252",
+  "theme.bar.buttons.volume.separator": "#434c53"
 }
diff --git a/themes/one_dark.json b/themes/one_dark.json
index 2407d9e35..bd1b0eb34 100644
--- a/themes/one_dark.json
+++ b/themes/one_dark.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c678dd",
   "theme.bar.buttons.network.hover": "#4b5263",
   "theme.bar.buttons.network.background": "#21252b",
-  "theme.bar.buttons.volume.icon": "#e06c75",
-  "theme.bar.buttons.volume.text": "#e06c75",
   "theme.bar.buttons.volume.hover": "#4b5263",
   "theme.bar.buttons.volume.background": "#21252b",
   "theme.bar.buttons.media.hover": "#4b5263",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#98c379",
   "theme.bar.buttons.windowtitle.hover": "#4b5263",
   "theme.bar.buttons.windowtitle.background": "#21252b",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#282c34",
   "theme.bar.buttons.workspaces.active": "#c678dd",
   "theme.bar.buttons.workspaces.occupied": "#e06c75",
   "theme.bar.buttons.workspaces.available": "#61afef",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#e06c75",
   "theme.bar.buttons.modules.netstat.icon_background": "#98c379",
   "theme.bar.buttons.modules.kbLayout.text": "#56b6c2",
-  "theme.bar.buttons.notifications.icon_background": "#61afef"
+  "theme.bar.buttons.notifications.icon_background": "#61afef",
+  "theme.bar.buttons.volume.output_text": "#e06c75",
+  "theme.bar.buttons.volume.input_icon": "#e06c75",
+  "theme.bar.buttons.volume.input_text": "#e06c75",
+  "theme.bar.buttons.volume.output_icon": "#e06c75",
+  "theme.bar.buttons.volume.separator": "#3e4451"
 }
diff --git a/themes/one_dark_split.json b/themes/one_dark_split.json
index ec4f26282..b75222afc 100644
--- a/themes/one_dark_split.json
+++ b/themes/one_dark_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c678dd",
   "theme.bar.buttons.network.hover": "#4b5263",
   "theme.bar.buttons.network.background": "#21252b",
-  "theme.bar.buttons.volume.icon": "#21252b",
-  "theme.bar.buttons.volume.text": "#e06c75",
   "theme.bar.buttons.volume.hover": "#4b5263",
   "theme.bar.buttons.volume.background": "#21252b",
   "theme.bar.buttons.media.hover": "#4b5263",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#98c379",
   "theme.bar.buttons.windowtitle.hover": "#4b5263",
   "theme.bar.buttons.windowtitle.background": "#21252b",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#282c34",
   "theme.bar.buttons.workspaces.active": "#c678dd",
   "theme.bar.buttons.workspaces.occupied": "#e06c75",
   "theme.bar.buttons.workspaces.available": "#61afef",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#21252b",
   "theme.bar.buttons.modules.cpu.text": "#e06c75",
   "theme.bar.buttons.modules.netstat.icon_background": "#98c379",
-  "theme.bar.buttons.modules.kbLayout.text": "#56b6c2"
+  "theme.bar.buttons.modules.kbLayout.text": "#56b6c2",
+  "theme.bar.buttons.volume.output_text": "#e06c75",
+  "theme.bar.buttons.volume.input_icon": "#21252b",
+  "theme.bar.buttons.volume.input_text": "#e06c75",
+  "theme.bar.buttons.volume.output_icon": "#21252b",
+  "theme.bar.buttons.volume.separator": "#3e4451"
 }
diff --git a/themes/rose_pine.json b/themes/rose_pine.json
index 8ceae42b5..1fa93a46a 100644
--- a/themes/rose_pine.json
+++ b/themes/rose_pine.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.hover": "#26233a",
   "theme.bar.buttons.network.background": "#21202e",
-  "theme.bar.buttons.volume.icon": "#eb6f92",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.hover": "#26233a",
   "theme.bar.buttons.volume.background": "#21202e",
   "theme.bar.buttons.media.hover": "#26233a",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
   "theme.bar.buttons.windowtitle.hover": "#26233a",
   "theme.bar.buttons.windowtitle.background": "#21202e",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#1f1d2e",
   "theme.bar.buttons.workspaces.active": "#c4a7e7",
   "theme.bar.buttons.workspaces.occupied": "#eb6f92",
   "theme.bar.buttons.workspaces.available": "#9ccfd8",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#eb6f92",
   "theme.bar.buttons.modules.netstat.icon_background": "#9ccfd8",
   "theme.bar.buttons.modules.kbLayout.text": "#9ccfd8",
-  "theme.bar.buttons.notifications.icon_background": "#c4a7e7"
+  "theme.bar.buttons.notifications.icon_background": "#c4a7e7",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#eb6f92",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.output_icon": "#eb6f92",
+  "theme.bar.buttons.volume.separator": "#26233a"
 }
diff --git a/themes/rose_pine_moon.json b/themes/rose_pine_moon.json
index c1072193d..8d533bdf8 100644
--- a/themes/rose_pine_moon.json
+++ b/themes/rose_pine_moon.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.hover": "#393552",
   "theme.bar.buttons.network.background": "#2a283e",
-  "theme.bar.buttons.volume.icon": "#eb6f92",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.hover": "#393552",
   "theme.bar.buttons.volume.background": "#2a283e",
   "theme.bar.buttons.media.hover": "#393552",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
   "theme.bar.buttons.windowtitle.hover": "#393552",
   "theme.bar.buttons.windowtitle.background": "#2a283e",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#2a273f",
   "theme.bar.buttons.workspaces.active": "#c4a7e7",
   "theme.bar.buttons.workspaces.occupied": "#eb6f92",
   "theme.bar.buttons.workspaces.available": "#9ccfd8",
@@ -268,7 +265,6 @@
   "theme.bar.menus.menu.notifications.pager.background": "#232136",
   "theme.bar.buttons.modules.ram.icon": "#f6c177",
   "theme.bar.buttons.modules.storage.icon_background": "#2a283e",
-  "theme.bar.menus.menu.power.card.color": "#2a283e",
   "theme.bar.buttons.modules.storage.icon": "#c4a7e7",
   "theme.bar.buttons.modules.weather.icon": "#c4a7e7",
   "theme.bar.buttons.modules.power.icon": "#eb6f92",
@@ -325,5 +321,10 @@
   "theme.bar.menus.menu.power.buttons.restart.background": "#2a283e",
   "theme.bar.buttons.modules.cpu.text": "#eb6f92",
   "theme.bar.buttons.modules.kbLayout.text": "#9ccfd8",
-  "theme.bar.buttons.notifications.icon_background": "#c4a7e7"
+  "theme.bar.buttons.notifications.icon_background": "#c4a7e7",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#eb6f92",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.output_icon": "#eb6f92",
+  "theme.bar.buttons.volume.separator": "#393552"
 }
diff --git a/themes/rose_pine_moon_split.json b/themes/rose_pine_moon_split.json
index 0e91d051e..f136d000e 100644
--- a/themes/rose_pine_moon_split.json
+++ b/themes/rose_pine_moon_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.hover": "#393552",
   "theme.bar.buttons.network.background": "#2a283e",
-  "theme.bar.buttons.volume.icon": "#2a283e",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.hover": "#393552",
   "theme.bar.buttons.volume.background": "#2a283e",
   "theme.bar.buttons.media.hover": "#393552",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
   "theme.bar.buttons.windowtitle.hover": "#393552",
   "theme.bar.buttons.windowtitle.background": "#2a283e",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#2a273f",
   "theme.bar.buttons.workspaces.active": "#c4a7e7",
   "theme.bar.buttons.workspaces.occupied": "#eb6f92",
   "theme.bar.buttons.workspaces.available": "#9ccfd8",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#181825",
   "theme.bar.buttons.modules.cpu.text": "#eb6f92",
   "theme.bar.buttons.modules.netstat.icon_background": "#9ccfd8",
-  "theme.bar.buttons.modules.kbLayout.text": "#9ccfd8"
+  "theme.bar.buttons.modules.kbLayout.text": "#9ccfd8",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#2a283e",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.output_icon": "#2a283e",
+  "theme.bar.buttons.volume.separator": "#393552"
 }
diff --git a/themes/rose_pine_split.json b/themes/rose_pine_split.json
index 846facf9e..ab53ba438 100644
--- a/themes/rose_pine_split.json
+++ b/themes/rose_pine_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.hover": "#26233a",
   "theme.bar.buttons.network.background": "#21202e",
-  "theme.bar.buttons.volume.icon": "#21202e",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.hover": "#26233a",
   "theme.bar.buttons.volume.background": "#21202e",
   "theme.bar.buttons.media.hover": "#26233a",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
   "theme.bar.buttons.windowtitle.hover": "#26233a",
   "theme.bar.buttons.windowtitle.background": "#21202e",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#1f1d2e",
   "theme.bar.buttons.workspaces.active": "#c4a7e7",
   "theme.bar.buttons.workspaces.occupied": "#eb6f92",
   "theme.bar.buttons.workspaces.available": "#9ccfd8",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#181825",
   "theme.bar.buttons.modules.cpu.text": "#eb6f92",
   "theme.bar.buttons.modules.netstat.icon_background": "#9ccfd8",
-  "theme.bar.buttons.modules.kbLayout.text": "#9ccfd8"
+  "theme.bar.buttons.modules.kbLayout.text": "#9ccfd8",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#21202e",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.output_icon": "#21202e",
+  "theme.bar.buttons.volume.separator": "#26233a"
 }
diff --git a/themes/tokyo_night.json b/themes/tokyo_night.json
index 817eae65d..579b82f5a 100644
--- a/themes/tokyo_night.json
+++ b/themes/tokyo_night.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#bb9af7",
   "theme.bar.buttons.network.hover": "#414868",
   "theme.bar.buttons.network.background": "#272a3d",
-  "theme.bar.buttons.volume.icon": "#f7768e",
-  "theme.bar.buttons.volume.text": "#f7768e",
   "theme.bar.buttons.volume.hover": "#414868",
   "theme.bar.buttons.volume.background": "#272a3d",
   "theme.bar.buttons.media.hover": "#414868",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#f7768e",
   "theme.bar.buttons.windowtitle.hover": "#414868",
   "theme.bar.buttons.windowtitle.background": "#272a3d",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#24283b",
   "theme.bar.buttons.workspaces.active": "#f7768e",
   "theme.bar.buttons.workspaces.occupied": "#f7768e",
   "theme.bar.buttons.workspaces.available": "#7dcfff",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.cpu.text": "#f7768e",
   "theme.bar.buttons.modules.netstat.icon_background": "#9ece6a",
   "theme.bar.buttons.modules.kbLayout.text": "#7dcfff",
-  "theme.bar.buttons.notifications.icon_background": "#bb9af7"
+  "theme.bar.buttons.notifications.icon_background": "#bb9af7",
+  "theme.bar.buttons.volume.output_text": "#f7768e",
+  "theme.bar.buttons.volume.input_icon": "#f7768e",
+  "theme.bar.buttons.volume.input_text": "#f7768e",
+  "theme.bar.buttons.volume.output_icon": "#f7768e",
+  "theme.bar.buttons.volume.separator": "#414868"
 }
diff --git a/themes/tokyo_night_split.json b/themes/tokyo_night_split.json
index a9169166a..d5122c39f 100644
--- a/themes/tokyo_night_split.json
+++ b/themes/tokyo_night_split.json
@@ -221,8 +221,6 @@
   "theme.bar.buttons.network.text": "#bb9af7",
   "theme.bar.buttons.network.hover": "#414868",
   "theme.bar.buttons.network.background": "#272a3d",
-  "theme.bar.buttons.volume.icon": "#272a3d",
-  "theme.bar.buttons.volume.text": "#f7768e",
   "theme.bar.buttons.volume.hover": "#414868",
   "theme.bar.buttons.volume.background": "#272a3d",
   "theme.bar.buttons.media.hover": "#414868",
@@ -230,7 +228,6 @@
   "theme.bar.buttons.windowtitle.text": "#f7768e",
   "theme.bar.buttons.windowtitle.hover": "#414868",
   "theme.bar.buttons.windowtitle.background": "#272a3d",
-  "theme.bar.buttons.workspaces.numbered_active_text_color": "#24283b",
   "theme.bar.buttons.workspaces.active": "#f7768e",
   "theme.bar.buttons.workspaces.occupied": "#f7768e",
   "theme.bar.buttons.workspaces.available": "#7dcfff",
@@ -324,5 +321,10 @@
   "theme.bar.buttons.modules.updates.icon": "#181825",
   "theme.bar.buttons.modules.cpu.text": "#f7768e",
   "theme.bar.buttons.modules.netstat.icon_background": "#9ece6a",
-  "theme.bar.buttons.modules.kbLayout.text": "#7dcfff"
+  "theme.bar.buttons.modules.kbLayout.text": "#7dcfff",
+  "theme.bar.buttons.volume.output_text": "#f7768e",
+  "theme.bar.buttons.volume.input_icon": "#272a3d",
+  "theme.bar.buttons.volume.input_text": "#f7768e",
+  "theme.bar.buttons.volume.output_icon": "#272a3d",
+  "theme.bar.buttons.volume.separator": "#414868"
 }

From 34f735ff04787040461a474ae514058ccfd25bb1 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 11 Sep 2024 05:44:29 +0200
Subject: [PATCH 04/15] add subtitle to hide_muted_label

---
 widget/settings/pages/config/bar/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/widget/settings/pages/config/bar/index.ts b/widget/settings/pages/config/bar/index.ts
index bdb77eb8b..0cde89b5a 100644
--- a/widget/settings/pages/config/bar/index.ts
+++ b/widget/settings/pages/config/bar/index.ts
@@ -290,6 +290,7 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
                 Option({
                     opt: options.bar.volume.hide_muted_label,
                     title: "Hide Percentage On Mute",
+                    subtitle: "Only applicable if Show Volume Percentage is enabled",
                     type: "boolean",
                 }),
                 Option({

From dd988f21a34850fad2e82d27432446df75bd3d0f Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 11 Sep 2024 07:14:54 +0200
Subject: [PATCH 05/15] fix bind loop on volume hooks

---
 modules/bar/volume/index.ts | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 24a5c95b1..69dfcbd42 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -40,14 +40,12 @@ const Volume = () => {
         return Widget.Label({
             hexpand: true,
             class_name
-        }).hook(audio_type, (self) => Utils.merge(
-            [audio_type.bind("volume"), audio_type.bind("is_muted")],
-            (volume, isMuted) => {
-                if (!self.is_destroyed) {
-                    self.set_text(getIcon(icons, volume, isMuted));
-                    self.class_name = `${class_name} ${!showLabel || (hideMutedLabel && (isMuted !== false || Math.round(volume * 100) === 0)) ? "no-label" : ""}`;
-                }
-            }));
+        }).hook(audio_type, (self) => {
+            if (!self.is_destroyed) {
+                self.set_text(getIcon(icons, audio_type.volume, audio_type.is_muted));
+                self.class_name = `${class_name} ${!showLabel || (hideMutedLabel && (audio_type.is_muted !== false || Math.round(audio_type.volume * 100) === 0)) ? "no-label" : ""}`;
+            }
+        });
     };
 
     const volPctUpdate = (label: Label<any>, volume: number, isMuted: boolean | null, hideMutedLabel: boolean): void => {
@@ -61,9 +59,7 @@ const Volume = () => {
         const label: Label<any> = Widget.Label({
             hexpand: true,
             class_name: `bar-button-label volume ${class_name}`,
-        }).hook(audio_type, (self) => Utils.merge(
-            [audio_type.bind("is_muted"), audio_type.bind("volume")],
-            (isMuted, volume) => volPctUpdate(self, volume, isMuted, hideMutedLabel)));
+        }).hook(audio_type, (self) => volPctUpdate(self, audio_type.volume, audio_type.is_muted, hideMutedLabel));
 
         // Workaround for ags setting the label visible on creation
         if (hideMutedLabel) {

From cf15fd61b982ada87837d32eff8cf25501ba599d Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 11 Sep 2024 07:21:08 +0200
Subject: [PATCH 06/15] consolidate volume percentage update parameters

---
 modules/bar/volume/index.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 69dfcbd42..20b6befcd 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -48,10 +48,10 @@ const Volume = () => {
         });
     };
 
-    const volPctUpdate = (label: Label<any>, volume: number, isMuted: boolean | null, hideMutedLabel: boolean): void => {
+    const volPctUpdate = (label: Label<any>, audio_type: Stream, hideMutedLabel: boolean): void => {
         if (!label.is_destroyed) {
-            label.set_text(isMuted !== false ? "0%" : `${Math.round(volume * 100)}%`);
-            label.set_visible(!(hideMutedLabel && (isMuted !== false || Math.round(volume * 100) === 0)));
+            label.set_text(audio_type.is_muted !== false ? "0%" : `${Math.round(audio_type.volume * 100)}%`);
+            label.set_visible(!(hideMutedLabel && (audio_type.is_muted !== false || Math.round(audio_type.volume * 100) === 0)));
         }
     };
 
@@ -59,11 +59,11 @@ const Volume = () => {
         const label: Label<any> = Widget.Label({
             hexpand: true,
             class_name: `bar-button-label volume ${class_name}`,
-        }).hook(audio_type, (self) => volPctUpdate(self, audio_type.volume, audio_type.is_muted, hideMutedLabel));
+        }).hook(audio_type, (self) => volPctUpdate(self, audio_type, hideMutedLabel));
 
         // Workaround for ags setting the label visible on creation
         if (hideMutedLabel) {
-            Utils.timeout(500, () => volPctUpdate(label, audio_type.volume, audio_type.is_muted, hideMutedLabel));
+            Utils.timeout(500, () => volPctUpdate(label, audio_type, hideMutedLabel));
         }
         return label;
     };

From be01571d972a449c508fa00cd8dbd00a498312da Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 18 Sep 2024 16:47:52 +0200
Subject: [PATCH 07/15] remove hooks, improve readability, lint & format code

---
 modules/bar/volume/index.ts | 136 ++++++++++++++++++++----------------
 1 file changed, 75 insertions(+), 61 deletions(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 93417ab25..926a5be50 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -1,34 +1,35 @@
 import Gdk from 'gi://Gdk?version=3.0';
-const audio = await Service.import("audio");
-import { openMenu } from "../utils.js";
-import options from "options";
+const audio = await Service.import('audio');
+import { openMenu } from '../utils.js';
+import options from 'options';
 import { VolumeIcons } from 'lib/types/volume.js';
 import { BarBoxChild } from 'lib/types/bar.js';
-import { Stream } from 'types/service/audio';
-import Separator from "types/widgets/separator";
-import Label from "types/widgets/label";
+import Button from 'types/widgets/button.js';
+import { Child } from 'lib/types/widget.js';
+import Separator from 'types/widgets/separator';
+import Label from 'types/widgets/label';
 
 const Volume = (): BarBoxChild => {
     const { label, input, output, hide_muted_label } = options.bar.volume;
 
     const outputIcons: VolumeIcons = {
-        101: "󱄠",
-        66: "󰕾",
-        34: "󰖀",
-        1: "󰕿",
-        0: "󰝟",
+        101: '󱄠',
+        66: '󰕾',
+        34: '󰖀',
+        1: '󰕿',
+        0: '󰝟',
     };
 
     const inputIcons: VolumeIcons = {
-        51: "󰍬",
-        1: "󰍮",
-        0: "󰍭",
+        51: '󰍬',
+        1: '󰍮',
+        0: '󰍭',
     };
 
-    const getIcon = (icons: VolumeIcons, volume: number, isMuted: (boolean | null)): string => {
-        const keys = Object.keys(icons).map(Number).reverse();
+    const getIcon = (icons: VolumeIcons, volume: number, isMuted: boolean): string => {
+        const keys: number[] = Object.keys(icons).map(Number).reverse();
         let icon: number;
-        if (isMuted !== false || Math.round(volume * 100) === 0) {
+        if (isMuted) {
             icon = 0;
         } else {
             icon = keys.find((threshold) => threshold <= Math.round(volume * 100)) ?? keys[0];
@@ -36,74 +37,87 @@ const Volume = (): BarBoxChild => {
         return icons[icon];
     };
 
-    const volIcn = (audio_type: Stream, icons: VolumeIcons, extra_class_name: string, showLabel: boolean, hideMutedLabel: boolean): Label<any> => {
-        const class_name = `bar-button-icon volume txt-icon bar ${extra_class_name}`;
+    const volIcn = (volume: number, isMuted: boolean, icons: VolumeIcons, class_name: string): Label<never> => {
         return Widget.Label({
             hexpand: true,
-            class_name
-        }).hook(audio_type, (self) => {
-            if (!self.is_destroyed) {
-                self.set_text(getIcon(icons, audio_type.volume, audio_type.is_muted));
-                self.class_name = `${class_name} ${!showLabel || (hideMutedLabel && (audio_type.is_muted !== false || Math.round(audio_type.volume * 100) === 0)) ? "no-label" : ""}`;
-            }
+            class_name: `bar-button-icon volume txt-icon bar ${class_name}`,
+            label: getIcon(icons, volume, isMuted),
         });
     };
 
-    const volPctUpdate = (label: Label<any>, audio_type: Stream, hideMutedLabel: boolean): void => {
-        if (!label.is_destroyed) {
-            label.set_text(audio_type.is_muted !== false ? "0%" : `${Math.round(audio_type.volume * 100)}%`);
-            label.set_visible(!(hideMutedLabel && (audio_type.is_muted !== false || Math.round(audio_type.volume * 100) === 0)));
-        }
-    };
-
-    const volPct = (audio_type: Stream, class_name: string, hideMutedLabel: boolean): Label<any> => {
-        const label: Label<any> = Widget.Label({
+    const volPct = (volume: number, isMuted: boolean, class_name: string): Label<never> => {
+        return Widget.Label({
             hexpand: true,
             class_name: `bar-button-label volume ${class_name}`,
-        }).hook(audio_type, (self) => volPctUpdate(self, audio_type, hideMutedLabel));
-
-        // Workaround for ags setting the label visible on creation
-        if (hideMutedLabel) {
-            Utils.timeout(500, () => volPctUpdate(label, audio_type, hideMutedLabel));
-        }
-        return label;
+            label: isMuted ? '0%' : `${Math.round(volume * 100)}%`,
+        });
     };
 
     return {
         component: Widget.Box({
             hexpand: true,
             vexpand: true,
-            className: Utils.merge([options.theme.bar.buttons.style.bind("value"), label.bind("value")], (style, showLabel) => {
-                const styleMap = {
-                    default: "style1",
-                    split: "style2",
-                    wave: "style3",
-                    wave2: "style3",
-                };
+            className: Utils.merge(
+                [options.theme.bar.buttons.style.bind('value'), label.bind('value')],
+                (style, showLabel) => {
+                    const styleMap = {
+                        default: 'style1',
+                        split: 'style2',
+                        wave: 'style3',
+                        wave2: 'style3',
+                    };
 
-                return `volume ${styleMap[style]} ${!showLabel ? "no-label" : ""}`;
-            }),
+                    return `volume ${styleMap[style]} ${!showLabel ? 'no-label' : ''}`;
+                },
+            ),
             children: Utils.merge(
-                [label.bind("value"), output.bind("value"), input.bind("value"), hide_muted_label.bind("value")],
-                (showLabel, showOutput, showInput, hideMutedLabel) => {
-                    let children: (Label<any> | Separator<any>)[] = [];
+                [
+                    audio.speaker.bind('volume'),
+                    audio.speaker.bind('is_muted'),
+                    audio.microphone.bind('volume'),
+                    audio.microphone.bind('is_muted'),
+                    label.bind('value'),
+                    output.bind('value'),
+                    input.bind('value'),
+                    hide_muted_label.bind('value'),
+                ],
+                (
+                    outputVolume,
+                    outputIsMuted,
+                    inputVolume,
+                    inputIsMuted,
+                    showLabel,
+                    showOutput,
+                    showInput,
+                    hideMutedLabel,
+                ) => {
+                    const children: (Label<never> | Separator<never>)[] = [];
                     if (showOutput) {
-                        children.push(volIcn(audio.speaker, outputIcons, "output", showLabel, hideMutedLabel));
-                        if (showLabel) {
-                            children.push(volPct(audio.speaker, `output ${!showInput ? "no-separator" : ""}`, hideMutedLabel));
+                        const isMuted = outputIsMuted !== false || Math.round(outputVolume * 100) === 0;
+                        const labelVisible = showLabel && !(hideMutedLabel && isMuted);
+                        children.push(
+                            volIcn(outputVolume, isMuted, outputIcons, `output ${!labelVisible ? 'no-label' : ''}`),
+                        );
+                        if (labelVisible) {
+                            children.push(volPct(outputVolume, isMuted, `output ${!showInput ? 'no-separator' : ''}`));
                         }
                     }
                     if (showInput) {
                         if (showOutput) {
-                            children.push(Widget.Separator({ vertical: true, class_name: "bar-separator volume" }));
+                            children.push(Widget.Separator({ vertical: true, class_name: 'bar-separator volume' }));
                         }
-                        children.push(volIcn(audio.microphone, inputIcons, "input", showLabel, hideMutedLabel));
-                        if (showLabel) {
-                            children.push(volPct(audio.microphone, "input no-separator", hideMutedLabel));
+                        const isMuted = inputIsMuted !== false || Math.round(inputVolume * 100) === 0;
+                        const labelVisible = showLabel && !(hideMutedLabel && isMuted);
+                        children.push(
+                            volIcn(inputVolume, isMuted, inputIcons, `input ${!labelVisible ? 'no-label' : ''}`),
+                        );
+                        if (labelVisible) {
+                            children.push(volPct(inputVolume, isMuted, 'input no-separator'));
                         }
                     }
                     return children;
-                }),
+                },
+            ),
         }),
         isVisible: true,
         boxClass: 'volume',

From a7f2b26a8a18a5f53f39047957714d4e01bd502b Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 18 Sep 2024 16:56:00 +0200
Subject: [PATCH 08/15] lint volume bar settings

---
 widget/settings/pages/config/bar/index.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/widget/settings/pages/config/bar/index.ts b/widget/settings/pages/config/bar/index.ts
index 8cbe020fd..66e61c70c 100644
--- a/widget/settings/pages/config/bar/index.ts
+++ b/widget/settings/pages/config/bar/index.ts
@@ -307,13 +307,13 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
                 Header('Volume'),
                 Option({
                     opt: options.bar.volume.output,
-                    title: "Show Speaker",
-                    type: "boolean",
+                    title: 'Show Speaker',
+                    type: 'boolean',
                 }),
                 Option({
                     opt: options.bar.volume.input,
-                    title: "Show Microphone",
-                    type: "boolean",
+                    title: 'Show Microphone',
+                    type: 'boolean',
                 }),
                 Option({
                     opt: options.bar.volume.label,
@@ -322,9 +322,9 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
                 }),
                 Option({
                     opt: options.bar.volume.hide_muted_label,
-                    title: "Hide Percentage On Mute",
-                    subtitle: "Only applicable if Show Volume Percentage is enabled",
-                    type: "boolean",
+                    title: 'Hide Percentage On Mute',
+                    subtitle: 'Only applicable if Show Volume Percentage is enabled',
+                    type: 'boolean',
                 }),
                 Option({
                     opt: options.theme.bar.buttons.volume.spacing,

From 0c0257247e9159837048d939b0c01fa6a28e2aa5 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Thu, 19 Sep 2024 21:00:48 +0200
Subject: [PATCH 09/15] add right icon support for split style

---
 modules/bar/volume/index.ts | 48 ++++++++++++++++++++++++-------------
 scss/style/bar/audio.scss   | 19 +++++++++++++++
 2 files changed, 51 insertions(+), 16 deletions(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 926a5be50..233403b29 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -11,6 +11,7 @@ import Label from 'types/widgets/label';
 
 const Volume = (): BarBoxChild => {
     const { label, input, output, hide_muted_label } = options.bar.volume;
+    const button_style = options.theme.bar.buttons.style;
 
     const outputIcons: VolumeIcons = {
         101: '󱄠',
@@ -57,25 +58,23 @@ const Volume = (): BarBoxChild => {
         component: Widget.Box({
             hexpand: true,
             vexpand: true,
-            className: Utils.merge(
-                [options.theme.bar.buttons.style.bind('value'), label.bind('value')],
-                (style, showLabel) => {
-                    const styleMap = {
-                        default: 'style1',
-                        split: 'style2',
-                        wave: 'style3',
-                        wave2: 'style3',
-                    };
+            className: Utils.merge([button_style.bind('value'), label.bind('value')], (style, showLabel) => {
+                const styleMap = {
+                    default: 'style1',
+                    split: 'style2',
+                    wave: 'style3',
+                    wave2: 'style3',
+                };
 
-                    return `volume ${styleMap[style]} ${!showLabel ? 'no-label' : ''}`;
-                },
-            ),
+                return `volume ${styleMap[style]} ${!showLabel ? 'no-label' : ''}`;
+            }),
             children: Utils.merge(
                 [
                     audio.speaker.bind('volume'),
                     audio.speaker.bind('is_muted'),
                     audio.microphone.bind('volume'),
                     audio.microphone.bind('is_muted'),
+                    button_style.bind('value'),
                     label.bind('value'),
                     output.bind('value'),
                     input.bind('value'),
@@ -86,6 +85,7 @@ const Volume = (): BarBoxChild => {
                     outputIsMuted,
                     inputVolume,
                     inputIsMuted,
+                    buttonStyle,
                     showLabel,
                     showOutput,
                     showInput,
@@ -102,17 +102,33 @@ const Volume = (): BarBoxChild => {
                             children.push(volPct(outputVolume, isMuted, `output ${!showInput ? 'no-separator' : ''}`));
                         }
                     }
+
                     if (showInput) {
                         if (showOutput) {
                             children.push(Widget.Separator({ vertical: true, class_name: 'bar-separator volume' }));
                         }
                         const isMuted = inputIsMuted !== false || Math.round(inputVolume * 100) === 0;
                         const labelVisible = showLabel && !(hideMutedLabel && isMuted);
-                        children.push(
-                            volIcn(inputVolume, isMuted, inputIcons, `input ${!labelVisible ? 'no-label' : ''}`),
-                        );
+                        const rightIcon = buttonStyle === 'split' && showOutput;
+                        if (!rightIcon) {
+                            children.push(
+                                volIcn(inputVolume, isMuted, inputIcons, `input ${!labelVisible ? 'no-label' : ''}`),
+                            );
+                        }
                         if (labelVisible) {
-                            children.push(volPct(inputVolume, isMuted, 'input no-separator'));
+                            children.push(
+                                volPct(inputVolume, isMuted, `input ${rightIcon ? 'right-icon' : 'no-separator'}`),
+                            );
+                        }
+                        if (rightIcon) {
+                            children.push(
+                                volIcn(
+                                    inputVolume,
+                                    isMuted,
+                                    inputIcons,
+                                    `input right-icon ${!labelVisible ? 'no-label' : ''}`,
+                                ),
+                            );
                         }
                     }
                     return children;
diff --git a/scss/style/bar/audio.scss b/scss/style/bar/audio.scss
index 281e598c7..fcbb15ab3 100644
--- a/scss/style/bar/audio.scss
+++ b/scss/style/bar/audio.scss
@@ -38,6 +38,20 @@
     padding-left: $bar-buttons-padding_x;
     padding-right: $bar-buttons-volume-spacing;
 
+    &.right-icon {
+      border-top-right-radius: $bar-buttons-radius;
+      border-bottom-right-radius: $bar-buttons-radius;
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+      padding-left: $bar-buttons-volume-spacing;
+      padding-right: $bar-buttons-padding_x;
+
+      &.no-label {
+        border-top-left-radius: $bar-buttons-radius;
+        border-bottom-left-radius: $bar-buttons-radius;
+      }
+    }
+
     &.no-label {
       border-top-right-radius: $bar-buttons-radius;
       border-bottom-right-radius: $bar-buttons-radius;
@@ -49,6 +63,11 @@
     padding-left: $bar-buttons-volume-spacing;
     margin-left: 0em;
 
+    &.right-icon {
+      padding-left: 0;
+      padding-right: $bar-buttons-volume-spacing;
+    }
+
     &.no-separator {
       padding-right: $bar-buttons-padding_x;
     }

From 7235cef6943ba6ed59d1f7dfd3dc3a6b9f8258cb Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Thu, 19 Sep 2024 21:01:18 +0200
Subject: [PATCH 10/15] add volume toggle side effects

---
 modules/bar/SideEffects.ts | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/modules/bar/SideEffects.ts b/modules/bar/SideEffects.ts
index 8b055bf02..43178e333 100644
--- a/modules/bar/SideEffects.ts
+++ b/modules/bar/SideEffects.ts
@@ -13,3 +13,17 @@ showTime.connect('changed', () => {
         showIcon.value = true;
     }
 });
+
+const { output, input } = options.bar.volume;
+
+output.connect('changed', () => {
+    if (!output.value && !input.value) {
+        input.value = true;
+    }
+});
+
+input.connect('changed', () => {
+    if (!output.value && !input.value) {
+        output.value = true;
+    }
+});

From 17bdd85fc45792b1a56a21d0fb10a9236005d046 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Sat, 21 Sep 2024 03:48:19 +0200
Subject: [PATCH 11/15] fix volume children type

---
 modules/bar/volume/index.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 233403b29..16cf816cb 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -91,7 +91,7 @@ const Volume = (): BarBoxChild => {
                     showInput,
                     hideMutedLabel,
                 ) => {
-                    const children: (Label<never> | Separator<never>)[] = [];
+                    const children: (Label<Child> | Separator<Child>)[] = [];
                     if (showOutput) {
                         const isMuted = outputIsMuted !== false || Math.round(outputVolume * 100) === 0;
                         const labelVisible = showLabel && !(hideMutedLabel && isMuted);
@@ -110,16 +110,19 @@ const Volume = (): BarBoxChild => {
                         const isMuted = inputIsMuted !== false || Math.round(inputVolume * 100) === 0;
                         const labelVisible = showLabel && !(hideMutedLabel && isMuted);
                         const rightIcon = buttonStyle === 'split' && showOutput;
+
                         if (!rightIcon) {
                             children.push(
                                 volIcn(inputVolume, isMuted, inputIcons, `input ${!labelVisible ? 'no-label' : ''}`),
                             );
                         }
+
                         if (labelVisible) {
                             children.push(
                                 volPct(inputVolume, isMuted, `input ${rightIcon ? 'right-icon' : 'no-separator'}`),
                             );
                         }
+
                         if (rightIcon) {
                             children.push(
                                 volIcn(

From b76ff477d84221ea13bdfb42c7f3668929422652 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Sat, 12 Oct 2024 20:01:05 +0200
Subject: [PATCH 12/15] remove input icon from split style and replace it with
 a toggle to switch the icons

---
 modules/bar/SideEffects.ts                | 14 -----
 modules/bar/volume/index.ts               | 66 ++++++++---------------
 options.ts                                |  3 +-
 scss/style/bar/audio.scss                 | 25 ---------
 widget/settings/pages/config/bar/index.ts | 15 ++----
 5 files changed, 28 insertions(+), 95 deletions(-)

diff --git a/modules/bar/SideEffects.ts b/modules/bar/SideEffects.ts
index 43178e333..8b055bf02 100644
--- a/modules/bar/SideEffects.ts
+++ b/modules/bar/SideEffects.ts
@@ -13,17 +13,3 @@ showTime.connect('changed', () => {
         showIcon.value = true;
     }
 });
-
-const { output, input } = options.bar.volume;
-
-output.connect('changed', () => {
-    if (!output.value && !input.value) {
-        input.value = true;
-    }
-});
-
-input.connect('changed', () => {
-    if (!output.value && !input.value) {
-        output.value = true;
-    }
-});
diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 16cf816cb..1cda4041f 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -10,7 +10,7 @@ import Separator from 'types/widgets/separator';
 import Label from 'types/widgets/label';
 
 const Volume = (): BarBoxChild => {
-    const { label, input, output, hide_muted_label } = options.bar.volume;
+    const { label, input, input_label } = options.bar.volume;
     const button_style = options.theme.bar.buttons.style;
 
     const outputIcons: VolumeIcons = {
@@ -74,65 +74,43 @@ const Volume = (): BarBoxChild => {
                     audio.speaker.bind('is_muted'),
                     audio.microphone.bind('volume'),
                     audio.microphone.bind('is_muted'),
-                    button_style.bind('value'),
                     label.bind('value'),
-                    output.bind('value'),
                     input.bind('value'),
-                    hide_muted_label.bind('value'),
+                    input_label.bind('value'),
                 ],
                 (
                     outputVolume,
                     outputIsMuted,
                     inputVolume,
                     inputIsMuted,
-                    buttonStyle,
-                    showLabel,
-                    showOutput,
-                    showInput,
-                    hideMutedLabel,
+                    showOutputLabel,
+                    showInputIcon,
+                    showInputLabel,
                 ) => {
                     const children: (Label<Child> | Separator<Child>)[] = [];
-                    if (showOutput) {
-                        const isMuted = outputIsMuted !== false || Math.round(outputVolume * 100) === 0;
-                        const labelVisible = showLabel && !(hideMutedLabel && isMuted);
+                    const outputMuted = outputIsMuted !== false || Math.round(outputVolume * 100) === 0;
+                    const inputMuted = inputIsMuted !== false || Math.round(inputVolume * 100) === 0;
+                    const showLabel = showOutputLabel || showInputLabel;
+
+                    if (showInputIcon) {
                         children.push(
-                            volIcn(outputVolume, isMuted, outputIcons, `output ${!labelVisible ? 'no-label' : ''}`),
+                            volIcn(inputVolume, inputMuted, inputIcons, `input ${!showLabel ? 'no-label' : ''}`),
+                        );
+                    } else {
+                        children.push(
+                            volIcn(outputVolume, outputMuted, outputIcons, `output ${!showLabel ? 'no-label' : ''}`),
                         );
-                        if (labelVisible) {
-                            children.push(volPct(outputVolume, isMuted, `output ${!showInput ? 'no-separator' : ''}`));
-                        }
                     }
 
-                    if (showInput) {
-                        if (showOutput) {
-                            children.push(Widget.Separator({ vertical: true, class_name: 'bar-separator volume' }));
-                        }
-                        const isMuted = inputIsMuted !== false || Math.round(inputVolume * 100) === 0;
-                        const labelVisible = showLabel && !(hideMutedLabel && isMuted);
-                        const rightIcon = buttonStyle === 'split' && showOutput;
-
-                        if (!rightIcon) {
-                            children.push(
-                                volIcn(inputVolume, isMuted, inputIcons, `input ${!labelVisible ? 'no-label' : ''}`),
-                            );
-                        }
-
-                        if (labelVisible) {
-                            children.push(
-                                volPct(inputVolume, isMuted, `input ${rightIcon ? 'right-icon' : 'no-separator'}`),
-                            );
-                        }
+                    if (showOutputLabel) {
+                        children.push(volPct(outputVolume, outputMuted, `output`));
+                    }
 
-                        if (rightIcon) {
-                            children.push(
-                                volIcn(
-                                    inputVolume,
-                                    isMuted,
-                                    inputIcons,
-                                    `input right-icon ${!labelVisible ? 'no-label' : ''}`,
-                                ),
-                            );
+                    if (showInputLabel) {
+                        if (showOutputLabel) {
+                            children.push(Widget.Separator({ vertical: true, class_name: 'bar-separator volume' }));
                         }
+                        children.push(volPct(inputVolume, inputMuted, `input`));
                     }
                     return children;
                 },
diff --git a/options.ts b/options.ts
index c2b3b7fa6..28aee97df 100644
--- a/options.ts
+++ b/options.ts
@@ -833,9 +833,8 @@ const options = mkOptions(OPTIONS, {
         },
         volume: {
             label: opt(true),
-            output: opt(true),
             input: opt(false),
-            hide_muted_label: opt(false),
+            input_label: opt(false),
         },
         network: {
             truncation: opt(true),
diff --git a/scss/style/bar/audio.scss b/scss/style/bar/audio.scss
index fcbb15ab3..90a90027b 100644
--- a/scss/style/bar/audio.scss
+++ b/scss/style/bar/audio.scss
@@ -26,7 +26,6 @@
 .bar-separator.volume {
   color: if($bar-buttons-monochrome, $bar-buttons-text, $bar-buttons-volume-separator);
   margin-left: $bar-buttons-volume-spacing;
-  margin-right: $bar-buttons-volume-spacing;
 }
 
 .style2 {
@@ -37,25 +36,6 @@
     padding: $bar-buttons-padding_y 0em;
     padding-left: $bar-buttons-padding_x;
     padding-right: $bar-buttons-volume-spacing;
-
-    &.right-icon {
-      border-top-right-radius: $bar-buttons-radius;
-      border-bottom-right-radius: $bar-buttons-radius;
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
-      padding-left: $bar-buttons-volume-spacing;
-      padding-right: $bar-buttons-padding_x;
-
-      &.no-label {
-        border-top-left-radius: $bar-buttons-radius;
-        border-bottom-left-radius: $bar-buttons-radius;
-      }
-    }
-
-    &.no-label {
-      border-top-right-radius: $bar-buttons-radius;
-      border-bottom-right-radius: $bar-buttons-radius;
-    }
   }
 
   .bar-button-label.volume {
@@ -63,11 +43,6 @@
     padding-left: $bar-buttons-volume-spacing;
     margin-left: 0em;
 
-    &.right-icon {
-      padding-left: 0;
-      padding-right: $bar-buttons-volume-spacing;
-    }
-
     &.no-separator {
       padding-right: $bar-buttons-padding_x;
     }
diff --git a/widget/settings/pages/config/bar/index.ts b/widget/settings/pages/config/bar/index.ts
index 66e61c70c..93bfbacec 100644
--- a/widget/settings/pages/config/bar/index.ts
+++ b/widget/settings/pages/config/bar/index.ts
@@ -305,25 +305,20 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
                  ******************************
                  */
                 Header('Volume'),
-                Option({
-                    opt: options.bar.volume.output,
-                    title: 'Show Speaker',
-                    type: 'boolean',
-                }),
                 Option({
                     opt: options.bar.volume.input,
-                    title: 'Show Microphone',
+                    title: 'Show Microphone Icon',
+                    subtitle: 'Replaces the speaker icon with a microphone icon.',
                     type: 'boolean',
                 }),
                 Option({
                     opt: options.bar.volume.label,
-                    title: 'Show Volume Percentage',
+                    title: 'Show Speaker Volume Percentage',
                     type: 'boolean',
                 }),
                 Option({
-                    opt: options.bar.volume.hide_muted_label,
-                    title: 'Hide Percentage On Mute',
-                    subtitle: 'Only applicable if Show Volume Percentage is enabled',
+                    opt: options.bar.volume.input_label,
+                    title: 'Show Microphone Volume Percentage',
                     type: 'boolean',
                 }),
                 Option({

From 54e3bcdfd8fa429d1dccfb65d563911e88a5f475 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 23 Oct 2024 14:03:56 +0200
Subject: [PATCH 13/15] add theme changes

---
 themes/catppuccin_frappe.json          | 9 ++++++---
 themes/catppuccin_frappe_split.json    | 9 ++++++---
 themes/catppuccin_latte.json           | 9 ++++++---
 themes/catppuccin_latte_split.json     | 9 ++++++---
 themes/catppuccin_macchiato.json       | 9 ++++++---
 themes/catppuccin_macchiato_split.json | 9 ++++++---
 themes/catppuccin_mocha.json           | 7 +++++--
 themes/catppuccin_mocha_split.json     | 7 +++++--
 themes/cyberpunk.json                  | 9 ++++++---
 themes/cyberpunk_split.json            | 9 ++++++---
 themes/dracula.json                    | 9 ++++++---
 themes/dracula_split.json              | 9 ++++++---
 themes/everforest.json                 | 9 ++++++---
 themes/everforest_split.json           | 9 ++++++---
 themes/gruvbox.json                    | 9 ++++++---
 themes/gruvbox_split.json              | 9 ++++++---
 themes/monochrome.json                 | 9 ++++++---
 themes/monochrome_split.json           | 9 ++++++---
 themes/nord.json                       | 9 ++++++---
 themes/nord_split.json                 | 9 ++++++---
 themes/one_dark.json                   | 9 ++++++---
 themes/one_dark_split.json             | 9 ++++++---
 themes/rose_pine.json                  | 9 ++++++---
 themes/rose_pine_moon.json             | 9 ++++++---
 themes/rose_pine_moon_split.json       | 9 ++++++---
 themes/rose_pine_split.json            | 9 ++++++---
 themes/tokyo_night.json                | 9 ++++++---
 themes/tokyo_night_split.json          | 9 ++++++---
 28 files changed, 166 insertions(+), 82 deletions(-)

diff --git a/themes/catppuccin_frappe.json b/themes/catppuccin_frappe.json
index a59a4a04f..3d276bad9 100644
--- a/themes/catppuccin_frappe.json
+++ b/themes/catppuccin_frappe.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#ca9ee6",
   "theme.bar.buttons.network.text": "#ca9ee6",
   "theme.bar.buttons.network.background": "#303446",
-  "theme.bar.buttons.volume.icon": "#ea999c",
-  "theme.bar.buttons.volume.text": "#ea999c",
   "theme.bar.buttons.volume.background": "#303446",
   "theme.bar.buttons.windowtitle.icon": "#f4b8e4",
   "theme.bar.buttons.windowtitle.text": "#f4b8e4",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#81c8be",
   "theme.bar.buttons.modules.submap.border": "#81c8be",
   "theme.bar.buttons.modules.submap.icon": "#81c8be",
-  "theme.bar.buttons.modules.submap.icon_background": "#303446"
+  "theme.bar.buttons.modules.submap.icon_background": "#303446",
+  "theme.bar.buttons.volume.output_icon": "#ea999c",
+  "theme.bar.buttons.volume.output_text": "#ea999c",
+  "theme.bar.buttons.volume.input_icon": "#ea999c",
+  "theme.bar.buttons.volume.input_text": "#ea999c",
+  "theme.bar.buttons.volume.separator": "#51576d"
 }
\ No newline at end of file
diff --git a/themes/catppuccin_frappe_split.json b/themes/catppuccin_frappe_split.json
index 2eefc000d..b924a26f1 100644
--- a/themes/catppuccin_frappe_split.json
+++ b/themes/catppuccin_frappe_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#303446",
   "theme.bar.buttons.network.text": "#ca9ee6",
   "theme.bar.buttons.network.background": "#303446",
-  "theme.bar.buttons.volume.icon": "#303446",
-  "theme.bar.buttons.volume.text": "#ea999c",
   "theme.bar.buttons.volume.background": "#303446",
   "theme.bar.buttons.windowtitle.icon": "#303446",
   "theme.bar.buttons.windowtitle.text": "#f4b8e4",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#81c8be",
   "theme.bar.buttons.modules.submap.border": "#81c8be",
   "theme.bar.buttons.modules.submap.icon": "#181825",
-  "theme.bar.buttons.modules.submap.icon_background": "#81c8be"
+  "theme.bar.buttons.modules.submap.icon_background": "#81c8be",
+  "theme.bar.buttons.volume.output_icon": "#303446",
+  "theme.bar.buttons.volume.output_text": "#ea999c",
+  "theme.bar.buttons.volume.input_icon": "#303446",
+  "theme.bar.buttons.volume.input_text": "#ea999c",
+  "theme.bar.buttons.volume.separator": "#51576d"
 }
\ No newline at end of file
diff --git a/themes/catppuccin_latte.json b/themes/catppuccin_latte.json
index 64559e218..335ced66f 100644
--- a/themes/catppuccin_latte.json
+++ b/themes/catppuccin_latte.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#8839ef",
   "theme.bar.buttons.network.text": "#8839ef",
   "theme.bar.buttons.network.background": "#dcdfe8",
-  "theme.bar.buttons.volume.icon": "#e64553",
-  "theme.bar.buttons.volume.text": "#e64553",
   "theme.bar.buttons.volume.background": "#dcdfe8",
   "theme.bar.buttons.windowtitle.icon": "#ea76cb",
   "theme.bar.buttons.windowtitle.text": "#ea76cb",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#179299",
   "theme.bar.buttons.modules.submap.border": "#179299",
   "theme.bar.buttons.modules.submap.icon": "#179299",
-  "theme.bar.buttons.modules.submap.icon_background": "#dcdfe8"
+  "theme.bar.buttons.modules.submap.icon_background": "#dcdfe8",
+  "theme.bar.buttons.volume.output_icon": "#e64553",
+  "theme.bar.buttons.volume.output_text": "#e64553",
+  "theme.bar.buttons.volume.input_icon": "#e64553",
+  "theme.bar.buttons.volume.input_text": "#e64553",
+  "theme.bar.buttons.volume.separator": "#bcc0cc"
 }
\ No newline at end of file
diff --git a/themes/catppuccin_latte_split.json b/themes/catppuccin_latte_split.json
index 13aa39c33..05834e9d0 100644
--- a/themes/catppuccin_latte_split.json
+++ b/themes/catppuccin_latte_split.json
@@ -284,8 +284,6 @@
   "theme.bar.buttons.network.background": "#dcdfe8",
   "theme.bar.buttons.network.border": "#8839ef",
   "theme.bar.buttons.volume.icon_background": "#e64553",
-  "theme.bar.buttons.volume.icon": "#dcdee8",
-  "theme.bar.buttons.volume.text": "#e64553",
   "theme.bar.buttons.volume.background": "#dcdfe8",
   "theme.bar.buttons.volume.border": "#e64553",
   "theme.bar.buttons.media.icon_background": "#7287fd",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#179299",
   "theme.bar.buttons.modules.submap.border": "#179299",
   "theme.bar.buttons.modules.submap.icon": "#181825",
-  "theme.bar.buttons.modules.submap.icon_background": "#179299"
+  "theme.bar.buttons.modules.submap.icon_background": "#179299",
+  "theme.bar.buttons.volume.output_icon": "#dcdfe8",
+  "theme.bar.buttons.volume.output_text": "#e64553",
+  "theme.bar.buttons.volume.input_icon": "#dcdfe8",
+  "theme.bar.buttons.volume.input_text": "#e64553",
+  "theme.bar.buttons.volume.separator": "#bcc0cc"
 }
\ No newline at end of file
diff --git a/themes/catppuccin_macchiato.json b/themes/catppuccin_macchiato.json
index cf5ecc84d..8aa8f7fe0 100644
--- a/themes/catppuccin_macchiato.json
+++ b/themes/catppuccin_macchiato.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#c6a0f6",
   "theme.bar.buttons.network.text": "#c6a0f6",
   "theme.bar.buttons.network.background": "#24273a",
-  "theme.bar.buttons.volume.icon": "#ee99a0",
-  "theme.bar.buttons.volume.text": "#ee99a0",
   "theme.bar.buttons.volume.background": "#24273a",
   "theme.bar.buttons.windowtitle.icon": "#f5bde6",
   "theme.bar.buttons.windowtitle.text": "#f5bde6",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8bd5ca",
   "theme.bar.buttons.modules.submap.border": "#8bd5ca",
   "theme.bar.buttons.modules.submap.icon": "#8bd5ca",
-  "theme.bar.buttons.modules.submap.icon_background": "#24273a"
+  "theme.bar.buttons.modules.submap.icon_background": "#24273a",
+  "theme.bar.buttons.volume.output_icon": "#ee99a0",
+  "theme.bar.buttons.volume.output_text": "#ee99a0",
+  "theme.bar.buttons.volume.input_icon": "#ee99a0",
+  "theme.bar.buttons.volume.input_text": "#ee99a0",
+  "theme.bar.buttons.volume.separator": "#494d64"
 }
\ No newline at end of file
diff --git a/themes/catppuccin_macchiato_split.json b/themes/catppuccin_macchiato_split.json
index d5602a84a..0636d41b3 100644
--- a/themes/catppuccin_macchiato_split.json
+++ b/themes/catppuccin_macchiato_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#24273a",
   "theme.bar.buttons.network.text": "#c6a0f6",
   "theme.bar.buttons.network.background": "#24273a",
-  "theme.bar.buttons.volume.icon": "#24273a",
-  "theme.bar.buttons.volume.text": "#ee99a0",
   "theme.bar.buttons.volume.background": "#24273a",
   "theme.bar.buttons.windowtitle.icon": "#24273a",
   "theme.bar.buttons.windowtitle.text": "#f5bde6",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8bd5ca",
   "theme.bar.buttons.modules.submap.border": "#8bd5ca",
   "theme.bar.buttons.modules.submap.icon": "#181825",
-  "theme.bar.buttons.modules.submap.icon_background": "#8bd5ca"
+  "theme.bar.buttons.modules.submap.icon_background": "#8bd5ca",
+  "theme.bar.buttons.volume.output_icon": "#24273a",
+  "theme.bar.buttons.volume.output_text": "#ee99a0",
+  "theme.bar.buttons.volume.input_icon": "#24273a",
+  "theme.bar.buttons.volume.input_text": "#ee99a0",
+  "theme.bar.buttons.volume.separator": "#494d64"
 }
\ No newline at end of file
diff --git a/themes/catppuccin_mocha.json b/themes/catppuccin_mocha.json
index 32905017d..0177fc117 100644
--- a/themes/catppuccin_mocha.json
+++ b/themes/catppuccin_mocha.json
@@ -284,8 +284,11 @@
     "theme.bar.buttons.network.background": "#242438",
     "theme.bar.buttons.network.border": "#cba6f7",
     "theme.bar.buttons.volume.icon_background": "#eba0ac",
-    "theme.bar.buttons.volume.icon": "#eba0ac",
-    "theme.bar.buttons.volume.text": "#eba0ac",
+    "theme.bar.buttons.volume.output_icon": "#eba0ac",
+    "theme.bar.buttons.volume.output_text": "#eba0ac",
+    "theme.bar.buttons.volume.input_icon": "#eba0ac",
+    "theme.bar.buttons.volume.input_text": "#eba0ac",
+    "theme.bar.buttons.volume.separator": "#45475a",
     "theme.bar.buttons.volume.background": "#242438",
     "theme.bar.buttons.volume.border": "#eba0ac",
     "theme.bar.buttons.media.icon_background": "#b4befe",
diff --git a/themes/catppuccin_mocha_split.json b/themes/catppuccin_mocha_split.json
index 3211324ec..eeabb8e31 100644
--- a/themes/catppuccin_mocha_split.json
+++ b/themes/catppuccin_mocha_split.json
@@ -215,8 +215,11 @@
     "theme.bar.buttons.network.icon": "#242438",
     "theme.bar.buttons.network.text": "#cba6f7",
     "theme.bar.buttons.network.background": "#242438",
-    "theme.bar.buttons.volume.icon": "#242438",
-    "theme.bar.buttons.volume.text": "#eba0ac",
+    "theme.bar.buttons.volume.output_icon": "#242438",
+    "theme.bar.buttons.volume.output_text": "#eba0ac",
+    "theme.bar.buttons.volume.input_icon": "#242438",
+    "theme.bar.buttons.volume.input_text": "#eba0ac",
+    "theme.bar.buttons.volume.separator": "#45475a",
     "theme.bar.buttons.volume.background": "#242438",
     "theme.bar.buttons.windowtitle.icon": "#1e1e2e",
     "theme.bar.buttons.windowtitle.text": "#f5c2e7",
diff --git a/themes/cyberpunk.json b/themes/cyberpunk.json
index 50a6a0960..01273f249 100644
--- a/themes/cyberpunk.json
+++ b/themes/cyberpunk.json
@@ -270,8 +270,6 @@
   "theme.bar.buttons.network.text": "#e23fe2",
   "theme.bar.buttons.network.background": "#121212",
   "theme.bar.buttons.volume.icon_background": "#FF4500",
-  "theme.bar.buttons.volume.icon": "#ff3f3f",
-  "theme.bar.buttons.volume.text": "#ff3f3f",
   "theme.bar.buttons.volume.background": "#121212",
   "theme.bar.buttons.media.icon_background": "#FFD700",
   "theme.bar.buttons.media.icon": "#FFD700",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#FF69B4",
   "theme.bar.buttons.modules.submap.border": "#FF69B4",
   "theme.bar.buttons.modules.submap.icon": "#FF69B4",
-  "theme.bar.buttons.modules.submap.icon_background": "#121212"
+  "theme.bar.buttons.modules.submap.icon_background": "#121212",
+  "theme.bar.buttons.volume.output_icon": "#FF69B4",
+  "theme.bar.buttons.volume.output_text": "#FF69B4",
+  "theme.bar.buttons.volume.input_icon": "#FF69B4",
+  "theme.bar.buttons.volume.input_text": "#FF69B4",
+  "theme.bar.buttons.volume.separator": "#45475A"
 }
\ No newline at end of file
diff --git a/themes/cyberpunk_split.json b/themes/cyberpunk_split.json
index b7b183a8a..be73de0e4 100644
--- a/themes/cyberpunk_split.json
+++ b/themes/cyberpunk_split.json
@@ -270,8 +270,6 @@
   "theme.bar.buttons.network.text": "#e23fe2",
   "theme.bar.buttons.network.background": "#121212",
   "theme.bar.buttons.volume.icon_background": "#ff3f3f",
-  "theme.bar.buttons.volume.icon": "#121212",
-  "theme.bar.buttons.volume.text": "#ff3f3f",
   "theme.bar.buttons.volume.background": "#121212",
   "theme.bar.buttons.media.icon_background": "#00ffff",
   "theme.bar.buttons.media.icon": "#121212",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#FF69B4",
   "theme.bar.buttons.modules.submap.border": "#FF69B4",
   "theme.bar.buttons.modules.submap.icon": "#121212",
-  "theme.bar.buttons.modules.submap.icon_background": "#FF69B4"
+  "theme.bar.buttons.modules.submap.icon_background": "#FF69B4",
+  "theme.bar.buttons.volume.output_icon": "#121212",
+  "theme.bar.buttons.volume.output_text": "#FF69B4",
+  "theme.bar.buttons.volume.input_icon": "#121212",
+  "theme.bar.buttons.volume.input_text": "#FF69B4",
+  "theme.bar.buttons.volume.separator": "#45475A"
 }
\ No newline at end of file
diff --git a/themes/dracula.json b/themes/dracula.json
index 1bada5f89..6a4dfbb89 100644
--- a/themes/dracula.json
+++ b/themes/dracula.json
@@ -284,8 +284,6 @@
   "theme.bar.buttons.network.background": "#44475a",
   "theme.bar.buttons.network.border": "#bd93f9",
   "theme.bar.buttons.volume.icon_background": "#ffb86c",
-  "theme.bar.buttons.volume.icon": "#ffb86c",
-  "theme.bar.buttons.volume.text": "#ffb86c",
   "theme.bar.buttons.volume.background": "#44475a",
   "theme.bar.buttons.volume.border": "#ffb86c",
   "theme.bar.buttons.media.icon_background": "#bd93f9",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8be9fd",
   "theme.bar.buttons.modules.submap.border": "#8be9fd",
   "theme.bar.buttons.modules.submap.icon": "#8be9fd",
-  "theme.bar.buttons.modules.submap.icon_background": "#44475a"
+  "theme.bar.buttons.modules.submap.icon_background": "#44475a",
+  "theme.bar.buttons.volume.output_icon": "#ffb86c",
+  "theme.bar.buttons.volume.output_text": "#ffb86c",
+  "theme.bar.buttons.volume.input_icon": "#ffb86c",
+  "theme.bar.buttons.volume.input_text": "#ffb86c",
+  "theme.bar.buttons.volume.separator": "#6272a4"
 }
\ No newline at end of file
diff --git a/themes/dracula_split.json b/themes/dracula_split.json
index 5c5263cf7..63ef98224 100644
--- a/themes/dracula_split.json
+++ b/themes/dracula_split.json
@@ -284,8 +284,6 @@
   "theme.bar.buttons.network.background": "#44475a",
   "theme.bar.buttons.network.border": "#bd93f9",
   "theme.bar.buttons.volume.icon_background": "#ffb86c",
-  "theme.bar.buttons.volume.icon": "#44475a",
-  "theme.bar.buttons.volume.text": "#ffb86c",
   "theme.bar.buttons.volume.background": "#44475a",
   "theme.bar.buttons.volume.border": "#ffb86c",
   "theme.bar.buttons.media.icon_background": "#bd93f9",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8be9fd",
   "theme.bar.buttons.modules.submap.border": "#8be9fd",
   "theme.bar.buttons.modules.submap.icon": "#282936",
-  "theme.bar.buttons.modules.submap.icon_background": "#8be9fd"
+  "theme.bar.buttons.modules.submap.icon_background": "#8be9fd",
+  "theme.bar.buttons.volume.output_icon": "#44475a",
+  "theme.bar.buttons.volume.output_text": "#ffb86c",
+  "theme.bar.buttons.volume.input_icon": "#44475a",
+  "theme.bar.buttons.volume.input_text": "#ffb86c",
+  "theme.bar.buttons.volume.separator": "#6272a4"
 }
\ No newline at end of file
diff --git a/themes/everforest.json b/themes/everforest.json
index 4789eb46f..e56f3ad2d 100644
--- a/themes/everforest.json
+++ b/themes/everforest.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#e69875",
   "theme.bar.buttons.network.text": "#e69875",
   "theme.bar.buttons.network.background": "#323d43",
-  "theme.bar.buttons.volume.icon": "#dbbc7f",
-  "theme.bar.buttons.volume.text": "#dbbc7f",
   "theme.bar.buttons.volume.background": "#323d43",
   "theme.bar.buttons.windowtitle.icon": "#dbbc7f",
   "theme.bar.buttons.windowtitle.text": "#dbbc7f",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#83c092",
   "theme.bar.buttons.modules.submap.border": "#83c092",
   "theme.bar.buttons.modules.submap.icon": "#83c092",
-  "theme.bar.buttons.modules.submap.icon_background": "#323d43"
+  "theme.bar.buttons.modules.submap.icon_background": "#323d43",
+  "theme.bar.buttons.volume.output_icon": "#e67e80",
+  "theme.bar.buttons.volume.output_text": "#e67e80",
+  "theme.bar.buttons.volume.input_icon": "#e67e80",
+  "theme.bar.buttons.volume.input_text": "#e67e80",
+  "theme.bar.buttons.volume.separator": "#454b53"
 }
\ No newline at end of file
diff --git a/themes/everforest_split.json b/themes/everforest_split.json
index 9f362f43b..24afdf565 100644
--- a/themes/everforest_split.json
+++ b/themes/everforest_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#323d43",
   "theme.bar.buttons.network.text": "#e69875",
   "theme.bar.buttons.network.background": "#323d43",
-  "theme.bar.buttons.volume.icon": "#323d43",
-  "theme.bar.buttons.volume.text": "#dbbc7f",
   "theme.bar.buttons.volume.background": "#323d43",
   "theme.bar.buttons.windowtitle.icon": "#323d43",
   "theme.bar.buttons.windowtitle.text": "#dbbc7f",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#83c092",
   "theme.bar.buttons.modules.submap.border": "#83c092",
   "theme.bar.buttons.modules.submap.icon": "#21252b",
-  "theme.bar.buttons.modules.submap.icon_background": "#83c092"
+  "theme.bar.buttons.modules.submap.icon_background": "#83c092",
+  "theme.bar.buttons.volume.output_icon": "#323d43",
+  "theme.bar.buttons.volume.output_text": "#dbbc7f",
+  "theme.bar.buttons.volume.input_icon": "#323d43",
+  "theme.bar.buttons.volume.input_text": "#dbbc7f",
+  "theme.bar.buttons.volume.separator": "#454b53"
 }
\ No newline at end of file
diff --git a/themes/gruvbox.json b/themes/gruvbox.json
index b6b4a9de5..d8a18d817 100644
--- a/themes/gruvbox.json
+++ b/themes/gruvbox.json
@@ -270,8 +270,6 @@
   "theme.bar.buttons.network.text": "#b16286",
   "theme.bar.buttons.network.background": "#282828",
   "theme.bar.buttons.volume.icon_background": "#fe8018",
-  "theme.bar.buttons.volume.icon": "#fe8018",
-  "theme.bar.buttons.volume.text": "#fe8018",
   "theme.bar.buttons.volume.background": "#282828",
   "theme.bar.buttons.media.icon_background": "#83a598",
   "theme.bar.buttons.media.icon": "#83a598",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8ec07c",
   "theme.bar.buttons.modules.submap.border": "#8ec07c",
   "theme.bar.buttons.modules.submap.icon": "#8ec07c",
-  "theme.bar.buttons.modules.submap.icon_background": "#282828"
+  "theme.bar.buttons.modules.submap.icon_background": "#282828",
+  "theme.bar.buttons.volume.output_icon": "#fe8018",
+  "theme.bar.buttons.volume.output_text": "#fe8018",
+  "theme.bar.buttons.volume.input_icon": "#fe8018",
+  "theme.bar.buttons.volume.input_text": "#fe8018",
+  "theme.bar.buttons.volume.separator": "#504945"
 }
\ No newline at end of file
diff --git a/themes/gruvbox_split.json b/themes/gruvbox_split.json
index e41ab29dd..476135fc8 100644
--- a/themes/gruvbox_split.json
+++ b/themes/gruvbox_split.json
@@ -270,8 +270,6 @@
   "theme.bar.buttons.network.text": "#b16286",
   "theme.bar.buttons.network.background": "#282828",
   "theme.bar.buttons.volume.icon_background": "#fe8018",
-  "theme.bar.buttons.volume.icon": "#282828",
-  "theme.bar.buttons.volume.text": "#fe8018",
   "theme.bar.buttons.volume.background": "#282828",
   "theme.bar.buttons.media.icon_background": "#83a598",
   "theme.bar.buttons.media.icon": "#282828",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8ec07c",
   "theme.bar.buttons.modules.submap.border": "#8ec07c",
   "theme.bar.buttons.modules.submap.icon": "#21252b",
-  "theme.bar.buttons.modules.submap.icon_background": "#8ec07c"
+  "theme.bar.buttons.modules.submap.icon_background": "#8ec07c",
+  "theme.bar.buttons.volume.output_icon": "#282828",
+  "theme.bar.buttons.volume.output_text": "#fe8018",
+  "theme.bar.buttons.volume.input_icon": "#282828",
+  "theme.bar.buttons.volume.input_text": "#fe8018",
+  "theme.bar.buttons.volume.separator": "#504945"
 }
\ No newline at end of file
diff --git a/themes/monochrome.json b/themes/monochrome.json
index 86cb70beb..2990879c2 100644
--- a/themes/monochrome.json
+++ b/themes/monochrome.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#FFFFFF",
   "theme.bar.buttons.network.text": "#FFFFFF",
   "theme.bar.buttons.network.background": "#090909",
-  "theme.bar.buttons.volume.icon": "#FFFFFF",
-  "theme.bar.buttons.volume.text": "#FFFFFF",
   "theme.bar.buttons.volume.background": "#090909",
   "theme.bar.buttons.windowtitle.icon": "#FFFFFF",
   "theme.bar.buttons.windowtitle.text": "#FFFFFF",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#FFFFFF",
   "theme.bar.buttons.modules.submap.border": "#FFFFFF",
   "theme.bar.buttons.modules.submap.icon": "#FFFFFF",
-  "theme.bar.buttons.modules.submap.icon_background": "#090909"
+  "theme.bar.buttons.modules.submap.icon_background": "#090909",
+  "theme.bar.buttons.volume.output_icon": "#FFFFFF",
+  "theme.bar.buttons.volume.output_text": "#FFFFFF",
+  "theme.bar.buttons.volume.input_icon": "#FFFFFF",
+  "theme.bar.buttons.volume.input_text": "#FFFFFF",
+  "theme.bar.buttons.volume.separator": "#444444"
 }
\ No newline at end of file
diff --git a/themes/monochrome_split.json b/themes/monochrome_split.json
index 111c15508..1f4c3987e 100644
--- a/themes/monochrome_split.json
+++ b/themes/monochrome_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#090909",
   "theme.bar.buttons.network.text": "#FFFFFF",
   "theme.bar.buttons.network.background": "#090909",
-  "theme.bar.buttons.volume.icon": "#090909",
-  "theme.bar.buttons.volume.text": "#FFFFFF",
   "theme.bar.buttons.volume.background": "#090909",
   "theme.bar.buttons.windowtitle.icon": "#090909",
   "theme.bar.buttons.windowtitle.text": "#FFFFFF",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#FFFFFF",
   "theme.bar.buttons.modules.submap.border": "#FFFFFF",
   "theme.bar.buttons.modules.submap.icon": "#21252b",
-  "theme.bar.buttons.modules.submap.icon_background": "#FFFFFF"
+  "theme.bar.buttons.modules.submap.icon_background": "#FFFFFF",
+  "theme.bar.buttons.volume.output_icon": "#090909",
+  "theme.bar.buttons.volume.output_text": "#FFFFFF",
+  "theme.bar.buttons.volume.input_icon": "#090909",
+  "theme.bar.buttons.volume.input_text": "#FFFFFF",
+  "theme.bar.buttons.volume.separator": "#444444"
 }
\ No newline at end of file
diff --git a/themes/nord.json b/themes/nord.json
index 3f9159bdc..f2f2feb43 100644
--- a/themes/nord.json
+++ b/themes/nord.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#88c0d0",
   "theme.bar.buttons.network.text": "#88c0d0",
   "theme.bar.buttons.network.background": "#3b4252",
-  "theme.bar.buttons.volume.icon": "#81a1c1",
-  "theme.bar.buttons.volume.text": "#81a1c1",
   "theme.bar.buttons.volume.background": "#3b4252",
   "theme.bar.buttons.windowtitle.icon": "#8fbcbb",
   "theme.bar.buttons.windowtitle.text": "#8fbcbb",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8fbcbb",
   "theme.bar.buttons.modules.submap.border": "#8fbcbb",
   "theme.bar.buttons.modules.submap.icon": "#8fbcbb",
-  "theme.bar.buttons.modules.submap.icon_background": "#3b4252"
+  "theme.bar.buttons.modules.submap.icon_background": "#3b4252",
+  "theme.bar.buttons.volume.output_icon": "#81a1c1",
+  "theme.bar.buttons.volume.output_text": "#81a1c1",
+  "theme.bar.buttons.volume.input_icon": "#81a1c1",
+  "theme.bar.buttons.volume.input_text": "#81a1c1",
+  "theme.bar.buttons.volume.separator": "#434c53"
 }
\ No newline at end of file
diff --git a/themes/nord_split.json b/themes/nord_split.json
index 9541e84c2..e53d9e30e 100644
--- a/themes/nord_split.json
+++ b/themes/nord_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#3b4252",
   "theme.bar.buttons.network.text": "#88c0d0",
   "theme.bar.buttons.network.background": "#3b4252",
-  "theme.bar.buttons.volume.icon": "#3b4252",
-  "theme.bar.buttons.volume.text": "#81a1c1",
   "theme.bar.buttons.volume.background": "#3b4252",
   "theme.bar.buttons.windowtitle.icon": "#3b4252",
   "theme.bar.buttons.windowtitle.text": "#8fbcbb",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#8fbcbb",
   "theme.bar.buttons.modules.submap.border": "#8fbcbb",
   "theme.bar.buttons.modules.submap.icon": "#21252b",
-  "theme.bar.buttons.modules.submap.icon_background": "#8fbcbb"
+  "theme.bar.buttons.modules.submap.icon_background": "#8fbcbb",
+  "theme.bar.buttons.volume.output_icon": "#3b4252",
+  "theme.bar.buttons.volume.output_text": "#81a1c1",
+  "theme.bar.buttons.volume.input_icon": "#3b4252",
+  "theme.bar.buttons.volume.input_text": "#81a1c1",
+  "theme.bar.buttons.volume.separator": "#434c53"
 }
\ No newline at end of file
diff --git a/themes/one_dark.json b/themes/one_dark.json
index 8c58b2a79..dfc9206e4 100644
--- a/themes/one_dark.json
+++ b/themes/one_dark.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#c678dd",
   "theme.bar.buttons.network.text": "#c678dd",
   "theme.bar.buttons.network.background": "#21252b",
-  "theme.bar.buttons.volume.icon": "#e06c75",
-  "theme.bar.buttons.volume.text": "#e06c75",
   "theme.bar.buttons.volume.background": "#21252b",
   "theme.bar.buttons.windowtitle.icon": "#98c379",
   "theme.bar.buttons.windowtitle.text": "#98c379",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#56b6c2",
   "theme.bar.buttons.modules.submap.border": "#56b6c2",
   "theme.bar.buttons.modules.submap.icon": "#56b6c2",
-  "theme.bar.buttons.modules.submap.icon_background": "#21252b"
+  "theme.bar.buttons.modules.submap.icon_background": "#21252b",
+  "theme.bar.buttons.volume.output_icon": "#e06c75",
+  "theme.bar.buttons.volume.output_text": "#e06c75",
+  "theme.bar.buttons.volume.input_icon": "#e06c75",
+  "theme.bar.buttons.volume.input_text": "#e06c75",
+  "theme.bar.buttons.volume.separator": "#4b5263"
 }
\ No newline at end of file
diff --git a/themes/one_dark_split.json b/themes/one_dark_split.json
index 7222e0592..e585dfa03 100644
--- a/themes/one_dark_split.json
+++ b/themes/one_dark_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#21252b",
   "theme.bar.buttons.network.text": "#c678dd",
   "theme.bar.buttons.network.background": "#21252b",
-  "theme.bar.buttons.volume.icon": "#21252b",
-  "theme.bar.buttons.volume.text": "#e06c75",
   "theme.bar.buttons.volume.background": "#21252b",
   "theme.bar.buttons.windowtitle.icon": "#21252b",
   "theme.bar.buttons.windowtitle.text": "#98c379",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#56b6c2",
   "theme.bar.buttons.modules.submap.border": "#56b6c2",
   "theme.bar.buttons.modules.submap.icon": "#21252b",
-  "theme.bar.buttons.modules.submap.icon_background": "#56b6c2"
+  "theme.bar.buttons.modules.submap.icon_background": "#56b6c2",
+  "theme.bar.buttons.volume.output_icon": "#21252b",
+  "theme.bar.buttons.volume.output_text": "#e06c75",
+  "theme.bar.buttons.volume.input_icon": "#21252b",
+  "theme.bar.buttons.volume.input_text": "#e06c75",
+  "theme.bar.buttons.volume.separator": "#4b5263"
 }
\ No newline at end of file
diff --git a/themes/rose_pine.json b/themes/rose_pine.json
index 9ccd0a0f7..ef5cbdb74 100644
--- a/themes/rose_pine.json
+++ b/themes/rose_pine.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#c4a7e7",
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.background": "#21202e",
-  "theme.bar.buttons.volume.icon": "#eb6f92",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.background": "#21202e",
   "theme.bar.buttons.windowtitle.icon": "#c4a7e7",
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#9ccfd8",
   "theme.bar.buttons.modules.submap.border": "#9ccfd8",
   "theme.bar.buttons.modules.submap.icon": "#9ccfd8",
-  "theme.bar.buttons.modules.submap.icon_background": "#21202e"
+  "theme.bar.buttons.modules.submap.icon_background": "#21202e",
+  "theme.bar.buttons.volume.output_icon": "#eb6f92",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#eb6f92",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.separator": "#26233a"
 }
\ No newline at end of file
diff --git a/themes/rose_pine_moon.json b/themes/rose_pine_moon.json
index 1c0a5caf4..32a4aa517 100644
--- a/themes/rose_pine_moon.json
+++ b/themes/rose_pine_moon.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#c4a7e7",
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.background": "#2a283e",
-  "theme.bar.buttons.volume.icon": "#eb6f92",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.background": "#2a283e",
   "theme.bar.buttons.windowtitle.icon": "#c4a7e7",
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#9ccfd8",
   "theme.bar.buttons.modules.submap.border": "#9ccfd8",
   "theme.bar.buttons.modules.submap.icon": "#9ccfd8",
-  "theme.bar.buttons.modules.submap.icon_background": "#2a283e"
+  "theme.bar.buttons.modules.submap.icon_background": "#2a283e",
+  "theme.bar.buttons.volume.output_icon": "#eb6f92",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#eb6f92",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.separator": "#393552"
 }
\ No newline at end of file
diff --git a/themes/rose_pine_moon_split.json b/themes/rose_pine_moon_split.json
index bbf84e812..1ef0525b5 100644
--- a/themes/rose_pine_moon_split.json
+++ b/themes/rose_pine_moon_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#2a283e",
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.background": "#2a283e",
-  "theme.bar.buttons.volume.icon": "#2a283e",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.background": "#2a283e",
   "theme.bar.buttons.windowtitle.icon": "#2a283e",
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#9ccfd8",
   "theme.bar.buttons.modules.submap.border": "#9ccfd8",
   "theme.bar.buttons.modules.submap.icon": "#181825",
-  "theme.bar.buttons.modules.submap.icon_background": "#9ccfd8"
+  "theme.bar.buttons.modules.submap.icon_background": "#9ccfd8",
+  "theme.bar.buttons.volume.output_icon": "#2a283e",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#2a283e",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.separator": "#393552"
 }
\ No newline at end of file
diff --git a/themes/rose_pine_split.json b/themes/rose_pine_split.json
index 404693c5b..05b77deaa 100644
--- a/themes/rose_pine_split.json
+++ b/themes/rose_pine_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#21202e",
   "theme.bar.buttons.network.text": "#c4a7e7",
   "theme.bar.buttons.network.background": "#21202e",
-  "theme.bar.buttons.volume.icon": "#21202e",
-  "theme.bar.buttons.volume.text": "#eb6f92",
   "theme.bar.buttons.volume.background": "#21202e",
   "theme.bar.buttons.windowtitle.icon": "#21202e",
   "theme.bar.buttons.windowtitle.text": "#c4a7e7",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#9ccfd8",
   "theme.bar.buttons.modules.submap.border": "#9ccfd8",
   "theme.bar.buttons.modules.submap.icon": "#181825",
-  "theme.bar.buttons.modules.submap.icon_background": "#9ccfd8"
+  "theme.bar.buttons.modules.submap.icon_background": "#9ccfd8",
+  "theme.bar.buttons.volume.output_icon": "#21202e",
+  "theme.bar.buttons.volume.output_text": "#eb6f92",
+  "theme.bar.buttons.volume.input_icon": "#21202e",
+  "theme.bar.buttons.volume.input_text": "#eb6f92",
+  "theme.bar.buttons.volume.separator": "#26233a"
 }
\ No newline at end of file
diff --git a/themes/tokyo_night.json b/themes/tokyo_night.json
index 01e63c869..43dd06c76 100644
--- a/themes/tokyo_night.json
+++ b/themes/tokyo_night.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#bb9af7",
   "theme.bar.buttons.network.text": "#bb9af7",
   "theme.bar.buttons.network.background": "#272a3d",
-  "theme.bar.buttons.volume.icon": "#f7768e",
-  "theme.bar.buttons.volume.text": "#f7768e",
   "theme.bar.buttons.volume.background": "#272a3d",
   "theme.bar.buttons.windowtitle.icon": "#f7768e",
   "theme.bar.buttons.windowtitle.text": "#f7768e",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#73daca",
   "theme.bar.buttons.modules.submap.border": "#73daca",
   "theme.bar.buttons.modules.submap.icon": "#73daca",
-  "theme.bar.buttons.modules.submap.icon_background": "#272a3d"
+  "theme.bar.buttons.modules.submap.icon_background": "#272a3d",
+  "theme.bar.buttons.volume.output_icon": "#f7768e",
+  "theme.bar.buttons.volume.output_text": "#f7768e",
+  "theme.bar.buttons.volume.input_icon": "#f7768e",
+  "theme.bar.buttons.volume.input_text": "#f7768e",
+  "theme.bar.buttons.volume.separator": "#414868"
 }
\ No newline at end of file
diff --git a/themes/tokyo_night_split.json b/themes/tokyo_night_split.json
index c4c51ca38..029383f11 100644
--- a/themes/tokyo_night_split.json
+++ b/themes/tokyo_night_split.json
@@ -215,8 +215,6 @@
   "theme.bar.buttons.network.icon": "#272a3d",
   "theme.bar.buttons.network.text": "#bb9af7",
   "theme.bar.buttons.network.background": "#272a3d",
-  "theme.bar.buttons.volume.icon": "#272a3d",
-  "theme.bar.buttons.volume.text": "#f7768e",
   "theme.bar.buttons.volume.background": "#272a3d",
   "theme.bar.buttons.windowtitle.icon": "#272a3d",
   "theme.bar.buttons.windowtitle.text": "#f7768e",
@@ -337,5 +335,10 @@
   "theme.bar.buttons.modules.submap.text": "#73daca",
   "theme.bar.buttons.modules.submap.border": "#73daca",
   "theme.bar.buttons.modules.submap.icon": "#181825",
-  "theme.bar.buttons.modules.submap.icon_background": "#73daca"
+  "theme.bar.buttons.modules.submap.icon_background": "#73daca",
+  "theme.bar.buttons.volume.output_icon": "#272a3d",
+  "theme.bar.buttons.volume.output_text": "#f7768e",
+  "theme.bar.buttons.volume.input_icon": "#272a3d",
+  "theme.bar.buttons.volume.input_text": "#f7768e",
+  "theme.bar.buttons.volume.separator": "#414868"
 }
\ No newline at end of file

From 3cc0e57298b69409ef8e479ebb269f712d70b813 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 23 Oct 2024 14:23:38 +0200
Subject: [PATCH 14/15] lint volume bar index

---
 modules/bar/volume/index.ts | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 2789da28d..25b7ffaf5 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -61,14 +61,15 @@ const Volume = (): BarBoxChild => {
             className: Utils.merge(
                 [options.theme.bar.buttons.style.bind('value'), label.bind('value')],
                 (style, showLabel) => {
-                const styleMap = {
-                    default: 'style1',
-                    split: 'style2',
-                    wave: 'style3',
-                    wave2: 'style3',
-                };
-                return `volume-container ${styleMap[style]} ${!showLabel ? 'no-label' : ''}`;
-            }),
+                    const styleMap = {
+                        default: 'style1',
+                        split: 'style2',
+                        wave: 'style3',
+                        wave2: 'style3',
+                    };
+                    return `volume-container ${styleMap[style]} ${!showLabel ? 'no-label' : ''}`;
+                },
+            ),
             children: Utils.merge(
                 [
                     audio.speaker.bind('volume'),

From 6e1a589d9673e38e922bb30f34dc22ec055e8671 Mon Sep 17 00:00:00 2001
From: painerp <8081128+painerp@users.noreply.github.com>
Date: Wed, 23 Oct 2024 14:27:32 +0200
Subject: [PATCH 15/15] add missing rightClick option to volume bar index

---
 modules/bar/volume/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/bar/volume/index.ts b/modules/bar/volume/index.ts
index 25b7ffaf5..1ba2b52d7 100644
--- a/modules/bar/volume/index.ts
+++ b/modules/bar/volume/index.ts
@@ -10,7 +10,7 @@ import { runAsyncCommand, throttledScrollHandler } from 'customModules/utils.js'
 import Separator from 'types/widgets/separator';
 import Label from 'types/widgets/label';
 
-const { label, input, input_label, middleClick, scrollUp, scrollDown } = options.bar.volume;
+const { label, input, input_label, rightClick, middleClick, scrollUp, scrollDown } = options.bar.volume;
 
 const Volume = (): BarBoxChild => {
     const outputIcons: VolumeIcons = {