Files
dotfiles/waybar/style.css
2026-02-25 01:35:25 +01:00

166 lines
2.2 KiB
CSS

@define-color bg #1e1e2e;
@define-color accent #b4befe;
* {
min-height: 0;
min-width: 0;
font-family: "Lexend", "JetBrainsMono Nerd Font";
font-size: 13px;
font-weight: 400;
}
#workspaces {
background: transparent;
}
window#waybar {
min-height: 0;
background: transparent;
}
#window {
font-weight: 700;
}
#workspaces button {
padding-left: 5px;
padding-right: 0;
margin-top: 3px;
padding-top: 0;
padding-bottom: 0;
border: 0;
margin-left: 4px;
margin-right: 0;
min-height: 10px;
min-width: 24px;
border-radius: 6px;
background: alpha(@bg, 0.3);
transition:
all 180ms cubic-bezier(.4,0,.2,1),
color 800ms cubic-bezier(.4, 0, .2, 1);
opacity: 0.3;
}
#workspaces button label {
font-size: 18px;
letter-spacing: -3px;
}
#workspaces button:hover {
background: rgba(255,255,255,0.45);
opacity: 0.4;
}
#workspaces button.active {
min-width: 34px;
background: white;
background: alpha(@bg,0.3);
color: white;
border: 1px solid alpha(white, 0.7);
opacity: 1.0;
}
#workspaces button.visible {
background: alpha(@bg,0.3);
}
#workspaces button.urgent {
background: #ff5f5f;
}
#clock,
#pulseaudio,
#custom-nowplaying,
#custom-logo,
#custom-power,
#custom-spotify,
#custom-notification,
#custom-tailscale,
#custom-weather,
#cpu,
#tray,
#memory,
#battery,
#network,
#window,
#mpris {
padding: 0.1rem 0.6rem;
border-radius: 6px;
background-color: alpha(@bg, 0.3);
margin-top: 3px;
margin-left: 3px;
margin-right: 3px;
}
#custom-nowplaying {
padding-left: 40px;
background-size: 30px 30px;
background-repeat: no-repeat;
background-position: left center;
background-image: url('/home/stereov/.cache/nowplaying-cover.jpg')
}
#mpris.playing {
color: #a6e3a1;
}
#mpris.paused {
color: #9399b2;
}
#custom-sep {
padding: 0px;
color: #585b70;
}
/*
#cpu {
color: #94e2d5;
}
#memory {
color: #cba6f7;
}
#clock {
color: #74c7ec;
}
#clock.simpleclock {
color: #89b4fa;
}
#pulseaudio {
color: #b4befe;
}
#pulseaudio.muted {
color: #a6adc8;
}
#custom-logo {
color: #89b4fa;
}
#custom-power {
color: #f38ba8;
}
#battery {
color: #94e2d5;
}
#battery.critical {
color: red;
}
tooltip {
background-color: #181825;
border: 2px solid #89b4fa;
}
*/