176 lines
2.5 KiB
CSS
176 lines
2.5 KiB
CSS
@import "catppuccin.css";
|
||
|
||
* {
|
||
border: none;
|
||
font-family: "FiraCode Nerd Font";
|
||
font-size: 15px;
|
||
min-height: 10px;
|
||
}
|
||
|
||
window#waybar {
|
||
background: @crust;
|
||
}
|
||
|
||
window#waybar.hidden {
|
||
opacity: 0.2;
|
||
}
|
||
|
||
/* - Genera rules for visible modules -- */
|
||
#media,
|
||
#clock,
|
||
#cpu,
|
||
#memory,
|
||
#disk,
|
||
#temperature,
|
||
#network,
|
||
#custom-wallpaper,
|
||
#media,
|
||
#custom-weather {
|
||
color: @crust;
|
||
margin-top: 6px;
|
||
margin-bottom: 6px;
|
||
padding-left: 10px;
|
||
padding-right: 10px;
|
||
transition: none;
|
||
}
|
||
|
||
/* Separation to the left */
|
||
#custom-nixicon,
|
||
#cpu {
|
||
margin-left: 5px;
|
||
border-top-left-radius: 10px;
|
||
border-bottom-left-radius: 10px;
|
||
}
|
||
|
||
/* Separation to the rigth */
|
||
#clock,
|
||
#temperature {
|
||
margin-right: 20px;
|
||
border-top-right-radius: 10px;
|
||
border-bottom-right-radius: 10px;
|
||
}
|
||
|
||
/* -- Specific styles -- */
|
||
|
||
#custom-nixicon {
|
||
background-image: url("nix-snowflake.svg");
|
||
background-size: contain;
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
min-height: 24px;
|
||
min-width: 24px;
|
||
|
||
padding: 0px;
|
||
padding-right: 15px;
|
||
padding-left: 10px;
|
||
margin-top: 6px;
|
||
margin-bottom: 6px;
|
||
margin-left: 15px;
|
||
}
|
||
|
||
/* Hardware Group */
|
||
#clock {
|
||
background: @yellow;
|
||
}
|
||
|
||
#cpu {
|
||
background: @blue;
|
||
}
|
||
|
||
#memory {
|
||
background: @red;
|
||
}
|
||
|
||
#disk {
|
||
background: @peach;
|
||
}
|
||
|
||
#temperature {
|
||
background: @sky;
|
||
}
|
||
|
||
#network {
|
||
background: @lavender;
|
||
padding-right: 13px;
|
||
}
|
||
|
||
/* Workspace */
|
||
#workspaces {
|
||
border-radius: 10px;
|
||
margin: 6px 5px;
|
||
padding: 0px 6px;
|
||
}
|
||
|
||
#workspaces button {
|
||
color: @text;
|
||
background: transparent;
|
||
padding: 4px 4px;
|
||
transition: color 0.3s ease, text-shadow 0.3s ease, transform 0.3s ease;
|
||
border: none;
|
||
}
|
||
|
||
#workspaces button.occupied {
|
||
color: @red;
|
||
}
|
||
|
||
#workspaces button.active {
|
||
color: @green;
|
||
text-shadow: 0 0 4px @green;
|
||
}
|
||
|
||
#workspaces button:hover {
|
||
color: @teal;
|
||
border: none;
|
||
}
|
||
|
||
#workspaces button.active:hover {}
|
||
|
||
|
||
|
||
/* Media Group */
|
||
#media {
|
||
background: @overlay2;
|
||
border-radius: 10px;
|
||
color: @crust;
|
||
margin-left: 20px;
|
||
}
|
||
|
||
#custom-cava {
|
||
color: @sky;
|
||
}
|
||
|
||
#wireplumber, #custom-cava, #mpris {
|
||
margin-left: 10px;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
#wireplumber {
|
||
margin-right: 5px;
|
||
}
|
||
|
||
|
||
/* Weather */
|
||
#custom-weather {
|
||
background: @sky;
|
||
color: @crust;
|
||
border-radius: 10px;
|
||
margin-right: 20px;
|
||
}
|
||
|
||
/* SwayNC */
|
||
#custom-notification {
|
||
font-family: "NotoSansMono Nerd Font";
|
||
background: @green;
|
||
border-radius: 10px;
|
||
padding-left: 10px;
|
||
padding-right: 5px;
|
||
}
|
||
|
||
/* Wallpaper */
|
||
#custom-wallpaper {
|
||
background: @red;
|
||
color: @mantle;
|
||
border-radius: 10px;
|
||
margin-left: 5px;
|
||
}
|