nixos-configs/eww/actions/actions.yuck

(defwidget sysblock [icon onclick active label]
  (box :class "block-container"
       :orientation "v"
       :space-evenly false
       :spacing 5
    (button :class "block ${active ? 'active' : ''}" :onclick "${onclick}"
      (box :orientation "h"
           :space-evenly false
        (box :class "iconbox"
             :halign "start"
             :space-evenly true
             :orientation "h"
          (label :text "${icon}" :class "icon")
        )
        (box :class "sepbox"
             :halign "center"
             :space-evenly true
             :orientation "h"
          (box :class "sep")
        )
        (box :class "chevronbox"
             :halign "end"
             :space-evenly true
             :orientation "h"
          (label :text "")
        )
      )
    )
    (label :halign "center" :text "${label}" :class "label")
  )
)

(defwidget sysbuttons []
  (box :class "sysbuttonsbox"
       :orientation "v"
       :space-evenly false
       :spacing 20
    (box :class "firstrow"
         :orientation "h"
         :space-evenly true
      (box :halign "start"
           :orientation "h"
           :space-evenly true
        (sysblock :icon "${network_icon}"
                  :onclick "~/.config/eww/scripts/network.sh toggle"
                  :active "${network_status == 'Connected' ? true : false}"
                  :label "${network_ssid}")
      )
      (box :halign "center"
           :orientation "h"
           :space-evenly true
        (sysblock :icon "${bluetooth_state == 'on' ? '' : ''}"
                  :onclick "~/.config/eww/scripts/bluetooth toggle"
                  :active "${bluetooth_state == 'on' ? true : false}"
                  :label "Bluetooth")
      )
      (box :halign "end"
           :orientation "h"
           :space-evenly true
        (sysblock :icon "${network_radio == 'on' ? '' : ''}"
                  :onclick "~/.config/eww/scripts/network.sh toggle-radio"
                  :active "${network_radio == 'on' ? false : true}"
                  :label "Airplane")
      )
    )
    (box :class "lastrow"
         :orientation "h"
         :space-evenly true
      (box :halign "start"
           :orientation "h"
           :space-evenly true
        (sysblock :icon "${redshift_state == 'on' ? '' : ''}"
                  :onclick "~/.config/eww/scripts/redshift toggle"
                  :active "${redshift_state == 'on' ? true : false}"
                  :label "Night Light")
      )
      (box :halign "center"
           :orientation "h"
           :space-evenly true
        (sysblock :icon "${volume_icon}"
                  :onclick "~/.config/eww/scripts/volume.sh toggle-muted"
                  :active "${is_muted == 'yes' ? false : true}"
                  :label "Volume")
      )
      (box :halign "end"
           :orientation "h"
           :space-evenly true
        (sysblock :icon "${mic_status == 'yes' ? '' : ''}"
                  :onclick "~/.config/eww/scripts/mic toggle"
                  :active "${mic_status == 'yes' ? true : false}"
                  :label "Micro")
      )
    )
  )
)

(defwidget controls []
  (box :class "controlsbox"
       :orientation "v"
       :space-evenly false
       :spacing 10
    (box :orientation "h"
         :space-evenly "false"
         :class "vol-slider"
      (box :class "vol-label"
            volume_icon
      )
      (scale :value volume_value
             :onchange "~/.config/eww/scripts/volume.sh set {}"
             :min 0
             :max 101)
    )
    (box :orientation "h"
         :space-evenly "false"
         :class "br-slider"
      (box :class "br-label"
            br_icon
      )
      (scale :value br
             :onchange "~/.config/eww/scripts/brightness.sh set {}"
             :min 0
             :max 101)
    )
  )
)

(defwidget user []
  (box :class "userinfobox"
       :orientation "h"
       :space-evenly false
    (box :class "info"
         :space-evenly false
         :orientation "h"
         :halign "start"
         :valign "center"
         :spacing 10
      (label :text "${lithour}:${litmin}" :class "time")
      (box :class "daybox"
           :orientation "v"
           :space-evenly false
        (label :text "${shortday}" :halign "start")
        (label :text "${weekday}" :halign "start")
      )
    )
    (box :orientation "h"
         :space-evenly false
         :halign "end"
         :valign "center"
         :hexpand true
      (box :class "pfp"
           :style "background-image: url('${pfp}');")
    )
  )
)

(defwidget poweractions []
  (box :class "poweractionsbox"
       :orientation "h"
       :space-evenly true
    (box :class "buttons-container"
         :space-evenly true
         :halign "end"
         :orientation "h"
      (box :class "buttons"
           :orientation "h"
           :space-evenly true
           :spacing 10
        (button :class "do-logout"
                :onclick "eww close closer && $HOME/.config/eww/scripts/open.sh powermenu && eww open closer"
                :tooltip "Logout"
                :halign "end"
          ""
        )
      )
    )
  )
)

(defwidget actions []
  (box :class "actions"
       :orientation "v"
       :space-evenly false
       :spacing 20
    (user)
    (sysbuttons)
    (controls)
    (poweractions)
  )
)

(defvar actions-visible false)

(defwindow actions-reveal
  :monitor "0"
  :geometry (geometry :x "10px"
                      :y "4px"
                      :width "320px" ; this isn't respected btw, so it's auto-adjusted by eww lol.
                      :height "10px" ; automatically generated by eww.
                      :anchor "top right")

     (revealer
        :transition "crossfade"
        :reveal actions-visible
        :duration "550ms"
        (actions)))