A lot of styling later...
This commit is contained in:
parent
e8f3c8b293
commit
e3a2e8ef68
10 changed files with 364 additions and 185 deletions
|
|
@ -1,126 +0,0 @@
|
|||
//
|
||||
// ~/.config/waybar/config
|
||||
//
|
||||
|
||||
[{
|
||||
"position": "top",
|
||||
"height": 25,
|
||||
"spacing": 4,
|
||||
"margin": "-25px 0 0 0",
|
||||
|
||||
"modules-left": ["sway/workspaces", "custom/media"],
|
||||
"modules-right": ["idle_inhibitor", "disk", "memory", "cpu", "temperature", "pulseaudio", "battery", "tray"],
|
||||
|
||||
|
||||
"mode": "hide",
|
||||
"ipc": true,
|
||||
|
||||
"sway/workspaces": {
|
||||
"disable-scroll": true,
|
||||
"all-outputs": true,
|
||||
"format": "{icon}{name}",
|
||||
"format-icons": {
|
||||
"urgent": "\uf071 ",
|
||||
"default": "" // Prevent showing workspace name literal.
|
||||
},
|
||||
},
|
||||
"custom/media": {
|
||||
"format": "{icon} {}",
|
||||
"return-type": "json",
|
||||
"max-length": 40,
|
||||
"format-icons": {
|
||||
"spotify": "\uf1bc",
|
||||
"default": "\uf51f"
|
||||
},
|
||||
"escape": true,
|
||||
"exec": "~/.config/waybar/mediaplayer.py 2> /dev/null", // Script in resources folder
|
||||
"on-click": "playerctl play-pause",
|
||||
},
|
||||
|
||||
|
||||
"idle_inhibitor": {
|
||||
"format": "{icon}",
|
||||
"format-icons": {
|
||||
"activated": "\uf06e",
|
||||
"deactivated": "\uf070"
|
||||
},
|
||||
"tooltip": false,
|
||||
},
|
||||
"disk": {
|
||||
"interval": 30,
|
||||
"format": "{percentage_free}% ({free}) \uf0a0",
|
||||
"path": "/",
|
||||
"on-click": "alacritty -e ncdu /",
|
||||
},
|
||||
"memory": {
|
||||
"format": "{}% \uf1c0",
|
||||
"on-click": "alacritty -e htop",
|
||||
},
|
||||
"cpu": {
|
||||
"format": "{usage}% \uf2db",
|
||||
"tooltip": true,
|
||||
"on-click": "alacritty -e htop",
|
||||
},
|
||||
"temperature": {
|
||||
"critical-threshold": 70,
|
||||
// "format-critical": "{temperatureC}°C {icon}",
|
||||
"format": "{temperatureC}°C {icon}",
|
||||
"format-icons": ["\uf2cb", "\uf2c9", "\uf2c7"],
|
||||
},
|
||||
"pulseaudio": {
|
||||
"scroll-step": 2,
|
||||
"format": "{volume}% {icon} {format_source}",
|
||||
"format-bluetooth": "{volume}% {icon}\uf294 {format_source}",
|
||||
"format-bluetooth-muted": "\uf6a9 {icon}\uf294 {format_source}",
|
||||
"format-muted": "\uf6a9 {format_source}",
|
||||
"format-source": "{volume}% \uf130",
|
||||
"format-source-muted": "\uf131",
|
||||
"format-icons": {
|
||||
"headphone": "\uf58f",
|
||||
"hands-free": "\uf590",
|
||||
"headset": "\uf590",
|
||||
"phone": "\uf3ce",
|
||||
"portable": "\uf3ce",
|
||||
"car": "\uf1b9",
|
||||
"default": ["\uf026", "\uf027", "\uf028 "]
|
||||
},
|
||||
"on-click": "pavucontrol",
|
||||
},
|
||||
"battery": {
|
||||
"states": {
|
||||
"warning": 30,
|
||||
"critical": 15
|
||||
},
|
||||
"format": "{capacity}% {icon}",
|
||||
"format-alt": "{time} {icon}",
|
||||
"format-charging": "{capacity}% \uf0e7 {icon}",
|
||||
"format-plugged": "{capacity}% \ue55c",
|
||||
// "format-good": "", // An empty format will hide the module
|
||||
// "format-full": "",
|
||||
"format-icons": ["\uf244", "\uf243", "\uf242", "\uf241", "\uf240"],
|
||||
},
|
||||
"tray": {
|
||||
// "icon-size": 21,
|
||||
"spacing": 10,
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
"position": "top",
|
||||
"height": 25,
|
||||
"modules-left": ["sway/mode"],
|
||||
"modules-center": ["sway/window"],
|
||||
"modules-right": ["clock"],
|
||||
|
||||
"sway/window": {
|
||||
"max-length": 85,
|
||||
},
|
||||
|
||||
"clock": {
|
||||
"timezone": "Europe/Brussels",
|
||||
"format": "{:%H:%M}",
|
||||
"format-alt": "{:%d/%m/%Y %H:%M}", //"<big>{:%H:%M}</big>\n21-03-2022", //\n{:%d/%m/%Y}",
|
||||
"tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>",
|
||||
},
|
||||
}]
|
||||
|
||||
42
config/waybar/config
Normal file
42
config/waybar/config
Normal file
|
|
@ -0,0 +1,42 @@
|
|||
//
|
||||
// ~/.config/waybar/config
|
||||
//
|
||||
|
||||
[{
|
||||
|
||||
"name": "toggle",
|
||||
|
||||
"mode": "hide",
|
||||
"ipc": true,
|
||||
|
||||
"position": "top",
|
||||
"height": 25,
|
||||
"spacing": 4,
|
||||
"margin": "-25px 0 0 0", // Show this bar on top of the other one, seemingly the "same" one.
|
||||
|
||||
"custom/sep": {
|
||||
"format": "\uf142"
|
||||
},
|
||||
|
||||
"include": [
|
||||
// Import modules (!)
|
||||
"~/.config/waybar/modules.json",
|
||||
// "~/.config/waybar/default.json"
|
||||
"~/.config/waybar/left.json"
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
|
||||
// Import modules (!)
|
||||
"include": "~/.config/waybar/modules.json",
|
||||
|
||||
"name": "keep",
|
||||
"position": "top",
|
||||
"height": 25,
|
||||
"modules-left": ["sway/mode"],
|
||||
"modules-center": ["sway/window"],
|
||||
"modules-right": ["clock"],
|
||||
|
||||
}]
|
||||
|
||||
24
config/waybar/default.json
Normal file
24
config/waybar/default.json
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
|
||||
{
|
||||
"modules-left": [
|
||||
"idle_inhibitor",
|
||||
"custom/media"
|
||||
],
|
||||
"modules-center": [
|
||||
"sway/workspaces"
|
||||
],
|
||||
"modules-right": [
|
||||
"disk",
|
||||
"memory",
|
||||
"cpu",
|
||||
"temperature",
|
||||
"custom/sep",
|
||||
"bluetooth",
|
||||
"network",
|
||||
"pulseaudio",
|
||||
"battery",
|
||||
"custom/sep",
|
||||
"tray"
|
||||
]
|
||||
}
|
||||
|
||||
20
config/waybar/left.json
Normal file
20
config/waybar/left.json
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
{
|
||||
"modules-left": [
|
||||
"sway/workspaces",
|
||||
"idle_inhibitor",
|
||||
"custom/media"
|
||||
],
|
||||
"modules-right": [
|
||||
"disk",
|
||||
"memory",
|
||||
"cpu",
|
||||
"temperature",
|
||||
"custom/sep",
|
||||
"bluetooth",
|
||||
"network",
|
||||
"pulseaudio",
|
||||
"battery",
|
||||
"custom/sep",
|
||||
"tray"
|
||||
]
|
||||
}
|
||||
137
config/waybar/modules.json
Normal file
137
config/waybar/modules.json
Normal file
|
|
@ -0,0 +1,137 @@
|
|||
{
|
||||
|
||||
"battery": {
|
||||
"format": "{capacity}% {icon}",
|
||||
"format-alt": "{time} {icon}",
|
||||
"format-charging": "{capacity}% \uf0e7 {icon}",
|
||||
"format-icons": ["\uf244", "\uf243", "\uf242", "\uf241", "\uf240"],
|
||||
"format-plugged": "{capacity}% \ue55c",
|
||||
"states": {
|
||||
"warning": 30,
|
||||
"critical": 15
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
"disk": {
|
||||
"interval": 30,
|
||||
"format": "{percentage_used}% \uf0a0",
|
||||
"on-click": "alacritty -e ncdu /",
|
||||
"path": "/",
|
||||
"tooltip-format": "{used} used out of {total} on {path} ({percentage_free}% or {free} free)"
|
||||
},
|
||||
|
||||
|
||||
"bluetooth": {
|
||||
"format": "\uf294 {status}",
|
||||
"format-disabled": "\uf294",
|
||||
"on-click": "~/.scripts/bluetoggle.sh",
|
||||
"on-click-right": "blueman-manager"
|
||||
},
|
||||
|
||||
|
||||
"clock": {
|
||||
"format": "{:%H:%M}",
|
||||
"format-alt": "{:%d/%m/%Y %H:%M}",
|
||||
"timezone": "Europe/Brussels",
|
||||
"tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>"
|
||||
},
|
||||
|
||||
|
||||
"custom/media": {
|
||||
"escape": true,
|
||||
"exec": "~/.config/waybar/mediaplayer.py 2> /dev/null",
|
||||
"format": "{icon} {}",
|
||||
"format-icons": {
|
||||
"default": "\uf51f",
|
||||
"spotify": "\uf1bc"
|
||||
},
|
||||
"max-length": 40,
|
||||
"on-click": "playerctl play-pause",
|
||||
"return-type": "json"
|
||||
},
|
||||
|
||||
|
||||
"cpu": {
|
||||
"format": "{usage}% \uf2db",
|
||||
"on-click": "alacritty -e htop",
|
||||
"tooltip": true
|
||||
},
|
||||
|
||||
|
||||
"idle_inhibitor": {
|
||||
"format": "{icon}",
|
||||
"format-icons": {
|
||||
"activated": "\uf06e",
|
||||
"deactivated": "\uf070"
|
||||
},
|
||||
"tooltip": false
|
||||
},
|
||||
|
||||
|
||||
"memory": {
|
||||
"format": "{}% \uf1c0",
|
||||
"on-click": "alacritty -e htop"
|
||||
},
|
||||
|
||||
|
||||
"network": {
|
||||
"format-disconnected": "\uf127",
|
||||
"format-ethernet": "\uf6ff {ifname}: {ipadds}/{cidr}",
|
||||
"format-wifi": "\uf1eb {essid} ({signalStrength}%)",
|
||||
"interval": 5,
|
||||
"on-click-right": "alacritty -e nmtui",
|
||||
"tooltip-format": "{ifname}: {ipaddr}"
|
||||
},
|
||||
|
||||
|
||||
"sway/window": {
|
||||
"max-length": 85
|
||||
},
|
||||
|
||||
|
||||
"sway/workspaces": {
|
||||
"all-outputs": true,
|
||||
"disable-scroll": true,
|
||||
"format": "{icon}{name}",
|
||||
"format-icons": {
|
||||
"default": "", // Prevent showing workspace name literal.
|
||||
"urgent": "\uf071 "
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
"pulseaudio": {
|
||||
"format": "{volume}% {icon} {format_source}",
|
||||
"format-bluetooth": "{volume}% {icon}\uf294 {format_source}",
|
||||
"format-bluetooth-muted": "\uf6a9 {icon}\uf294 {format_source}",
|
||||
"format-muted": "\uf6a9 {format_source}",
|
||||
"format-source": "{volume}% \uf130",
|
||||
"format-source-muted": "\uf131",
|
||||
"format-icons": {
|
||||
"headphone": "\uf58f",
|
||||
"hands-free": "\uf590",
|
||||
"headset": "\uf590",
|
||||
"phone": "\uf3ce",
|
||||
"portable": "\uf3ce",
|
||||
"car": "\uf1b9",
|
||||
"default": ["\uf026", "\uf027", "\uf028 "]
|
||||
},
|
||||
"on-click": "pulsemixer --toggle-mute",
|
||||
"on-click-right": "pavucontrol",
|
||||
"scroll-step": 2
|
||||
},
|
||||
|
||||
|
||||
"temperature": {
|
||||
"critical-threshold": 70,
|
||||
"format": "{temperatureC}°C {icon}",
|
||||
"format-icons": ["\uf2cb", "\uf2c9", "\uf2c7"]
|
||||
},
|
||||
|
||||
|
||||
"tray": {
|
||||
"spacing": 10
|
||||
}
|
||||
|
||||
}
|
||||
50
config/waybar/round.css
Normal file
50
config/waybar/round.css
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
/*
|
||||
* ~/.config/waybar/round.css
|
||||
*
|
||||
* This stylesheet has round modules and titles.
|
||||
*/
|
||||
|
||||
window#waybar {
|
||||
color: @white;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.modules-left {
|
||||
background-color: @transparent-black;
|
||||
border-radius: 0 20px 20px 0;
|
||||
/* Coloured modules must hit the border! */
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.modules-center {
|
||||
background-color: @transparent-black;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.keep .modules-center {
|
||||
background-color: transparent;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.modules-right {
|
||||
background-color: @transparent-black;
|
||||
border-radius: 20px 0 0 20px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#workspaces button {
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
#workspaces button:hover,
|
||||
#workspaces button.focused {
|
||||
background-color: @accent;
|
||||
border-radius: 20px;
|
||||
color: @white;
|
||||
}
|
||||
|
||||
#custom-media {
|
||||
border-radius: 0 20px 20px 0;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
23
config/waybar/sharp.css
Normal file
23
config/waybar/sharp.css
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
/*
|
||||
* ~/.config/waybar/sharp.css
|
||||
*
|
||||
* This stylesheet is a take on a minimal layout.
|
||||
*/
|
||||
|
||||
window#waybar {
|
||||
color: @white;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#mode,
|
||||
.toggle .modules-left,
|
||||
.toggle .modules-right {
|
||||
background-color: @transparent-black;
|
||||
}
|
||||
|
||||
#mode,
|
||||
#workspaces button.focused,
|
||||
#workspaces button:hover {
|
||||
box-shadow: inset 0 2px #ffffff;
|
||||
}
|
||||
|
||||
|
|
@ -1,68 +1,54 @@
|
|||
/*
|
||||
* ~/.config/waybar/style.css
|
||||
* */
|
||||
*
|
||||
* `otf-font-awesome` is required to be installed for icons.
|
||||
*
|
||||
* Pick your stylesheet:
|
||||
* - sharp.css
|
||||
* - transparent.css
|
||||
* - round.css
|
||||
*/
|
||||
|
||||
* {
|
||||
/* `otf-font-awesome` is required to be installed for icons */
|
||||
font-family: Letter;
|
||||
font-size: 13px;
|
||||
}
|
||||
@define-color transparent-black rgba(23, 23, 23, 0.9);
|
||||
@define-color white #ecf0f1;
|
||||
@define-color warning-red #eb4d4b;
|
||||
@define-color accent #00897b;
|
||||
|
||||
window#waybar {
|
||||
color: #ffffff;
|
||||
background-color: transparent;
|
||||
font-family: Letter; /* This is my personal font. */
|
||||
font-size: 13px;
|
||||
transition-property: background-color;
|
||||
transition-duration: .5s;
|
||||
}
|
||||
|
||||
window#waybar.hidden {
|
||||
opacity: 0.2;
|
||||
#window, #workspaces {
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
#workspaces button {
|
||||
padding: 0 5px;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
min-width: 30px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
/* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */
|
||||
#workspaces button:hover, #workspaces button.focused, #mode {
|
||||
box-shadow: inset 0 2px #ffffff;
|
||||
|
||||
/* Keep this to prevent white overlay on hover */
|
||||
#workspaces button:hover,
|
||||
#workspaces button.focused {
|
||||
background-color: transparent;
|
||||
color: #ffffff;
|
||||
color: @white;
|
||||
}
|
||||
|
||||
#workspaces button.urgent {
|
||||
background-color: #eb4d4b;
|
||||
}
|
||||
|
||||
#clock,
|
||||
#battery,
|
||||
#cpu,
|
||||
#memory,
|
||||
#disk,
|
||||
#temperature,
|
||||
#backlight,
|
||||
#network,
|
||||
#pulseaudio,
|
||||
#custom-media,
|
||||
#tray,
|
||||
#mode,
|
||||
#idle_inhibitor,
|
||||
#mpd {
|
||||
padding: 0 10px;
|
||||
color: @white;
|
||||
background-color: @warning-red;
|
||||
}
|
||||
|
||||
/* All modules individually. */
|
||||
#backlight, #battery, #bluetooth, #clock, #cpu,
|
||||
#custom-media, #disk, #idle_inhibitor, #memory,
|
||||
#mode, #mpd, #network, #pulseaudio, #temperature,
|
||||
#tray {
|
||||
background-color: rgba(43, 48, 59, 0.95);
|
||||
}
|
||||
|
||||
#window,
|
||||
#workspaces {
|
||||
margin: 0 4px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
/* If workspaces is the leftmost module, omit left margin */
|
||||
|
|
@ -75,11 +61,6 @@ window#waybar.hidden {
|
|||
margin-right: 0;
|
||||
}
|
||||
|
||||
#battery.charging, #battery.plugged {
|
||||
color: #ffffff;
|
||||
background-color: #26A65B;
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
to {
|
||||
background-color: #ffffff;
|
||||
|
|
@ -87,6 +68,17 @@ window#waybar.hidden {
|
|||
}
|
||||
}
|
||||
|
||||
label:focus {
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
/* Module specific colours */
|
||||
|
||||
#battery.charging, #battery.plugged {
|
||||
color: #ffffff;
|
||||
background-color: #26A65B;
|
||||
}
|
||||
|
||||
#battery.critical:not(.charging) {
|
||||
background-color: #f53c3c;
|
||||
color: #ffffff;
|
||||
|
|
@ -97,17 +89,9 @@ window#waybar.hidden {
|
|||
animation-direction: alternate;
|
||||
}
|
||||
|
||||
label:focus {
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
#pulseaudio.muted {
|
||||
color: #171717; /* REPLACE */
|
||||
}
|
||||
|
||||
#custom-media {
|
||||
background-color: #66cc99;
|
||||
color: #2a5c45;
|
||||
background-color: #66cc99;
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
|
|
@ -123,6 +107,11 @@ label:focus {
|
|||
background-color: #eb4d4b;
|
||||
}
|
||||
|
||||
#idle_inhibitor.activated {
|
||||
background-color: #ecf0f1;
|
||||
color: #2d3436;
|
||||
}
|
||||
|
||||
#tray > .passive {
|
||||
-gtk-icon-effect: dim;
|
||||
}
|
||||
|
|
@ -132,8 +121,5 @@ label:focus {
|
|||
background-color: #eb4d4b;
|
||||
}
|
||||
|
||||
#idle_inhibitor.activated {
|
||||
background-color: #ecf0f1;
|
||||
color: #2d3436;
|
||||
}
|
||||
@import "transparent.css";
|
||||
|
||||
23
config/waybar/transparent.css
Normal file
23
config/waybar/transparent.css
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
/*
|
||||
* ~/.config/waybar/transparent.css
|
||||
*
|
||||
* This stylesheet is a minimalistic, transparent style.
|
||||
*/
|
||||
|
||||
@define-color transparent-black-light rgba(23, 23, 23, 0.5);
|
||||
|
||||
window#waybar {
|
||||
color: @white;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.toggle .modules-right {
|
||||
background-color: @transparent-black-light;
|
||||
}
|
||||
|
||||
#workspaces button:hover,
|
||||
#workspaces button.focused,
|
||||
#mode {
|
||||
box-shadow: inset 0 2px #ffffff;
|
||||
}
|
||||
|
||||
Loading…
Reference in a new issue