MainDots/Configs/waybar/btm-1/style.css

183 lines
3.4 KiB
CSS
Executable File

/*//////////////////////////////////////////////////////////
// _ __ __ __ __ //
// | | /| / /__ ___ __/ / ___ _____ ___ / /___ __/ /__ //
// | |/ |/ / _ `/ // / _ \/ _ `/ __/ (_-</ __/ // / / -_) //
// |__/|__/\_,_/\_, /_.__/\_,_/_/ /___/\__/\_, /_/\__/ //
// /___/ /___/ //
////////////////////////////////////////////////////////////
*/
@define-color bg #181825;
@define-color fgi #7f849c;
@define-color fga #b4befe;
@define-color bgm rgba(39,39,68, 0.65);
/*Main settings.*/
* {
font-family: RobotoMonoNerdFont;
font-size: 13px;
font-weight: Bold;
}
window#waybar {
background: rgba(0,0,0, 0);
transition-property: background-color;
transition-duration: .5s;
}
window#waybar > box{
color: @fgi;
background: @bg;
transition-property: background-color;
transition-duration: .5s;
border-radius: 55px;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 14px;
margin-right: 14px;
}
.modules-right {
border-radius: 7;
margin: 6 6 6 0px;
padding: 0 1 0 2px;
}
.modules-center {
border-radius: 7;
margin: 6 6 6 6px;
padding: 0 2 0 2px;
}
.modules-left {
border-radius: 7;
margin: 6 0 6 6px;
padding: 0 2 0 0px;
}
/*Modules setting.*/
/*1. Workspace switcher module.
Main.*/
#workspaces {
background-color: @bgm;
padding: 6 5 6 5px;
border-radius: 30px;
}
/*1.1. Inactive workspace button.*/
#workspaces button {
color: @fgi;
border-radius: 30px;
transition: all 0.3s ease;
padding: 0 14 0 8px;
}
/*1.2. Inactive workspace hover button.*/
#workspaces button:hover {
box-shadow: inherit;
color: #cdd6f4;
text-shadow: inherit;
transition: all 0.3s ease;
}
#workspaces button.focused,
/*1.3. Active workspace button.*/
#workspaces button.active {
color: @fga;
transition: all 0.3s ease;
animation: colored-gradient 10s ease infinite;
}
/*1.4. Warning workspace button.*/
#workspaces button.urgent {
color: #f38ba8;
transition: all 0.3s ease;
}
/*2. Keyboard layout module.*/
#language {
background-color: @bgm;
color: @fga;
padding: 8 15 7 13px;
border-radius: 30px;
margin: 0 7 0 7px;
}
/*3. PulseAudio control module.*/
#pulseaudio.audio {
background-color: @bgm;
color: @fga;
border-radius: 30px;
padding: 8 15 7 15px;
}
/*5. PulseAudio muted status module3*/
#pulseaudio.audio.muted {
color: @fgi;
font-size: 15px;
padding: 8 14 8 15px;
}
/*6. Batteries capacity monitoring module.*/
#battery {
background-color: @bgm;
padding: 8 15 8 15px;
border-radius: 30px;
}
#custom-clockicon {
padding: 0 6 0 10px;
font-size: 14px;
}
#custom-tempicon {
background-color: @bgm;
padding: 8 0 8 14px;
font-size: 14px;
border-radius: 30 0 0 30px;
}
#custom-separator {
padding: 0 3 2 3px;
}
#temperature {
/*padding: 0 10 0 2px;*/
background-color: @bgm;
padding: 8 15 8 15px;
border-radius: 30 30 30 30px;
}
#battery.bat2 {
margin: 0 7 0 0px;
padding: 8 15 8 15px;
}
/*7. Batteries charging status monitoring module.*/
#battery.bat2.charging, #battery.bat2.plugged {
margin: 0 7 0 0px;
padding: 8 15 8 15px;
}
#battery.charging, #battery.plugged {
background-color: @bgm;
color: @fga;
padding: 8 15 8 15px;
animation: gradient 5s linear infinite;
transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}
/*8. Date and time module.*/
#clock {
border-radius: 30px;
padding: 8 15 8 15px;
background-color: @bgm;
margin: 0 7 0 0px;
}