os/shared/home/gui/waybar.nix

{ ... }: {
  programs.waybar = {
    enable = true;
    systemd = {
      enable = true;
      target = "sway-session.target";
    };
    settings = [{
      layer = "top";
      modules-left = [
        "sway/workspaces"
        "sway/mode"
      ];
      modules-right = [
        "cpu"
        "disk"
        "wireplumber"
        "network#wifi"
        "network#eth"
        "clock#date"
        "clock#time"
      ];
      "clock#time" = {
        "format" = "{:%H:%M:%S}";
    		"interval" = 1;
      };
      "clock#date" = {
        "format" = "{:%Y-%m-%d}";
    		"interval" = 60;
      };
    	"network#wifi" = {
    		"interface" = "wlp6s0";
    	};
    	"network#eth" = {
    		"interface" = "enp9s0";
    	};
    	"wireplumber" = {
    		"format" = "{node_name}: {volume}%";
    	};
    	"disk" = {
    		"format" = "{used} :: {free}";
    	};
    }];

    style = ''
      * {
      	font-family: 'Fira Code';
      	font-weight: 700;
      	font-size: 12px;
      }

      window#waybar {
      	background-color: rgba(0,0,0,0.7);
      }

      #workspaces {
      	margin-left: 5px;
      	background-color: rgba(0, 0, 0, 0.6);
      	padding: 0;
      	margin: 5px;
      	border-radius: 200px;
      }

      #workspaces button {
      	color: #ffffff;
      	margin: 0;
      	padding: 0 5px;
      	border-radius: 100px;
      	font-size: 0;
      	background-color: rgba(0, 0, 0, 0.4);
      }

      #workspaces button.visible.focused {
      	background-color: #ff4787;
      }

      #workspaces button.visible {
      	color: #ffffff;
      	background-color: rgba(207, 207, 207, 0.4);
      }

      #mode {
      	padding: 2px 10px;
      	margin: 5px;
      	border-radius: 100px;
      	background-color: #1bcf9c;
      	font-weight: 600;
      }

      #clock {
      	padding: 2px 10px;
      	margin: 5px;
      	border-radius: 100px;
      	color: #ffffff;
      	background-color: #3988e3;
      }

      #clock.date {
      	background-color: transparent;
      }

      #network {
      	padding: 2px 10px;
      	margin: 5px;
      	border-radius: 100px;
      	background-color: #27e67a;
      }

      #wireplumber {
      	padding: 2px 10px;
      	margin: 5px;
      	border-radius: 100px;
      	background-color: #edd340;
      }

      #wireplumber.muted {
      	color: #ffffff;
      	background-color: rgba(207, 207, 207, 0.4);
      }

      #cpu, #disk {
      	padding: 2px 10px;
      	margin: 5px;
      	border-radius: 100px;
      	color: #ffffff;
      	background-color: rgba(0, 0, 0, 0.4);
      }
      
    '';
  };
}