feat(waybar): Give waybar a new look and simplify modules
This commit is contained in:
parent
98171e211b
commit
5d8df44e7c
SSH key fingerprint:
SHA256:6a6N2Wzk73nwURUHC/ubbCyqdB6yfie0Jv/NGvRcsIE
3 changed files with 155 additions and 343 deletions
|
|
@ -12,7 +12,6 @@ set $down j
|
||||||
set $up k
|
set $up k
|
||||||
set $right l
|
set $right l
|
||||||
|
|
||||||
#set $term alacritty
|
|
||||||
set $term foot
|
set $term foot
|
||||||
|
|
||||||
## Define outputs
|
## Define outputs
|
||||||
|
|
@ -22,25 +21,25 @@ set $disp3 DP-2
|
||||||
|
|
||||||
## Define Workspaces
|
## Define Workspaces
|
||||||
## nerdfonts cheat sheet: https://www.nerdfonts.com/cheat-sheet
|
## nerdfonts cheat sheet: https://www.nerdfonts.com/cheat-sheet
|
||||||
set $ws1 1:
|
set $ws1 1:
|
||||||
set $ws2 2:
|
set $ws2 2:
|
||||||
set $ws3 3:
|
set $ws3 3:
|
||||||
set $ws4 4:
|
set $ws4 4:
|
||||||
set $ws5 5:
|
set $ws5 5:
|
||||||
set $ws6 6:6
|
set $ws6 6:6
|
||||||
set $ws7 7:7
|
set $ws7 7:7
|
||||||
set $ws8 8:8
|
set $ws8 8:8
|
||||||
set $ws9 9:9
|
set $ws9 9:9
|
||||||
set $ws0 10:10
|
set $ws0 10:10
|
||||||
set $wsF1 11:
|
set $wsF1 11:
|
||||||
set $wsF2 12:
|
set $wsF2 12:
|
||||||
set $wsF3 13:
|
set $wsF3 13:
|
||||||
set $wsF4 14:14
|
set $wsF4 14:14
|
||||||
set $wsF5 15:
|
set $wsF5 15:
|
||||||
set $wsF6 16:
|
set $wsF6 16:
|
||||||
set $wsF7 17:
|
set $wsF7 17:
|
||||||
set $wsF8 18:18
|
set $wsF8 18:18
|
||||||
set $wsF9 19:
|
set $wsF9 19:
|
||||||
set $wsF10 20:20
|
set $wsF10 20:20
|
||||||
set $wsF11 21:
|
set $wsF11 21:
|
||||||
set $wsF12 22:
|
set $wsF12 22:
|
||||||
|
|
|
||||||
|
|
@ -1,146 +1,91 @@
|
||||||
{
|
{
|
||||||
"layer": "top",
|
"layer": "top",
|
||||||
"position": "top",
|
"position": "top",
|
||||||
"height": 31,
|
"height": 31,
|
||||||
|
|
||||||
"modules-left": [
|
"modules-left": [
|
||||||
"sway/mode",
|
"sway/mode",
|
||||||
"sway/workspaces",
|
"sway/workspaces",
|
||||||
"custom/arrowworkspaces",
|
"sway/window"
|
||||||
"sway/window"
|
],
|
||||||
],
|
|
||||||
|
|
||||||
"modules-right": [
|
"modules-right": [
|
||||||
"custom/arrowtray",
|
"tray",
|
||||||
"tray",
|
"custom/flatpak",
|
||||||
"custom/arrowpackages",
|
"custom/packages",
|
||||||
"custom/flatpak",
|
"cpu",
|
||||||
"custom/packages",
|
"memory",
|
||||||
"custom/arrowcpu",
|
"pulseaudio",
|
||||||
"cpu",
|
"clock",
|
||||||
"custom/arrowmemory",
|
],
|
||||||
"memory",
|
|
||||||
"custom/arrowpulseaudio",
|
|
||||||
"pulseaudio",
|
|
||||||
"custom/arrowdate",
|
|
||||||
"clock#date",
|
|
||||||
"custom/arrowtime",
|
|
||||||
"clock#time",
|
|
||||||
],
|
|
||||||
|
|
||||||
"sway/mode": {
|
"sway/mode": {
|
||||||
"format": "<span style='italic'> {}</span>",
|
"format": " {}",
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
"sway/workspaces": {
|
|
||||||
"disable-scroll": true,
|
|
||||||
"disable-click": true,
|
|
||||||
"format-icons": {
|
|
||||||
"urgent": "",
|
|
||||||
"focused": "",
|
|
||||||
"default": "",
|
|
||||||
},
|
},
|
||||||
},
|
"sway/workspaces": {
|
||||||
"sway/window": {
|
"disable-scroll": true,
|
||||||
"format": "{}",
|
"disable-click": true,
|
||||||
"max-length": 50,
|
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
"tray": {
|
|
||||||
"icon-size": 22,
|
|
||||||
"spacing": 10,
|
|
||||||
},
|
|
||||||
"clock#date": {
|
|
||||||
"interval": 60,
|
|
||||||
"format": "{:%a %e.%b.%Y}",
|
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
"clock#time": {
|
|
||||||
"interval": 10,
|
|
||||||
"format": "{:%R}",
|
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
"cpu": {
|
|
||||||
"interval": 5,
|
|
||||||
"format": " {usage}%",
|
|
||||||
"tooltip": false,
|
|
||||||
"states": {
|
|
||||||
"warning": 70,
|
|
||||||
"critical": 90
|
|
||||||
},
|
},
|
||||||
},
|
"sway/window": {
|
||||||
"memory": {
|
"format": "{}",
|
||||||
"interval": 5,
|
"max-length": 50,
|
||||||
"format": " {}%",
|
|
||||||
"tooltip": false,
|
|
||||||
"states": {
|
|
||||||
"warning": 70,
|
|
||||||
"critical": 90
|
|
||||||
},
|
},
|
||||||
},
|
"tray": {
|
||||||
"pulseaudio": {
|
"icon-size": 22,
|
||||||
"format": "{volume}% {icon} {format_source}",
|
"spacing": 5,
|
||||||
"format-source": "{volume}%",
|
},
|
||||||
"format-muted": " {format-source}",
|
"clock": {
|
||||||
"format-icons": {
|
"interval": 10,
|
||||||
"headphone": "",
|
"format": "{:%a %e.%b.%Y %R}",
|
||||||
"hands-free": "",
|
},
|
||||||
"headset": "",
|
"cpu": {
|
||||||
"phone": "",
|
"interval": 5,
|
||||||
"portable": "",
|
"format": " {usage}%",
|
||||||
"default": ["", ""],
|
"tooltip": false,
|
||||||
|
"states": {
|
||||||
|
"warning": 70,
|
||||||
|
"critical": 90
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"memory": {
|
||||||
|
"interval": 5,
|
||||||
|
"format": " {}%",
|
||||||
|
"tooltip": false,
|
||||||
|
"states": {
|
||||||
|
"warning": 70,
|
||||||
|
"critical": 90
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"pulseaudio": {
|
||||||
|
"format": "{volume}% {icon} {format_source}",
|
||||||
|
"format-source": "{volume}%",
|
||||||
|
"format-muted": " {format-source}",
|
||||||
|
"format-icons": {
|
||||||
|
"headphone": "",
|
||||||
|
"hands-free": "",
|
||||||
|
"headset": "",
|
||||||
|
"phone": "",
|
||||||
|
"portable": "",
|
||||||
|
"default": ["", ""],
|
||||||
|
},
|
||||||
|
"tooltip": false,
|
||||||
|
},
|
||||||
|
"custom/packages": {
|
||||||
|
"format": " {}",
|
||||||
|
"interval": 3600,
|
||||||
|
"exec": "checkupdates | wc -l",
|
||||||
|
"exec-if": "exit 0",
|
||||||
|
"on-click": "exit 0",
|
||||||
|
"signal": 8,
|
||||||
|
"tooltip": false,
|
||||||
|
},
|
||||||
|
"custom/flatpak": {
|
||||||
|
"format": " {}",
|
||||||
|
"interval": 3600,
|
||||||
|
"exec": "flatpak remote-ls --updates | wc -l",
|
||||||
|
"exec-if": "exit 0",
|
||||||
|
"on-click": "exit 0",
|
||||||
|
"signal": 8,
|
||||||
|
"tooltip": false,
|
||||||
},
|
},
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
"custom/packages": {
|
|
||||||
"format": " {}",
|
|
||||||
"interval": 3600,
|
|
||||||
"exec": "checkupdates | wc -l",
|
|
||||||
"exec-if": "exit 0",
|
|
||||||
"on-click": "exit 0",
|
|
||||||
"signal": 8,
|
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
"custom/flatpak": {
|
|
||||||
"format": " {}",
|
|
||||||
"interval": 3600,
|
|
||||||
"exec": "flatpak remote-ls --updates | wc -l",
|
|
||||||
"exec-if": "exit 0",
|
|
||||||
"on-click": "exit 0",
|
|
||||||
"signal": 8,
|
|
||||||
"tooltip": false,
|
|
||||||
},
|
|
||||||
|
|
||||||
"custom/arrowtime": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowdate": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowpulseaudio": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowmemory": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowcpu": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowpackages": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowtray": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
"custom/arrowworkspaces": {
|
|
||||||
"format": "",
|
|
||||||
"tooltip": false
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,124 +1,74 @@
|
||||||
/*
|
/* -----------------------------------------------------
|
||||||
* Ref.: https://git.sr.ht/~begs/dotfiles/tree/1c92a56187a56c8531f04dea17c5f96acd9e49c4/item/.config/waybar/style.css
|
* General
|
||||||
*/
|
* ----------------------------------------------------- */
|
||||||
|
* {
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: JetBrainsMono Nerd Font;
|
||||||
|
}
|
||||||
|
|
||||||
/* =============================================================================
|
@define-color basecolor #f8f8f2;
|
||||||
*
|
@define-color focused #8084a8;
|
||||||
* Waybar configuration
|
@define-color warning #fabd2f;
|
||||||
*
|
@define-color critical #cc241d;
|
||||||
* Configuration reference: https://github.com/Alexays/Waybar/wiki/Configuration
|
|
||||||
*
|
|
||||||
* =========================================================================== */
|
|
||||||
|
|
||||||
/* -----------------------------------------------------------------------------
|
window#waybar {
|
||||||
* Keyframes
|
background-color: rgba(40, 42, 54, 0.4);
|
||||||
* -------------------------------------------------------------------------- */
|
border-bottom: 1px solid rgba(40, 42, 55, 0.1);
|
||||||
|
border-radius: 0px;
|
||||||
|
color: @basecolor;
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes blink-warning {
|
@keyframes blink-warning {
|
||||||
70% {
|
70% {
|
||||||
color: @light;
|
color: @basecolor;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
color: @light;
|
color: @basecolor;
|
||||||
background-color: @warning;
|
background-color: @warning;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes blink-critical {
|
@keyframes blink-critical {
|
||||||
70% {
|
70% {
|
||||||
color: @light;
|
color: @basecolor;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
color: @light;
|
color: @basecolor;
|
||||||
background-color: @critical;
|
background-color: @critical;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* -----------------------------------------------------
|
||||||
/* -----------------------------------------------------------------------------
|
* Workspaces
|
||||||
* Styles
|
* ----------------------------------------------------- */
|
||||||
* -------------------------------------------------------------------------- */
|
#workspaces {
|
||||||
|
background-color: inherit;
|
||||||
/* COLORS */
|
|
||||||
|
|
||||||
/* Nord */
|
|
||||||
/*@define-color light #eceff4;
|
|
||||||
@define-color dark #2e3440;
|
|
||||||
@define-color warning #ebcb8b;
|
|
||||||
@define-color critical #d08770;
|
|
||||||
@define-color mode #4c566a;
|
|
||||||
@define-color workspaces #5e81ac;
|
|
||||||
@define-color workspacesfocused #81a1c1;
|
|
||||||
@define-color sound #d8dee9;
|
|
||||||
@define-color memory #88c0d0;
|
|
||||||
@define-color cpu #434c5e;
|
|
||||||
@define-color temp #d8dee9;
|
|
||||||
@define-color layout #5e81ac;
|
|
||||||
@define-color battery #88c0d0;
|
|
||||||
@define-color date #2e3440;
|
|
||||||
@define-color time #eceff4;*/
|
|
||||||
|
|
||||||
/* Gruvbox */
|
|
||||||
@define-color light #ebdbb2;
|
|
||||||
@define-color dark #282828;
|
|
||||||
@define-color warning #fabd2f;
|
|
||||||
@define-color critical #cc241d;
|
|
||||||
@define-color mode #a89984;
|
|
||||||
@define-color workspaces #458588;
|
|
||||||
@define-color workspacesfocused #83a598;
|
|
||||||
@define-color sound #d3869b;
|
|
||||||
@define-color memory #8ec07c;
|
|
||||||
@define-color cpu #98971a;
|
|
||||||
@define-color packages #b8bb26;
|
|
||||||
@define-color layout #689d6a;
|
|
||||||
@define-color tray #282828;
|
|
||||||
@define-color date #282828;
|
|
||||||
@define-color time #ebdbb2;
|
|
||||||
|
|
||||||
/* Reset all styles */
|
|
||||||
* {
|
|
||||||
border: none;
|
|
||||||
border-radius: 0;
|
|
||||||
min-height: 0;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* waybar v0.19.4 workarounds */
|
#workspaces button.focused {
|
||||||
button {
|
background: @focused;
|
||||||
box-shadow: none;
|
|
||||||
text-shadow: none;
|
|
||||||
/* Avoid rounded borders under each button name */
|
|
||||||
border: none;
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* The whole bar */
|
#workspaces button:hover {
|
||||||
#waybar {
|
background: inherit;
|
||||||
/*background: transparent;*/
|
|
||||||
color: @light;
|
|
||||||
font-family: Iosevka, Terminus, Siji;
|
|
||||||
font-size: 10pt;
|
|
||||||
/*font-weight: bold;*/
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Each module */
|
/* -----------------------------------------------------
|
||||||
#battery,
|
* Tooltips
|
||||||
#clock,
|
* ----------------------------------------------------- */
|
||||||
#cpu,
|
tooltip {
|
||||||
#memory,
|
background: #282a36;
|
||||||
#mode,
|
border: 1px solid #bd93f9;
|
||||||
#pulseaudio,
|
border-radius: 10px;
|
||||||
#tray,
|
|
||||||
#custom-packages,
|
|
||||||
#custom-flatpak {
|
|
||||||
padding-left: 10px;
|
|
||||||
padding-right: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Each module that should blink */
|
tooltip label {
|
||||||
|
color: @basecolor;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* -----------------------------------------------------
|
||||||
|
* Blinking modules
|
||||||
|
* ----------------------------------------------------- */
|
||||||
#mode,
|
#mode,
|
||||||
#memory {
|
#memory {
|
||||||
animation-timing-function: linear;
|
animation-timing-function: linear;
|
||||||
|
|
@ -126,127 +76,45 @@ button {
|
||||||
animation-direction: alternate;
|
animation-direction: alternate;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Each critical module */
|
|
||||||
#memory.critical,
|
#memory.critical,
|
||||||
#cpu.critical {
|
#cpu.critical {
|
||||||
color: @critical;
|
color: @critical;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Each critical that should blink */
|
|
||||||
#mode,
|
#mode,
|
||||||
#memory.critical {
|
#memory.critical {
|
||||||
animation-name: blink-critical;
|
animation-name: blink-critical;
|
||||||
animation-duration: 2s;
|
animation-duration: 2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Each warning */
|
|
||||||
#memory.warning,
|
#memory.warning,
|
||||||
#cpu.warning {
|
#cpu.warning {
|
||||||
color: @warning;
|
color: @warning;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* And now modules themselves in their respective order */
|
/* -----------------------------------------------------
|
||||||
|
* Window
|
||||||
#mode { /* Shown current Sway mode (resize etc.) */
|
* ----------------------------------------------------- */
|
||||||
color: @light;
|
|
||||||
background: @mode;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Workspaces stuff */
|
|
||||||
#workspaces button {
|
|
||||||
padding-left: 4px;
|
|
||||||
padding-right: 4px;
|
|
||||||
color: @dark;
|
|
||||||
background: @workspaces;
|
|
||||||
}
|
|
||||||
|
|
||||||
#workspaces button.focused {
|
|
||||||
background: @workspacesfocused;
|
|
||||||
}
|
|
||||||
|
|
||||||
#window {
|
#window {
|
||||||
margin-right: 40px;
|
color: @basecolor;
|
||||||
margin-left: 40px;
|
padding: 4px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#pulseaudio {
|
#custom-packages, #custom-flatpak {
|
||||||
background: @sound;
|
color: #ff79c6;
|
||||||
color: @dark;
|
padding: 4px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#memory {
|
#memory, #cpu {
|
||||||
background: @memory;
|
color: #8be9fd;
|
||||||
color: @dark;
|
padding: 4px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#cpu {
|
#clock {
|
||||||
background: @cpu;
|
color: #50fa7b;
|
||||||
color: @dark;
|
padding: 4px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#tray {
|
#tray {
|
||||||
background: @tray;
|
padding: 2px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#clock.date {
|
|
||||||
background: @date;
|
|
||||||
color: @light;
|
|
||||||
}
|
|
||||||
|
|
||||||
#clock.time {
|
|
||||||
background: @time;
|
|
||||||
color: @dark;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-packages,
|
|
||||||
#custom-flatpak {
|
|
||||||
background: @packages;
|
|
||||||
color: @dark;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowtray {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @tray;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowpackages {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @packages;
|
|
||||||
background: @tray;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowcpu {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @cpu;
|
|
||||||
background: @packages;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowmemory {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @memory;
|
|
||||||
background: @cpu;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowpulseaudio {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @sound;
|
|
||||||
background: @memory;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowdate {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @date;
|
|
||||||
background: @sound;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowtime {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @time;
|
|
||||||
background: @date;
|
|
||||||
}
|
|
||||||
|
|
||||||
#custom-arrowworkspaces {
|
|
||||||
font-size: 24px;
|
|
||||||
color: @workspaces;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue