136 lines
2.4 KiB
CSS
136 lines
2.4 KiB
CSS
/* Styles */
|
|
|
|
@define-color bar-back rgba(40, 40, 40, 0.2);
|
|
@define-color widget rgba(40, 40, 40, 0.8);
|
|
@define-color warning @bryellow;
|
|
@define-color critical red;
|
|
@define-color mode black;
|
|
@define-color unfocused @widget;
|
|
@define-color active rgba(100, 40, 40, 0.7);
|
|
@define-color focused red;/*rgba(100, 40, 40, 0.7);*/
|
|
@define-color inactive purple;
|
|
@define-color fg1 rgba(0, 0, 255, 1);
|
|
@define-color fg2 rgba(255, 0, 0, 1);
|
|
|
|
/* Reset all styles */
|
|
* {
|
|
border: none;
|
|
border-radius: 0;
|
|
min-height: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
box-shadow: none;
|
|
text-shadow: none;
|
|
-gtk-icon-shadow: none;
|
|
}
|
|
|
|
/* The whole bar */
|
|
#waybar {
|
|
background: @bar-back;
|
|
/*
|
|
background: rgba(0, 0, 0, 0);
|
|
*/
|
|
/*background-image: linear-gradient(to left, rgba(255, 100, 100, 100), rgba(255, 100, 100, 0));*/
|
|
background: linear-gradient(90deg, rgba(0,212,255,0.19089642693014708) 0%, rgba(255,255,255,0) 25%, rgba(255,255,255,0) 75%, rgba(248,0,255,0.2105042700674019) 100%);
|
|
color: @white;
|
|
font-family: JetBrains Mono;
|
|
font-size: 13pt;
|
|
}
|
|
|
|
/* Each module */
|
|
#battery,
|
|
#clock,
|
|
#cpu,
|
|
#language,
|
|
#memory,
|
|
#mode,
|
|
#network,
|
|
#pulseaudio-slider,
|
|
#temperature,
|
|
#tray,
|
|
#backlight,
|
|
#wireplumber,
|
|
#idle_inhibitor,
|
|
#disk,
|
|
#user,
|
|
#keyboard-state,
|
|
#workspaces button,
|
|
#custom-os-icon,
|
|
#mpris {
|
|
background: @widget;
|
|
margin: 0 0.2em 0 0.2em;
|
|
padding: 0em 0.3em 0em 0.3em;
|
|
border-radius: 0.35em;
|
|
}
|
|
|
|
#custom-os-icon {
|
|
min-width: 0.8em;
|
|
padding: 0 0.5em 0 0.1em; /*Otherwise the icon is not centered properly*/
|
|
}
|
|
|
|
#tray {
|
|
min-width: 0.8em;
|
|
}
|
|
|
|
#keyboard-state {
|
|
min-width: 2em;
|
|
color: white;
|
|
}
|
|
|
|
#workspaces button {
|
|
opacity: 100;
|
|
color: white;
|
|
}
|
|
|
|
/* Inactive (on unfocused output) */
|
|
#workspaces button.inactive {
|
|
background: @inactive;
|
|
}
|
|
|
|
#workspaces button.active {
|
|
background: @active;
|
|
}
|
|
|
|
#custom-os-icon {
|
|
color: rgba(150, 150, 255, 1);
|
|
margin: 0 1em 0 0.2em;
|
|
}
|
|
|
|
#wireplumber {
|
|
/*color: @fg1;*/
|
|
border-radius: 0 0.3em 0.3em 0;
|
|
}
|
|
|
|
#backlight {
|
|
/*color: @fg2;*/
|
|
border-radius: 0.3em 0 0 0.3em;
|
|
}
|
|
|
|
|
|
/* Active (on focused output) */
|
|
#workspaces button.focused {
|
|
opacity: 100;
|
|
background: @focused;
|
|
}
|
|
|
|
/* Contains an urgent window */
|
|
#workspaces button.urgent {
|
|
background: @warning;
|
|
|
|
}
|
|
|
|
/* Style when cursor is on the button */
|
|
#workspaces button:hover {
|
|
opacity: 110;
|
|
background: @focused;
|
|
}
|
|
|
|
#clock.date {
|
|
border-radius: 0.3em 0 0 0.3em;
|
|
min-width: 7em;
|
|
}
|
|
#clock.time{
|
|
/*border-radius: 0 0.3em 0.3em 0;*/
|
|
border-radius: 0;
|
|
min-width: 4em;
|
|
}
|