mine-hyprdots/waybar/.config/waybar/style.css
2024-10-08 10:04:45 +05:30

169 lines
2.7 KiB
CSS

@import 'mocha.css';
/* reset all styles */
* {
font-family: JetBrains Mono Nerd Font;
min-height: 18px;
font-size: 14px;
border: none;
border-radius: 6px;
padding: 0;
margin: 0;
box-shadow: none;
text-shadow: none;
background-color: transparent;
color: @beige;
}
#cpu {
padding: 0px 8px 0px 15px;
border-radius: 0px;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
background: @raisin-black;
}
#memory {
padding: 0px 15px 0px 8px;
border-radius: 0px;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
background: @raisin-black;
margin-right: 2px;
}
/* general */
tooltip,
menu,
#workspaces,
#clock,
#wireplumber,
#backlight,
#bluetooth,
#network,
#battery,
#custom-power {
background: @raisin-black;
padding-bottom: 7px;
padding-top: 7px;
margin: 0;
}
tooltip {
border: 1px solid @beige;
}
.modules-right,
.modules-center,
.modules-left {
padding: 0 5px;
}
#custom-wallpaper {
font-size: 20px;
font-family: 'Font Awesome 5 Free';
padding: 0px 8px;
margin-right: 4px;
color: #f38ba8;
background: @raisin-black;
}
#workspaces {
padding: 0 8px 0 3px;
border-radius: 6px;
color: transparent;
font-weight: bold;
opacity: 1;
}
#workspaces button {
background: transparent;
min-width: 30px;
transition: all 0.3s ease-in-out;
opacity: 1;
color: #f38ba8;
}
#workspaces button.active {
color: #f38ba8;
opacity: 1;
}
#workspaces button.active box label {
color: #94e2d5;
}
#clock {
padding: 0 15px;
}
#custom-launcher {
font-size: 16px;
padding: 0px 16px;
transition: none;
background: @raisin-black;
color: rgba(137, 220, 235, 1);
}
#wireplumber,
#backlight {
padding: 0 8px;
margin: 0 2px;
}
#bluetooth,
#network {
color: #cba6f7;
}
#bluetooth {
min-width: 20px;
padding: 0 10px;
margin: 0 2px;
}
#network {
min-width: 30px;
padding: 0 7px 0 2px;
margin: 0 2px;
}
#battery {
color: @mint;
min-width: 30px;
padding-left: 5px;
margin: 0 2px;
padding-right: 5px;
}
#battery.charging {
color: #eff1f5; /* Text */
background: #40a02b; /* Green */
}
#battery.good:not(.charging) {
color: #fab387; /* Peach */
background: #1e1e2e; /* Base */
}
#battery.warning:not(.charging) {
color: #eff1f5; /* Text */
background: #df8e1d; /* Yellow */
}
#battery.low:not(.charging) {
color: #eff1f5; /* Text */
background: #d20f39; /* Red */
}
#battery.critical:not(.charging) {
color: #eff1f5; /* Text */
background: #d20f39; /* Red */
animation-name: blink;
animation-duration: 0.75s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;
}
@keyframes blink {
to {
color: #d20f39; /* Red */
background: #eff1f5; /* Text */
}
}