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 $right l
|
||||
|
||||
#set $term alacritty
|
||||
set $term foot
|
||||
|
||||
## Define outputs
|
||||
|
|
@ -22,25 +21,25 @@ set $disp3 DP-2
|
|||
|
||||
## Define Workspaces
|
||||
## nerdfonts cheat sheet: https://www.nerdfonts.com/cheat-sheet
|
||||
set $ws1 1:
|
||||
set $ws2 2:
|
||||
set $ws3 3:
|
||||
set $ws4 4:
|
||||
set $ws5 5:
|
||||
set $ws1 1:
|
||||
set $ws2 2:
|
||||
set $ws3 3:
|
||||
set $ws4 4:
|
||||
set $ws5 5:
|
||||
set $ws6 6:6
|
||||
set $ws7 7:7
|
||||
set $ws8 8:8
|
||||
set $ws9 9:9
|
||||
set $ws0 10:10
|
||||
set $wsF1 11:
|
||||
set $wsF2 12:
|
||||
set $wsF3 13:
|
||||
set $wsF1 11:
|
||||
set $wsF2 12:
|
||||
set $wsF3 13:
|
||||
set $wsF4 14:14
|
||||
set $wsF5 15:
|
||||
set $wsF6 16:
|
||||
set $wsF7 17:
|
||||
set $wsF5 15:
|
||||
set $wsF6 16:
|
||||
set $wsF7 17:
|
||||
set $wsF8 18:18
|
||||
set $wsF9 19:
|
||||
set $wsF9 19:
|
||||
set $wsF10 20:20
|
||||
set $wsF11 21:
|
||||
set $wsF12 22:
|
||||
set $wsF11 21:
|
||||
set $wsF12 22:
|
||||
|
|
|
|||
|
|
@ -1,146 +1,91 @@
|
|||
{
|
||||
"layer": "top",
|
||||
"position": "top",
|
||||
"height": 31,
|
||||
"layer": "top",
|
||||
"position": "top",
|
||||
"height": 31,
|
||||
|
||||
"modules-left": [
|
||||
"sway/mode",
|
||||
"sway/workspaces",
|
||||
"custom/arrowworkspaces",
|
||||
"sway/window"
|
||||
],
|
||||
"modules-left": [
|
||||
"sway/mode",
|
||||
"sway/workspaces",
|
||||
"sway/window"
|
||||
],
|
||||
|
||||
"modules-right": [
|
||||
"custom/arrowtray",
|
||||
"tray",
|
||||
"custom/arrowpackages",
|
||||
"custom/flatpak",
|
||||
"custom/packages",
|
||||
"custom/arrowcpu",
|
||||
"cpu",
|
||||
"custom/arrowmemory",
|
||||
"memory",
|
||||
"custom/arrowpulseaudio",
|
||||
"pulseaudio",
|
||||
"custom/arrowdate",
|
||||
"clock#date",
|
||||
"custom/arrowtime",
|
||||
"clock#time",
|
||||
],
|
||||
"modules-right": [
|
||||
"tray",
|
||||
"custom/flatpak",
|
||||
"custom/packages",
|
||||
"cpu",
|
||||
"memory",
|
||||
"pulseaudio",
|
||||
"clock",
|
||||
],
|
||||
|
||||
"sway/mode": {
|
||||
"format": "<span style='italic'> {}</span>",
|
||||
"tooltip": false,
|
||||
},
|
||||
"sway/workspaces": {
|
||||
"disable-scroll": true,
|
||||
"disable-click": true,
|
||||
"format-icons": {
|
||||
"urgent": "",
|
||||
"focused": "",
|
||||
"default": "",
|
||||
"sway/mode": {
|
||||
"format": " {}",
|
||||
},
|
||||
},
|
||||
"sway/window": {
|
||||
"format": "{}",
|
||||
"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/workspaces": {
|
||||
"disable-scroll": true,
|
||||
"disable-click": true,
|
||||
},
|
||||
},
|
||||
"memory": {
|
||||
"interval": 5,
|
||||
"format": " {}%",
|
||||
"tooltip": false,
|
||||
"states": {
|
||||
"warning": 70,
|
||||
"critical": 90
|
||||
"sway/window": {
|
||||
"format": "{}",
|
||||
"max-length": 50,
|
||||
},
|
||||
},
|
||||
"pulseaudio": {
|
||||
"format": "{volume}% {icon} {format_source}",
|
||||
"format-source": "{volume}%",
|
||||
"format-muted": " {format-source}",
|
||||
"format-icons": {
|
||||
"headphone": "",
|
||||
"hands-free": "",
|
||||
"headset": "",
|
||||
"phone": "",
|
||||
"portable": "",
|
||||
"default": ["", ""],
|
||||
"tray": {
|
||||
"icon-size": 22,
|
||||
"spacing": 5,
|
||||
},
|
||||
"clock": {
|
||||
"interval": 10,
|
||||
"format": "{:%a %e.%b.%Y %R}",
|
||||
},
|
||||
"cpu": {
|
||||
"interval": 5,
|
||||
"format": " {usage}%",
|
||||
"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;
|
||||
}
|
||||
|
||||
/* =============================================================================
|
||||
*
|
||||
* Waybar configuration
|
||||
*
|
||||
* Configuration reference: https://github.com/Alexays/Waybar/wiki/Configuration
|
||||
*
|
||||
* =========================================================================== */
|
||||
@define-color basecolor #f8f8f2;
|
||||
@define-color focused #8084a8;
|
||||
@define-color warning #fabd2f;
|
||||
@define-color critical #cc241d;
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
* Keyframes
|
||||
* -------------------------------------------------------------------------- */
|
||||
window#waybar {
|
||||
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 {
|
||||
70% {
|
||||
color: @light;
|
||||
color: @basecolor;
|
||||
}
|
||||
|
||||
to {
|
||||
color: @light;
|
||||
color: @basecolor;
|
||||
background-color: @warning;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes blink-critical {
|
||||
70% {
|
||||
color: @light;
|
||||
color: @basecolor;
|
||||
}
|
||||
|
||||
to {
|
||||
color: @light;
|
||||
color: @basecolor;
|
||||
background-color: @critical;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* -----------------------------------------------------------------------------
|
||||
* Styles
|
||||
* -------------------------------------------------------------------------- */
|
||||
|
||||
/* 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;
|
||||
/* -----------------------------------------------------
|
||||
* Workspaces
|
||||
* ----------------------------------------------------- */
|
||||
#workspaces {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
/* waybar v0.19.4 workarounds */
|
||||
button {
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
/* Avoid rounded borders under each button name */
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
#workspaces button.focused {
|
||||
background: @focused;
|
||||
}
|
||||
|
||||
/* The whole bar */
|
||||
#waybar {
|
||||
/*background: transparent;*/
|
||||
color: @light;
|
||||
font-family: Iosevka, Terminus, Siji;
|
||||
font-size: 10pt;
|
||||
/*font-weight: bold;*/
|
||||
#workspaces button:hover {
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
/* Each module */
|
||||
#battery,
|
||||
#clock,
|
||||
#cpu,
|
||||
#memory,
|
||||
#mode,
|
||||
#pulseaudio,
|
||||
#tray,
|
||||
#custom-packages,
|
||||
#custom-flatpak {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
/* -----------------------------------------------------
|
||||
* Tooltips
|
||||
* ----------------------------------------------------- */
|
||||
tooltip {
|
||||
background: #282a36;
|
||||
border: 1px solid #bd93f9;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* Each module that should blink */
|
||||
tooltip label {
|
||||
color: @basecolor;
|
||||
}
|
||||
|
||||
/* -----------------------------------------------------
|
||||
* Blinking modules
|
||||
* ----------------------------------------------------- */
|
||||
#mode,
|
||||
#memory {
|
||||
animation-timing-function: linear;
|
||||
|
|
@ -126,127 +76,45 @@ button {
|
|||
animation-direction: alternate;
|
||||
}
|
||||
|
||||
/* Each critical module */
|
||||
#memory.critical,
|
||||
#cpu.critical {
|
||||
color: @critical;
|
||||
}
|
||||
|
||||
/* Each critical that should blink */
|
||||
#mode,
|
||||
#memory.critical {
|
||||
animation-name: blink-critical;
|
||||
animation-duration: 2s;
|
||||
}
|
||||
|
||||
/* Each warning */
|
||||
#memory.warning,
|
||||
#cpu.warning {
|
||||
color: @warning;
|
||||
}
|
||||
|
||||
/* And now modules themselves in their respective order */
|
||||
|
||||
#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;
|
||||
margin-left: 40px;
|
||||
color: @basecolor;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
#pulseaudio {
|
||||
background: @sound;
|
||||
color: @dark;
|
||||
#custom-packages, #custom-flatpak {
|
||||
color: #ff79c6;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
#memory {
|
||||
background: @memory;
|
||||
color: @dark;
|
||||
#memory, #cpu {
|
||||
color: #8be9fd;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
#cpu {
|
||||
background: @cpu;
|
||||
color: @dark;
|
||||
#clock {
|
||||
color: #50fa7b;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
#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