dev/modules/optionnals/desktop/config/etc/xdg/waybar/style.css

@import "colors.css";
@import "custom.css";

* {
  /*font-family: "Font Awesome 6 Free Solid", "Font Awesome 6 Free Regular", "Font Awesome 6 Brands Regular", "CaskaydiaCove Nerd Font Propo";*/
  font-family: "CaskaydiaCove Nerd Font Propo";
  font-size: 16px;
  font-weight: bold;
  min-height: 0px;
  padding: 0;
  margin: 0;
}

#waybar {
  color: @text;
  border: none;
  box-shadow: none;
  background-color: rgba(48, 52, 70, 0);
}

#custom-logo,
#cpu,
#memory,
#disk,
#network,
#workspaces,
#custom-alert,
#custom-maj,
#pulseaudio,
#memory,
#clock,
#tray {
  border-radius: 10px;
  background-color: rgba(48, 52, 70, 0.8);
  margin: 10px 10px 0px 10px;
  border: @overlay0 2px solid;
}

#custom-settings {
  color: @pink;
}

#custom-lockscreen {
  color: @green;
}

#workspaces button {
  background-color: @overlay0;
  margin: 5px 5px;
  border-radius: 10px;
}

#workspaces button:hover,
#workspaces button.empty:hover,
#workspaces button.active:hover,
#workspaces button.visible:hover,
#workspaces button.urgent:hover {
  background: @overlay2;
  border: 0px solid @red;
}

#workspaces button label {
  color: @teal;
  opacity: 0;
  padding: 1px 6px 0px 6px;
  transition: padding 0.2s;
}

#workspaces button.visible label {
  opacity: 1;
  padding: 1px 20px;
  transition: padding 0.2s;
}

#workspaces button.empty {
  background: @surface0;
}

#workspaces button.active {
  background: @overlay1;
}

#workspaces button.visible {
  background: @overlay0;
}

#workspaces button.urgent {
  background: @red;
}

#custom-logo {
  color: @red;
}

#cpu {
  color: @peach;
}

#memory {
  color: @maroon;
}

#disk {
  color: @pink;
}

#network {
  color: @flamingo;
}

#pulseaudio {
  color: @rosewater;
}

#custom-alert {
  color: @sky;
}

#custom-maj {
  color: @sapphire;
}

#clock {
  color: @blue;
}

#tray {
  padding: 0 8px 0 10px;
}