dots/waybar/style.css

@import url("/home/indrajith/.cache/wal/colors-waybar.css");

* {
    all: unset;
	font-family: 'EnvyCodeR Nerd Font';
    transition: background-color .3s ease;
    color: @foreground
}

tooltip,
#tray menu{
    background: @background;
    border: 2px solid @color12;
    border-radius: 7.5px;
    color: @foreground;
    padding: 5px;
}

#tray menu * {
    border-radius: 2.5px;
    transition: all .3s ease;
}

#tray menu *:hover {
    background: @color1;
}


window#waybar {
    background: transparent;
}

window#waybar.hidden {
    opacity: 0.2;
}

window {
	background: transparent;
}

#custom-sep {
	color: @color1;
	font-size: 20px;
}

#custom-sep2 {
	color: transparent;
	font-size: 4px;
}


.modules-right {
	padding-top: 0;
}

.modules-center {
	padding: 0;
}


#workspaces>button.empty {
	color: @color8;
}

#workspaces>button.urgent {
	color: @color2;
}

#workspaces>button.active {
	color: @foreground;
	background: #9b59b6;
}

#workspaces>button {
	color: @foreground;
	font-size: 12.5px;
	transition: all 0.3s ease;
	padding: 0 6px;
	margin: 0;
	border-radius: 2.5px;
}

#workspaces>button:nth-child(1) {
	border-radius: 100px 16px 16px 100px
}

#workspaces>button:last-child {
	border-radius: 16px 100px 100px 16px
}

#group-player {
	background-color: @color1;
	border-radius: 16px 100px 100px 16px;
	padding: 0 16px;
}

#group-power {
	padding: 7px;
}

#custom-notif {
	padding: 2.5px 15px;
	border-radius: 100px;
	margin: 7.5px;
	background: @color3;
}

#custom-infolabel {
	font-size: 20px;
    margin-right: 5px;
	padding: 0 5px;
	padding-right: 5px;
}

#tray {
	padding: 2px;
	background: @foreground;
	border-radius: 16px 100px 100px 16px;
}

#clock {
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 16px;
	font-weight: bold;
	border: 1px solid #e74c3c;
}

#win {
	padding: 2px 7px;
	background-color: @color1;
	border-radius: 16px 100px 100px 16px;
	min-width: 20px;
}

#window {
	color: @foreground;
	padding-left: 5px;
	padding-right: 5px;
}

#window.win2 {
	color: @foreground;
	opacity: 0.7;
}

#group-info {
	background: @color1;
	margin: 0;
	border-radius: 16px 100px 100px 16px;
}


#pulseaudio {
	background-color: #2ecc71;
	padding: 0 8px;
	margin: 2px;
	border-radius: 2px;
	/* border-radius: 100px 16px 16px 100px; */
	color: #ffffff;
}
#taskbar button {
	margin: 5px 0;
	transition: all .3s ease;
}
#taskbar button.active {
	margin: 0 0 10px 0;
}

#cpu {
	background-color: #f1c40f;
	padding: 0 10px;
	margin: 1px;
	border-radius: 3.5px;
	color: #ffffff;
}

#custom-pacman {
	background-color: @color3;
	padding: 0 10px;
	margin: 1px;
	border-radius: 3.5px;
}

#memory {
	background-color: #3498db;
	padding: 0 10px;
	margin: 1px;
	border-radius: 3.5px;
	color: #ffffff;
	margin-left: 10px;
	margin-right: 10px;
}

#custom-mem {
	margin-left: 10px;
	margin-right: 10px
}

#battery {
	background-color: @color7;
	padding: 0 10px;
	margin: 1px;
	border-radius: 3.5px;
}

#custom-kb {
	background-color: @color6;
	padding: 0 10px;
	margin: 1px;
	border-radius: 3.5px;
}
#backlight {
	background-color: @color4;
	padding: 0 10px;
	margin: 1px;
	border-radius: 3.5px;
}

#disk {
	background-color: @color5;
	padding: 0 10px;
	margin: 1px;
	border-radius: 16px 100px 100px 16px;
}

#custom-wal {
	background-color: @color6;
	padding: 0 10px;
	border-radius: 100px 16px 16px 100px;
	font-size: 20px;
}

#custom-sback,
#custom-playpause,
#custom-sfw {
	margin: 8px 2px;
	border-radius: 3.5px;
	padding: 2px 8px;
}

#custom-sback {
	background: @color3;
}

#custom-playpause {
	background: @color4;
}

#custom-sfw {
	background: @color5;
}

.modules-left,
.modules-center{
	background: @background;
	border: 2px solid @color12;
	border-radius: 100px;
	padding: 2px 2px;
}

/* .modules-right  {

} */

#custom-exit {
	padding-right: 10px;
}

#custom-browser,
#custom-filemanager {
	margin-right: 23px;
}