(defwidget system-menu []
  (box
    :class "system-menu-box"
    :space-evenly false
    :orientation "v"
    (box
      :class "top-row"
      :space-evenly false
      (label
        :class "time"
        :text "${time.hour}:${time.minute}")
      (box
        :class "date-box"
        :space-evenly false
        (label
          :class "date"
          :text {time.date})
        (label
          :class "day"
          :text {time.day})))

    (centerbox
      :class "system-row"
      (box
        :class "wifi-box"
        :space-evenly false
        :orientation "v"
        (box
          :class "element"
          :space-evenly false
          (button
            :class "wifi-button"
            :onclick "scripts/net toggle"
            {net.icon})
          (label
            :class "separator"
            :text "|")
          (button
            :class "wifi-arrow-btn"
            :onclick "eww close system-menu && nm-connection-editor &"
            ""))
        (label
          :text {net.essid}
          :xalign 0.5
          :limit-width 15))

      (box
        :class "bluetooth-box"
        :space-evenly false
        :orientation "v"
        (box
          :class "element"
          :space-evenly false
          (button
            :class "bluetooth-button"
            :onclick "scripts/bluetooth toggle"
            {bluetooth.icon})
          (label
            :class "separator"
            :text "|")
          (button
            :class "bluetooth-arrow-btn"
            :onclick "eww close system-menu && blueberry"
            ""))
        (label
          :text {bluetooth.text}
          :xalign 0.5
          :tooltip "${bluetooth.text} ${bluetooth.batt_icon}"
          :limit-width 15))

      (box
        :class "airplane-box"
        :space-evenly false
        :orientation "v"
        (box
          :class "element"
          (button
            :class "airplane-button"
            :onclick "scripts/airplane toggle"
            airplane))
        (label
          :text "Airplane Mode"
          :xalign 0.5
          :limit-width 16)))

    (box
      :class "sliders"
      :orientation "v"
      (box
        :class "volume-slider-box"
        :space-evenly false
        (button
          :class "volume-icon"
          :onclick "scripts/volume mute SINK"
          {volume.icon})
        (scale
          :class "volume-bar"
          :value {volume.percent}
          :tooltip "volume on ${volume.percent}%"
          :onchange "scripts/volume setvol SINK {}"))
      (box
        :class "volume-slider-box"
        :space-evenly false
        (button
          :class "volume-icon"
          :onclick "scripts/volume mute SOURCE"
          "")
        (scale
          :class "volume-bar"
          :value {volume.microphone}
          :tooltip "mic on ${volume.microphone}%"
          :onchange "scripts/volume setvol SOURCE {}"))
      (box
        :class "brightness-slider-box"
        :space-evenly false
        (button
          :class "brightness-slider-icon"
          {brightness.icon})
        (scale
          :class "brightness-slider" 
          :value {brightness.level} 
          :marks true 
          :onchange "light -S {}")))

    (box
      :class "system-info-box"

      ; cpu
      (box
        :class "sys-box"
        :space-evenly false
        :halign "start"
        (circular-progress
          :value "${EWW_CPU.avg}"
          :class "sys-cpu"
          :thickness 3
          (label
            :text ""
            :class "sys-icon-cpu"))
        (box
          :orientation "v"
          :vexpand "false"
          (label
            :text "cpu"
            :halign "start"
            :class "sys-text-cpu")
          (label
            :text "${round(EWW_CPU.avg,2)}%"
            :halign "start"
            :class "sys-text-sub")
          (label
            :text "${EWW_CPU.cores[0].freq} MHz"
            :halign "start"
            :class "sys-text-sub")))

      ; memory
      (box
        :class "sys-box"
        :space-evenly false
        :halign "end"
        (circular-progress
          :value {memory.percentage}
          :class "sys-mem"
          :thickness 3
          (label
            :text ""
            :class "sys-icon-mem"))
        (box
          :orientation "v"
          (label
            :text "memory"
            :halign "start"
            :class "sys-text-mem")
          (label
            :text "${memory.used} | ${memory.total}"
            :halign "start"
            :class "sys-text-sub"))))

    (box
      :class "bottom-row"
      (box
        :class "battery-box"
        :space-evenly false
        :halign "start"
        (label
          :class "battery-icon"
          :style "color: ${battery.color}"
          :text {battery.icon})
        (label
          :class "battery-percentage"
          :text {EWW_BATTERY["BAT0"].capacity})
        (label
          :class "battery-status"
          :text {battery.status})
        (label
          :class "battery-wattage"
          :text {battery.wattage}))
      (button
        :class "power-button"
        :halign "end"
        :onclick "wlogout -p layer-shell &" ""))))

;; windows
(defwindow system-menu
  :stacking "fg" 
  :windowtype "dock" 
  :wm-ignore true 
  :monitor "0"
  :geometry (geometry
    :x "0"
    :y "0"
    :width "0%"
    :height "0%"
    :anchor "right top")
  (system-menu))