eww widgets and theme cycle with waybar button

eww/eww.scss

@@ -0,0 +1,48 @@
+* { all: unset; }
+
+.volume-overlay {
+  background: rgba(15, 15, 20, 0.92);
+  border: 1px solid rgba(255,255,255,0.08);
+  border-radius: 12px;
+  padding: 16px;
+  backdrop-filter: blur(20px);
+  color: #e0e0e0;
+  font-family: "JetBrains Mono", monospace;
+}
+
+.header {
+  margin-bottom: 4px;
+  .header-icon { font-size: 18px; color: #33ccff; }
+  .header-title { font-size: 14px; font-weight: bold; color: #fff; }
+}
+
+.divider {
+  background: rgba(255,255,255,0.07);
+  min-height: 1px;
+  margin: 4px 0;
+}
+
+.sink-row {
+  padding: 4px 0;
+  .app-name { font-size: 12px; color: #aaa; min-width: 120px; }
+  .app-vol  { font-size: 12px; color: #33ccff; margin-left: auto; }
+  .app-icon { font-size: 14px; color: #666; }
+}
+
+.vol-slider {
+  min-height: 20px;
+  trough { background: rgba(255,255,255,0.1); border-radius: 4px; min-height: 4px; }
+  highlight { background: linear-gradient(90deg, #33ccff, #00ff99); border-radius: 4px; }
+  slider { background: #fff; border-radius: 50%; min-width: 12px; min-height: 12px; }
+}
+
+.mute-btn {
+  margin-top: 8px;
+  background: rgba(255,255,255,0.06);
+  border-radius: 8px;
+  padding: 8px;
+  font-size: 13px;
+  color: #aaa;
+  &:hover { background: rgba(255,255,255,0.12); }
+  &.muted { color: #ff5555; background: rgba(255,85,85,0.1); }
+}

eww/eww.yuck

@@ -0,0 +1,49 @@
+(defpoll volume :interval "1s"
+  "wpctl get-volume @DEFAULT_AUDIO_SINK@ | awk '{printf \"%d\", $2*100}'")
+
+(defpoll muted :interval "1s"
+  "wpctl get-volume @DEFAULT_AUDIO_SINK@ | grep -c MUTED || echo 0")
+
+(defpoll sink-inputs :interval "2s"
+  "~/.config/eww/scripts/get-sinks.sh")
+
+(defwidget volume-overlay []
+  (box :class "volume-overlay" :orientation "v" :spacing 12 :space-evenly false
+    (box :class "header" :orientation "h" :space-evenly false :spacing 8
+      (label :class "header-icon" :text "󰕾")
+      (label :class "header-title" :text "Volume Mixer"))
+
+    (box :class "sink-row" :orientation "v" :spacing 4
+      (box :orientation "h" :space-evenly false :spacing 8
+        (label :class "app-icon" :text "󰓃")
+        (label :class "app-name" :text "Master")
+        (label :class "app-vol" :text "${volume}%"))
+      (scale :class "vol-slider master-slider"
+             :min 0 :max 100 :value volume
+             :onchange "wpctl set-volume @DEFAULT_AUDIO_SINK@ {}%"))
+
+    (box :class "divider")
+
+    (for sink in sink-inputs
+      (box :class "sink-row" :orientation "v" :spacing 4
+        (box :orientation "h" :space-evenly false :spacing 8
+          (label :class "app-icon" :text "󰓃")
+          (label :class "app-name" :text {sink.name})
+          (label :class "app-vol" :text "${sink.volume}%"))
+        (scale :class "vol-slider"
+               :min 0 :max 100 :value {sink.volume}
+               :onchange "wpctl set-volume ${sink.id} {}%")))
+
+    (button :class "mute-btn ${muted == "1" ? "muted" : ""}"
+            :onclick "wpctl set-mute @DEFAULT_AUDIO_SINK@ toggle"
+      (label :text "${muted == "1" ? "󰝟  Muted" : "󰕾  Mute"}"))))
+
+(defwindow volume-mixer
+  :monitor 0
+  :geometry (geometry :x "0px" :y "40px"
+                      :width "280px"
+                      :anchor "top right")
+  :stacking "overlay"
+  :exclusive false
+  (volume-overlay))
+

eww/scripts/get-sinks.sh

@@ -0,0 +1,11 @@
+#!/bin/bash
+# Get all sink inputs as JSON array for eww
+pactl list sink-inputs | awk '
+/^Sink Input/ { id=substr($3,2,length($3)-1) }
+/application.name/ { gsub(/"/,"",$3); name=$3 }
+/Volume:.*%/ {
+  match($0, /[0-9]+%/)
+  vol=substr($0,RSTART,RLENGTH-1)
+  printf "{\"id\":\"%s\",\"name\":\"%s\",\"volume\":\"%s\"}\n", id, name, vol
+  name=""; vol=""
+}' | jq -s '.'

eww/scripts/toggle-mixer.sh

@@ -0,0 +1,6 @@
+#!/bin/bash
+if eww active-windows | grep -q "volume-mixer"; then
+  eww close volume-mixer
+else
+  eww open volume-mixer
+fi