dotfiles/waybar/style.css

* {
  font-family: "JetBrainsMono Nerd Font";
  font-weight: bold;
  font-size: 12px;
  min-height: 0;
  padding: 0;
  border: none;
  margin: 2px;
}

/* === Main Background === */

window#waybar {
  background: transparent;
}

/* === Tooltip === */

tooltip {
  background: #11111b;
  border: solid;
  border-width: 1.5px;
  border-radius: 8px;
  border-color: #cdd6f4;
}
tooltip label {
  color: #c7a4de;
  font-weight: normal;
  margin: -1.5px 3px;
}

/* === Workspace Buttons === */

#workspaces button {
  border-radius: 8px;
  box-shadow: none;
  margin: 2px 0;
  padding: 0 2px;
  transition: none;
}
#workspaces button:hover {
  color: #11111b;
  background: #c7a4de;
  text-shadow: none;
  box-shadow: none;
}
#workspaces button.active {
  color: #11111b;
  background: #885ab0;
  margin: 3px 0;
  padding: 0 6px;
}

/* == Workspaces == */

#workspaces {
  background: #11111b;
  padding: 0 4px;
  border-radius: 7px;
}

/* == Time == */

#clock {
  background: #11111b;
  padding: 0 8px;
  border-radius: 7px;
}

/* == Tray == */

#custom-wifi {
  padding-left: 8px;
  padding-right: 11px;
  background: #11111b;
  border-radius: 7px;
}
#custom-wifi:hover {
  color: #c7a4de;
  text-shadow: none;
  box-shadow: none;
}

#bluetooth {
  padding-right: 8px;
  padding-left: 8px;
  background: #11111b;
  border-radius: 7px;
}
#bluetooth:hover {
  color: #c7a4de;
  text-shadow: none;
  box-shadow: none;
}

/* == Media Info == */

#custom-media {
  font-weight: normal;
  background-color: #11111b;
  padding-right: 8px;
  padding-left: 8px;
  border-radius: 7px;
}
#custom-media:hover {
  color: #c7a4de;
  text-shadow: none;
  box-shadow: none;
}

/* == Output Device == */

#pulseaudio {
  background: #11111b;
  padding: 0 8px;
  border-radius: 7px;
}

#pulseaudio:hover {
  color: #c7a4de;
  text-shadow: none;
  box-shadow: none;
}

/* == Battery == */

#battery {
  background: #11111b;
  padding: 0 8px;
  border-radius: 7px;
}

/* == Power Button == */

#custom-power {
  color: #11111b;
  background: #885ab0;
  border-radius: 7px;
  padding: 0 6px 0 9px;
}
#custom-power:hover {
  background: #c7a4de;
  text-shadow: none;
  box-shadow: none;
}

/* == Tray == */

#tray {
  background: #11111b;
  padding: 0 4px;
  border-radius: 7px;
}

/* == Lyrics == */

#custom-lyrics {
  background: #11111b;
  padding: 0 8px;
  border-radius: 7px; 
}

/* == Cava == */

#cava {
  background: #11111b;
  padding: 0 8px;
  border-radius: 7px;
}

/* == Window == */

#window {
  background: #11111b;
  padding: 0 8px;
  border-radius: 7px;
}