feat(waybar): styling
This commit is contained in:
parent
5e6123a866
commit
1bbbae4984
2 changed files with 36 additions and 8 deletions
|
@ -4,6 +4,7 @@
|
||||||
"position": "top",
|
"position": "top",
|
||||||
"height": 32,
|
"height": 32,
|
||||||
"spacing": 4,
|
"spacing": 4,
|
||||||
|
"margin": 5,
|
||||||
"modules-left": ["wlr/workspaces"],
|
"modules-left": ["wlr/workspaces"],
|
||||||
"modules-center": [
|
"modules-center": [
|
||||||
"hyprland/window"
|
"hyprland/window"
|
||||||
|
|
|
@ -1,30 +1,57 @@
|
||||||
|
@define-color red #f38ba8;
|
||||||
|
@define-color pink #f5c2e7;
|
||||||
|
@define-color crust #11111c;
|
||||||
|
@define-color base #1e1e2e;
|
||||||
|
@define-color text #cdd6f4;
|
||||||
|
@define-color surface0 #313244;
|
||||||
|
@define-color surface2 #585b70;
|
||||||
|
|
||||||
* {
|
* {
|
||||||
font-family: Symbols Nerd Font, Berkeley Mono;
|
font-family: Symbols Nerd Font, IBM Plex Sans;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: #cdd6f4;
|
color: @text;
|
||||||
}
|
}
|
||||||
|
|
||||||
window#waybar {
|
window#waybar {
|
||||||
background-color: #000;
|
background-color: @base;
|
||||||
|
border: 2px solid @crust;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#workspaces button:first-child {
|
||||||
|
padding: 0 5px;
|
||||||
|
border-radius: 5px 0 0 5px;
|
||||||
|
border-left: 2px solid @crust;
|
||||||
|
}
|
||||||
|
#workspaces button.active:first-child {
|
||||||
|
padding: 0 5px;
|
||||||
|
box-shadow: unset;
|
||||||
|
border-radius: 5px 0 0 5px;
|
||||||
|
border-left: 2px solid @pink;
|
||||||
|
border-top: 2px solid @pink;
|
||||||
|
border-bottom: 2px solid @pink;
|
||||||
}
|
}
|
||||||
|
|
||||||
#workspaces button {
|
#workspaces button {
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
border-top: 2px solid @crust;
|
||||||
|
border-bottom: 2px solid @crust;
|
||||||
}
|
}
|
||||||
|
|
||||||
#workspaces button:hover {
|
#workspaces button:hover {
|
||||||
background: #313244;
|
background: @surface2;
|
||||||
}
|
}
|
||||||
|
|
||||||
#workspaces button.active {
|
#workspaces button.active {
|
||||||
color: #f5c2e7;
|
color: @pink;
|
||||||
background: #585b70;
|
background: @surface0;
|
||||||
box-shadow: inset 0 -3px #f5c2e7;
|
border-top: 2px solid @pink;
|
||||||
|
border-bottom: 2px solid @pink;
|
||||||
}
|
}
|
||||||
|
|
||||||
#workspaces button.urgent {
|
#workspaces button.urgent {
|
||||||
background-color: #f38ba8;
|
background-color: @red;
|
||||||
}
|
}
|
||||||
|
|
||||||
#clock,
|
#clock,
|
||||||
|
|
Loading…
Reference in a new issue