.dotfiles/waybar/style.css

@import "gruvbox.css";
/*
 * Available colours
 * black
 * white
 * fg
 * fghi
 * bg
 * bghi
 * grey00 = bghi
 * grey01 = bg
 * grey02
 * grey03
 * grey04
 * grey05
 * grey06
 * grey07
 * grey08
 * grey09
 * grey10 = fg
 * grey11 = fghi
 * red
 * green
 * yellow
 * blue
 * purple
 * orange
 * aqua
 * redhi
 * greenhi
 * yellowhi
 * bluehi
 * purple hi
 * aquahi
 * orangehi
 * alert = orange
 * warning = orangehi
 */

/* Global/Multi */

* {
    font-family: "Anonymice Nerd Font", "Font Awesome 6 Brands", "Font Awesome 6 Free", Monospace;
    font-size: 14px;
    min-height: 0;
}

window#waybar.window {
}

window#waybar {
    margin: -5px;
    border-bottom: solid 1px @fg;
    background-color: @bg;
    animation-name: fadeIn;
    animation-duration: 1s;
    color: @fg;
}

#window, #mode, #custom-weather, #mpd, #cpu, #memory, #custom-disk, #temperature, #custom-battery, #pulseaudio, #tray, #custom-todo, #custom-keyboard, #custom-pkg, #custom-clock {
    color: @grey06;
    padding: 0px 2px;
    margin: 0px;
}

/* Tray */

#tray, #custom-wallpaper, #custom-pkg, #custom-clock, #custom-idle_mode {
    background: @grey03;
    border-bottom: 1px solid @fg;
    color: @bluehi;
    margin: 0px;
}

/* Workspaces */

#workspaces {
    color: @fg;
}

#workspaces button.visible {
    background-color: @grey06;
}

#workspaces button.focused {
    background-color: @fg;
    color: @grey06;
}

#workspaces button.urgent {
    background-color: @redhi;
    color: @white;
}

/* Mode */

#mode {
    background-color: @grey06;
    color: @bg;
}

/* Window title */

#window {
    color: @fg;
}

/* MPD */

#mpd {
    color: @fg;
}

/* Weather */

#custom-weather {
    margin-top: -8px;
    margin-bottom: -2px;
}

/* Keyboard */

#custom-keyboard {
    color: @bluehi;
    margin-right: -2px;
    margin-top: -1px;
}

#custom-keyboard.alternate {
    color: @orange;
}

/* Backlight */

#backlight {
    margin-left: 5px;
    margin-right: 2px;
    color: @yellowhi;
}

/* CPU */

#cpu {
    color: @greenhi;
}

/* Memory */

#memory {
    color: @purplehi;
}

/* Disk */

#custom-disk {
    color: @orangehi;
}

/*
 * green
 * blue
 * purple
 * orange
*
 * red
 * yellow
 * aqua
 * redhi
 * greenhi
 * yellowhi
 * bluehi
 * purple hi
 * aquahi
 * orangehi
 */

/* Temperature */

#temperature {
    color: @yellowhi;
}

#temperature.critical {
    color: @redhi;
}

/* Pulseaudio */

#pulseaudio {
    color: @bluehi;
}

#pulseaudio.muted {
    color: @grey06;
}

/* Battery */

#custom-battery {
    color: @green;
    margin-top: -1px;
}

#custom-battery.charging {
    margin-top: 2px;
}

#custom-battery.discharging {
    color: @yellow;
}

#custom-battery.low {
    color: @orange;
}

#custom-battery.critical {
    animation-name: blink;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    color: @redhi;
}

/* Tray */

#tray {
    margin-right: -4px;
}

/* Wallpaper rotation */

#custom-wallpaper {
    font-size: 22px;
    margin-top: -4px;
}

/* Package upgrades */

#custom-pkg {
    margin-bottom: -3px;
}

#custom-pkg.updateable {
    color: @orange;
}

/* Idle Mode */

#custom-idle_mode {
    font-family: "Font Awesome 6 Brands", "Font Awesome 6 Free";
    padding-right: 3px;
}

#custom-idle_mode.none {
    color: @red;
}

/* Clock */

#custom-clock {
    color: @fg;
    font-weight: bold;
    margin: 0px;
}

/* Notifications */

#custom-nc {
    font-family: "NotoSansMono Nerd Font";
    background: @grey06;
    margin: 0px;
}