├── README.md ├── screenshot ├── postRiver.png ├── sway2.png ├── swayPost.png ├── swbar.png ├── wayfire2.png └── wayfire_easyL.png └── waybar-examples ├── river ├── config-river └── river_style.css ├── sway ├── config-sway └── sway_style.css ├── sway2 ├── config-sway └── sway_style.css ├── sway3 ├── config-sway └── sway_style.css ├── wayfire ├── config-wayfire ├── layout2 │ ├── config-wayfire │ └── style.css └── style.css └── wayfire2 ├── config-wayfire └── style.css /README.md: -------------------------------------------------------------------------------- 1 | # waybar-examples 2 | Waybar layouts for Peux OS 3 | 4 | ## Screenshots 5 | 6 | River-1 7 | ![Screenshot](https://github.com/DN-debug/waybar-examples/blob/main/screenshot/postRiver.png) 8 | 9 | Sway-1 10 | ![Screenshot](https://github.com/DN-debug/waybar-examples/blob/main/screenshot/swayPost.png) 11 | 12 | Sway-2 13 | ![Screenshot](https://github.com/DN-debug/waybar-examples/blob/main/screenshot/sway2.png) 14 | 15 | Sway-3 16 | ![Screenshot](https://github.com/DN-debug/waybar-examples/blob/main/screenshot/swbar.png) 17 | 18 | Wayfire-1 19 | ![Screenshot](https://github.com/DN-debug/waybar-examples/blob/main/screenshot/wayfire_easyL.png) 20 | 21 | Wayfire-2 22 | ![Screenshot](https://github.com/DN-debug/waybar-examples/blob/main/screenshot/wayfire2.png) 23 | -------------------------------------------------------------------------------- /screenshot/postRiver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DN-debug/waybar-examples/34a430fc8c82fd34c4bab150170d52c667336416/screenshot/postRiver.png -------------------------------------------------------------------------------- /screenshot/sway2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DN-debug/waybar-examples/34a430fc8c82fd34c4bab150170d52c667336416/screenshot/sway2.png -------------------------------------------------------------------------------- /screenshot/swayPost.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DN-debug/waybar-examples/34a430fc8c82fd34c4bab150170d52c667336416/screenshot/swayPost.png -------------------------------------------------------------------------------- /screenshot/swbar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DN-debug/waybar-examples/34a430fc8c82fd34c4bab150170d52c667336416/screenshot/swbar.png -------------------------------------------------------------------------------- /screenshot/wayfire2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DN-debug/waybar-examples/34a430fc8c82fd34c4bab150170d52c667336416/screenshot/wayfire2.png -------------------------------------------------------------------------------- /screenshot/wayfire_easyL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DN-debug/waybar-examples/34a430fc8c82fd34c4bab150170d52c667336416/screenshot/wayfire_easyL.png -------------------------------------------------------------------------------- /waybar-examples/river/config-river: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 4, 6 | "margin-top": 5, 7 | "margin-bottom":5, 8 | 9 | // Choose the order of the modules 10 | 11 | "modules-left":[ "custom/launcher", "custom/media", "tray"], 12 | "modules-center":[ "idle_inhibitor", "custom/updater", "custom/snip", "custom/wallpaper", "pulseaudio", "cpu", "memory", "temperature", "backlight", "keyboard-state", "battery", "battery#bat2", "network", "clock"], 13 | "modules-right":["river/tags","custom/power"], 14 | 15 | // Modules configuration 16 | 17 | "river/tags": { 18 | "num-tags": 5, 19 | }, 20 | "keyboard-state": { 21 | "numlock": true, 22 | "capslock": true, 23 | "format": " {name} {icon}", 24 | "format-icons": { 25 | "locked": "", 26 | "unlocked": "" 27 | } 28 | }, 29 | "idle_inhibitor": { 30 | "format": "{icon}", 31 | "format-icons": { 32 | "activated": "", 33 | "deactivated": "" 34 | } 35 | }, 36 | "tray": { 37 | "icon-size": 20, 38 | "spacing": 10 39 | }, 40 | "clock": { 41 | // "timezone": "America/New_York", 42 | "tooltip-format": "{:%Y %B}\n{calendar}", 43 | "format-alt": "{:%Y-%m-%d}" 44 | }, 45 | "cpu": { 46 | "format": "{usage}% ", 47 | "tooltip": false 48 | }, 49 | "memory": { 50 | "format": "{}% " 51 | }, 52 | "temperature": { 53 | // "thermal-zone": 2, 54 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 55 | "critical-threshold": 80, 56 | // "format-critical": "{temperatureC}°C {icon}", 57 | "format": "{temperatureC}°C {icon}", 58 | "format-icons": ["", "", ""] 59 | }, 60 | "backlight": { 61 | // "device": "acpi_video1", 62 | "format": "{percent}% {icon}", 63 | "format-icons": ["", ""] 64 | }, 65 | "battery": { 66 | "states": { 67 | // "good": 95, 68 | "warning": 30, 69 | "critical": 15 70 | }, 71 | "format": "{capacity}% {icon}", 72 | "format-charging": "{capacity}% ", 73 | "format-plugged": "{capacity}% ", 74 | "format-alt": "{time} {icon}", 75 | // "format-good": "", // An empty format will hide the module 76 | // "format-full": "", 77 | "format-icons": ["", "", "", "", ""] 78 | }, 79 | "battery#bat2": { 80 | "bat": "BAT2" 81 | }, 82 | "network": { 83 | // "interface": "wlp2*", // (Optional) To force the use of this interface 84 | "format-wifi": "{essid} ({signalStrength}%) ", 85 | "format-ethernet": "Connected  ", 86 | "tooltip-format": "{ifname} via {gwaddr} ", 87 | "format-linked": "{ifname} (No IP) ", 88 | "format-disconnected": "Disconnected ⚠", 89 | "format-alt": "{ifname}: {ipaddr}/{cidr}", 90 | "on-click-right": "bash ~/.config/rofi/wifi_menu/rofi_wifi_menu" 91 | }, 92 | "pulseaudio": { 93 | // "scroll-step": 1, // %, can be a float 94 | "format": "{volume}% {icon}", 95 | "format-bluetooth": "{volume}% {icon}", 96 | "format-bluetooth-muted": "{icon} {format_source}", 97 | "format-muted": "{format_source}", 98 | "format-source": "", 99 | "format-source-muted": "", 100 | "format-icons": { 101 | "headphone": "", 102 | "hands-free": "", 103 | "headset": "", 104 | "phone": "", 105 | "portable": "", 106 | "car": "", 107 | "default": ["", "", ""] 108 | }, 109 | "on-click": "pavucontrol" 110 | }, 111 | "custom/media": { 112 | "format": "{icon} {}", 113 | "return-type": "json", 114 | "max-length": 20, 115 | "format-icons": { 116 | "spotify": " ", 117 | "default": " " 118 | }, 119 | "escape": true, 120 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 121 | "on-click": "playerctl play-pause" 122 | }, 123 | "custom/launcher":{ 124 | "format": "", 125 | "on-click": "wofi --show drun", 126 | "on-click-right": "killall wofi" 127 | }, 128 | "custom/power":{ 129 | "format": " ", 130 | "on-click": "nwg-bar", 131 | "on-click-right": "killall nwg-bar" 132 | }, 133 | "custom/updater":{ 134 | "format": " {} Update(s)", 135 | "exec": "checkupdates | wc -l", 136 | "exec-if": "[[ $(checkupdates | wc -l) != 0 ]]", 137 | "interval": 15, 138 | "on-click": "alacritty -e yay -Syu && notify-send 'The system has been updated' " 139 | }, 140 | "custom/snip":{ 141 | "format": " ", 142 | "on-click": "grimshot --notify save area $HOME/Pictures/$(zenity --entry --text 'Set filename:' --entry-text '.png')" 143 | }, 144 | "custom/wallpaper":{ 145 | "format":" ", 146 | "on-click": "bash ~/.config/system_scripts/pkill_bc" 147 | } 148 | } 149 | 150 | -------------------------------------------------------------------------------- /waybar-examples/river/river_style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | /* `otf-font-awesome` is required to be installed for icons */ 5 | font-family: Roboto, Helvetica, Arial, sans-serif; 6 | font-size: 13px; 7 | min-height: 0; 8 | } 9 | 10 | window#waybar { 11 | background-color: transparent; 12 | color: #ffffff; 13 | transition-property: background-color; 14 | transition-duration: .5s; 15 | } 16 | 17 | window#waybar.hidden { 18 | opacity: 0.2; 19 | } 20 | 21 | 22 | #workspaces button { 23 | background: #1f1f1f; 24 | color: #ffffff; 25 | border-radius: 20px; 26 | 27 | } 28 | 29 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 30 | #workspaces button:hover { 31 | background: lightblue; 32 | color: black; 33 | border-bottom: 3px solid #ffffff; 34 | 35 | } 36 | 37 | #workspaces button.focused { 38 | background: #1f1f1f; 39 | } 40 | 41 | #workspaces button.focused:hover { 42 | background: lightblue; 43 | color: black; 44 | border-bottom: 3px solid #ffffff; 45 | 46 | } 47 | 48 | #workspaces button.urgent { 49 | background-color: #eb4d4b; 50 | } 51 | 52 | #mode { 53 | background-color: #64727D; 54 | border-bottom: 3px solid #ffffff; 55 | } 56 | 57 | #clock, 58 | #battery, 59 | #cpu, 60 | #memory, 61 | #disk, 62 | #temperature, 63 | #backlight, 64 | #network, 65 | #pulseaudio, 66 | #custom-media, 67 | #custom-launcher, 68 | #custom-power, 69 | #custom-layout, 70 | #custom-updater, 71 | #custom-snip, 72 | #custom-wallpaper, 73 | #tags, 74 | #taskbar, 75 | #tray, 76 | #mode, 77 | #idle_inhibitor, 78 | #mpd { 79 | padding: 0 10px; 80 | color: #ffffff; 81 | } 82 | 83 | #window, 84 | #workspaces { 85 | margin: 0px 4px; 86 | } 87 | 88 | /* If workspaces is the leftmost module, omit left margin */ 89 | .modules-left > widget:first-child > #workspaces { 90 | margin-left: 0px; 91 | } 92 | 93 | /* If workspaces is the rightmost module, omit right margin */ 94 | .modules-right > widget:last-child > #workspaces { 95 | margin-right: 0px; 96 | } 97 | 98 | #clock { 99 | background-color: #171717; 100 | color: #ffffff; 101 | } 102 | 103 | #battery { 104 | background-color: #ffffff; 105 | color: #000000; 106 | } 107 | 108 | #battery.charging, #battery.plugged { 109 | color: #ffffff; 110 | background-color: #26A65B; 111 | } 112 | 113 | @keyframes blink { 114 | to { 115 | background-color: #ffffff; 116 | color: #000000; 117 | } 118 | } 119 | 120 | #battery.critical:not(.charging) { 121 | background-color: #f53c3c; 122 | color: #ffffff; 123 | animation-name: blink; 124 | animation-duration: 0.5s; 125 | animation-timing-function: linear; 126 | animation-iteration-count: infinite; 127 | animation-direction: alternate; 128 | } 129 | 130 | label:focus { 131 | background-color: #000000; 132 | } 133 | 134 | #cpu { 135 | background-color: #171717; 136 | color: #ffffff; 137 | } 138 | 139 | #memory { 140 | background-color: #171717; 141 | color: #ffffff; 142 | } 143 | 144 | #disk { 145 | background-color: #171717; 146 | color: #ffffff; 147 | } 148 | 149 | #backlight { 150 | background-color: #90b1b1; 151 | } 152 | 153 | #network { 154 | background-color: #171717; 155 | color: #ffffff; 156 | } 157 | 158 | #network.disconnected { 159 | background-color: #171717; 160 | color: red; 161 | } 162 | 163 | #pulseaudio { 164 | background-color: #171717; 165 | color: #ffffff; 166 | } 167 | 168 | #pulseaudio.muted { 169 | background-color: #171717; 170 | color: red; 171 | } 172 | 173 | #custom-media { 174 | background-color: #171717; 175 | color: white; 176 | } 177 | 178 | #custom-media.custom-spotify { 179 | background-color: #171717; 180 | color: white; 181 | 182 | } 183 | 184 | #custom-media.custom-vlc { 185 | background-color: #171717; 186 | color: white; 187 | } 188 | 189 | #custom-power{ 190 | background-color: #171717; 191 | font-size: 18px; 192 | margin-right: 5px; 193 | 194 | } 195 | 196 | #custom-launcher{ 197 | background-color: #171717; 198 | font-size: 20px; 199 | margin-left: 5px; 200 | 201 | } 202 | 203 | #custom-layout{ 204 | background-color: #171717; 205 | color: white; 206 | font-size:20px; 207 | } 208 | 209 | #custom-updater { 210 | background-color: #171717; 211 | color: white; 212 | } 213 | 214 | #custom-snip { 215 | background-color: #171717; 216 | color: skyblue; 217 | font-size: 20px; 218 | } 219 | 220 | #custom-wallpaper { 221 | background-color: #171717; 222 | color: pink; 223 | font-size: 20px; 224 | } 225 | 226 | #tags{ 227 | background-color: #171717; 228 | font-size: 20px; 229 | } 230 | 231 | #tags button.occupied { 232 | color: skyblue; 233 | margin: 5px; 234 | background-color: #272727; 235 | } 236 | #tags button.focused { 237 | color: black; 238 | margin: 5px; 239 | background-color: white; 240 | } 241 | #tags button.urgent{ 242 | color: red; 243 | margin: 5px; 244 | background-color:white; 245 | } 246 | 247 | 248 | #taskbar{ 249 | background-color: #171717; 250 | border-radius: 0px 20px 20px 0px; 251 | } 252 | 253 | #temperature { 254 | background-color: #171717; 255 | color: #ffffff; 256 | } 257 | 258 | #temperature.critical { 259 | background-color: #eb4d4b; 260 | } 261 | 262 | #tray { 263 | background-color: #171717; 264 | color: #ffffff; 265 | } 266 | 267 | #tray > .passive { 268 | -gtk-icon-effect: dim; 269 | background-color: #171717; 270 | color: #ffffff; 271 | } 272 | 273 | #tray > .needs-attention { 274 | -gtk-icon-effect: highlight; 275 | background-color: #171717; 276 | color: #ffffff; 277 | } 278 | 279 | #idle_inhibitor { 280 | background-color: #171717; 281 | border-radius: 20px 0px 0px 20px; 282 | 283 | } 284 | 285 | #idle_inhibitor.activated { 286 | background-color: #171717; 287 | color: #ffffff; 288 | border-radius: 20px 0px 0px 20px; 289 | 290 | } 291 | 292 | #language { 293 | background-color: #171717; 294 | color: #ffffff; 295 | min-width: 16px; 296 | } 297 | 298 | #keyboard-state { 299 | background: #97e1ad; 300 | color: #000000; 301 | min-width: 16px; 302 | } 303 | 304 | #keyboard-state > label { 305 | padding: 0px 5px; 306 | } 307 | 308 | #keyboard-state > label.locked { 309 | background: rgba(0, 0, 0, 0.2); 310 | } 311 | -------------------------------------------------------------------------------- /waybar-examples/sway/config-sway: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 4, 6 | "margin-top": 5, 7 | "margin-bottom": 10, 8 | 9 | // Choose the order of the modules 10 | 11 | "modules-center": ["custom/launcher", "sway/workspaces", "custom/media", "idle_inhibitor", "custom/updater", "pulseaudio", "network", "cpu", "memory", "temperature", "backlight", "keyboard-state", "sway/language", "battery", "battery#bat2", "tray", "clock", "custom/power"], 12 | 13 | // Modules configuration 14 | 15 | "sway/workspaces": { 16 | "disable-scroll": true, 17 | "all-outputs": false, 18 | "format": "{name}" 19 | }, 20 | "keyboard-state": { 21 | "numlock": true, 22 | "capslock": true, 23 | "format": " {name} {icon}", 24 | "format-icons": { 25 | "locked": "", 26 | "unlocked": "" 27 | } 28 | }, 29 | "sway/mode": { 30 | "format": "{}" 31 | }, 32 | "idle_inhibitor": { 33 | "format": "{icon}", 34 | "format-icons": { 35 | "activated": "", 36 | "deactivated": "" 37 | } 38 | }, 39 | "tray": { 40 | "icon-size": 20, 41 | "spacing": 10 42 | }, 43 | "clock": { 44 | // "timezone": "America/New_York", 45 | "tooltip-format": "{:%Y %B}\n{calendar}", 46 | "format-alt": "{:%Y-%m-%d}" 47 | }, 48 | "cpu": { 49 | "format": "{usage}% ", 50 | "tooltip": false 51 | }, 52 | "memory": { 53 | "format": "{}% " 54 | }, 55 | "temperature": { 56 | // "thermal-zone": 2, 57 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 58 | "critical-threshold": 80, 59 | // "format-critical": "{temperatureC}°C {icon}", 60 | "format": "{temperatureC}°C {icon}", 61 | "format-icons": ["", "", ""] 62 | }, 63 | "backlight": { 64 | // "device": "acpi_video1", 65 | "format": "{percent}% {icon}", 66 | "format-icons": ["", ""] 67 | }, 68 | "battery": { 69 | "states": { 70 | // "good": 95, 71 | "warning": 30, 72 | "critical": 15 73 | }, 74 | "format": "{capacity}% {icon}", 75 | "format-charging": "{capacity}% ", 76 | "format-plugged": "{capacity}% ", 77 | "format-alt": "{time} {icon}", 78 | // "format-good": "", // An empty format will hide the module 79 | // "format-full": "", 80 | "format-icons": ["", "", "", "", ""] 81 | }, 82 | "battery#bat2": { 83 | "bat": "BAT2" 84 | }, 85 | "network": { 86 | // "interface": "wlp2*", // (Optional) To force the use of this interface 87 | "format-wifi": "{essid} ({signalStrength}%) ", 88 | "format-ethernet": "Connected  ", 89 | "tooltip-format": "{ifname} via {gwaddr} ", 90 | "format-linked": "{ifname} (No IP) ", 91 | "format-disconnected": "Disconnected ⚠", 92 | "format-alt": "{ifname}: {ipaddr}/{cidr}", 93 | "on-click-right": "bash ~/.config/rofi/wifi_menu/rofi_wifi_menu" 94 | }, 95 | "pulseaudio": { 96 | // "scroll-step": 1, // %, can be a float 97 | "format": "{volume}% {icon}", 98 | "format-bluetooth": "{volume}% {icon}", 99 | "format-bluetooth-muted": "{icon} {format_source}", 100 | "format-muted": "{format_source}", 101 | "format-source": "", 102 | "format-source-muted": "", 103 | "format-icons": { 104 | "headphone": "", 105 | "hands-free": "", 106 | "headset": "", 107 | "phone": "", 108 | "portable": "", 109 | "car": "", 110 | "default": ["", "", ""] 111 | }, 112 | "on-click": "pavucontrol" 113 | }, 114 | "custom/media": { 115 | "format": "{icon} {}", 116 | "return-type": "json", 117 | "max-length": 25, 118 | "format-icons": { 119 | "spotify": " ", 120 | "default": " " 121 | }, 122 | "escape": true, 123 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 124 | "on-click": "playerctl play-pause" 125 | }, 126 | "custom/launcher":{ 127 | "format": " ", 128 | "on-click": "rofi -show drun -theme ~/.config/rofi/sway/sway_config.rasi", 129 | "on-click-right": "killall rofi" 130 | }, 131 | "custom/power":{ 132 | "format": " ", 133 | "on-click": "bash ~/.config/rofi/leave/powermenu.sh", 134 | "on-click-right": "killall rofi" 135 | }, 136 | "custom/updater":{ 137 | "format": " {} Updates", 138 | "exec": "yay -Qu | wc -l", 139 | "exec-if": "[[ $(yay -Qu | wc -l) != 0 ]]", 140 | "interval": 15, 141 | "on-click": "alacritty -e yay -Syu" 142 | } 143 | } 144 | 145 | -------------------------------------------------------------------------------- /waybar-examples/sway/sway_style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | font-family: Roboto, Helvetica, Arial, sans-serif; 5 | font-size: 13px; 6 | min-height: 0; 7 | } 8 | 9 | window#waybar { 10 | background-color: transparent; 11 | color: #ffffff; 12 | transition-property: background-color; 13 | transition-duration: .5s; 14 | } 15 | 16 | window#waybar.hidden { 17 | opacity: 0.2; 18 | } 19 | 20 | 21 | #workspaces button { 22 | background: #1f1f1f; 23 | color: #ffffff; 24 | border-radius: 20px; 25 | 26 | } 27 | 28 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 29 | #workspaces button:hover { 30 | background: lightblue; 31 | color: black; 32 | border-bottom: 3px solid #ffffff; 33 | 34 | } 35 | 36 | #workspaces button.focused { 37 | background: #1f1f1f; 38 | } 39 | 40 | #workspaces button.focused:hover { 41 | background: lightblue; 42 | color: black; 43 | border-bottom: 3px solid #ffffff; 44 | 45 | } 46 | 47 | #workspaces button.urgent { 48 | background-color: #eb4d4b; 49 | } 50 | 51 | #mode { 52 | background-color: #64727D; 53 | border-bottom: 3px solid #ffffff; 54 | } 55 | 56 | #clock, 57 | #battery, 58 | #cpu, 59 | #memory, 60 | #disk, 61 | #temperature, 62 | #backlight, 63 | #network, 64 | #pulseaudio, 65 | #custom-media, 66 | #custom-launcher, 67 | #custom-power, 68 | #tray, 69 | #mode, 70 | #idle_inhibitor, 71 | #mpd { 72 | padding: 0 10px; 73 | color: black; 74 | } 75 | 76 | #window, 77 | #workspaces { 78 | margin: 0px 4px; 79 | } 80 | 81 | /* If workspaces is the leftmost module, omit left margin */ 82 | .modules-left > widget:first-child > #workspaces { 83 | margin-left: 0px; 84 | } 85 | 86 | /* If workspaces is the rightmost module, omit right margin */ 87 | .modules-right > widget:last-child > #workspaces { 88 | margin-right: 0px; 89 | } 90 | 91 | #clock { 92 | background-color: #FA8BFF; 93 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 94 | color: black; 95 | border-radius: 0px 20px 20px 0px; 96 | margin-right: 4px; 97 | 98 | } 99 | 100 | #battery { 101 | background-color: #ffffff; 102 | color: #000000; 103 | } 104 | 105 | #battery.charging, #battery.plugged { 106 | color: #ffffff; 107 | background-color: #26A65B; 108 | } 109 | 110 | @keyframes blink { 111 | to { 112 | background-color: #ffffff; 113 | color: #000000; 114 | } 115 | } 116 | 117 | #battery.critical:not(.charging) { 118 | background-color: #f53c3c; 119 | color: #ffffff; 120 | animation-name: blink; 121 | animation-duration: 0.5s; 122 | animation-timing-function: linear; 123 | animation-iteration-count: infinite; 124 | animation-direction: alternate; 125 | } 126 | 127 | label:focus { 128 | background-color: #000000; 129 | } 130 | 131 | #cpu { 132 | background-color: #FA8BFF; 133 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 134 | color: black; 135 | } 136 | 137 | #memory { 138 | background-color: #FA8BFF; 139 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 140 | color: black; 141 | } 142 | 143 | #disk { 144 | background-color: #FA8BFF; 145 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 146 | color: black; 147 | } 148 | 149 | #backlight { 150 | background-color: #FA8BFF; 151 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 152 | 153 | } 154 | 155 | #network { 156 | background-color: #FA8BFF; 157 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 158 | color: black; 159 | } 160 | 161 | #network.disconnected { 162 | background-color: #FA8BFF; 163 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 164 | color: red; 165 | } 166 | 167 | #pulseaudio { 168 | background-color: #FA8BFF; 169 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 170 | color: black; 171 | } 172 | 173 | #pulseaudio.muted { 174 | background-color: #FA8BFF; 175 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 176 | color: red; 177 | } 178 | 179 | #custom-media { 180 | background-color: #8EC5FC; 181 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 182 | color: black; 183 | border-radius: 20px; 184 | margin-right: 5px; 185 | } 186 | 187 | #custom-media.custom-spotify { 188 | background-color: #8EC5FC; 189 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 190 | color: black; 191 | border-radius: 20px; 192 | margin-right: 5px; 193 | 194 | } 195 | 196 | #custom-media.custom-vlc { 197 | background-color: #8EC5FC; 198 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 199 | color: black; 200 | border-radius: 20px; 201 | margin-right: 5px; 202 | } 203 | 204 | #custom-power{ 205 | background-color: #FA8BFF; 206 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 207 | font-size: 16px; 208 | border-radius: 19px; 209 | 210 | } 211 | #custom-launcher{ 212 | background-color: #FA8BFF; 213 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 214 | font-size: 18px; 215 | border-radius: 20px; 216 | 217 | } 218 | 219 | #custom-updater { 220 | background-color: #FA8BFF; 221 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 222 | color: black; 223 | } 224 | 225 | 226 | #temperature { 227 | background-color: #FA8BFF; 228 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 229 | color: black; 230 | } 231 | 232 | #temperature.critical { 233 | background-color: #eb4d4b; 234 | } 235 | 236 | #tray { 237 | background-color: #FA8BFF; 238 | background-image: linear-gradient(-45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 239 | color: black; 240 | } 241 | 242 | #tray > .passive { 243 | -gtk-icon-effect: dim; 244 | background-color: #FA8BFF; 245 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 246 | color: black; 247 | } 248 | 249 | #tray > .needs-attention { 250 | -gtk-icon-effect: highlight; 251 | background-color: #FA8BFF; 252 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 253 | color: black; 254 | } 255 | 256 | #idle_inhibitor { 257 | background-color: #FA8BFF; 258 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 259 | border-radius: 20px 0px 0px 20px; 260 | 261 | } 262 | 263 | #idle_inhibitor.activated { 264 | background-color: #FA8BFF; 265 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 266 | color: black; 267 | border-radius: 20px 0px 0px 20px; 268 | 269 | } 270 | 271 | #language { 272 | background-color: #FA8BFF; 273 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 274 | color: black; 275 | min-width: 16px; 276 | } 277 | 278 | #keyboard-state { 279 | background: #97e1ad; 280 | color: #000000; 281 | min-width: 16px; 282 | } 283 | 284 | #keyboard-state > label { 285 | padding: 0px 5px; 286 | } 287 | 288 | #keyboard-state > label.locked { 289 | background: rgba(0, 0, 0, 0.2); 290 | } 291 | -------------------------------------------------------------------------------- /waybar-examples/sway2/config-sway: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 0, 6 | "margin-top": 0, 7 | "margin-bottom": 0, 8 | 9 | // Choose the order of the modules 10 | 11 | "modules-left":["idle_inhibitor","tray","clock","sway/language", "custom/snip", "backlight","battery", "battery#bat2"], 12 | 13 | "modules-center": ["sway/workspaces"], 14 | 15 | "modules-right":["custom/media","custom/updater", "pulseaudio","custom/power"], 16 | 17 | // Modules configuration 18 | 19 | "sway/workspaces": { 20 | "disable-scroll": false, 21 | "all-outputs": true, 22 | "format": "{icon}", 23 | "persistent_workspaces": { 24 | "1": [], 25 | "2": [], 26 | "3": [], 27 | "4": [], 28 | "5": [], 29 | "6": [], 30 | "7": [], 31 | "8": [], 32 | "9": [], 33 | }, 34 | "format-icons": { 35 | "1": "", 36 | "2": "", 37 | "3": "", 38 | "4": "", 39 | "5": "", 40 | "6": "", 41 | "7": "", 42 | "8": "", 43 | "9": "", 44 | "focused": " ", 45 | "urgent": " ", 46 | "default": " ", 47 | }, 48 | "icon-size": 14 49 | }, 50 | "keyboard-state": { 51 | "numlock": true, 52 | "capslock": true, 53 | "format": " {name} {icon}", 54 | "format-icons": { 55 | "locked": "", 56 | "unlocked": "" 57 | } 58 | }, 59 | "sway/mode": { 60 | "format": "{}" 61 | }, 62 | "idle_inhibitor": { 63 | "format": "{icon}", 64 | "format-icons": { 65 | "activated": "", 66 | "deactivated": "" 67 | } 68 | }, 69 | "tray": { 70 | "icon-size": 20, 71 | "spacing": 10 72 | }, 73 | "clock": { 74 | // "timezone": "America/New_York", 75 | "tooltip-format": "{:%Y %B}\n{calendar}", 76 | "format-alt": "{:%Y-%m-%d}" 77 | }, 78 | "cpu": { 79 | "format": "{usage}% ", 80 | "tooltip": false 81 | }, 82 | "memory": { 83 | "format": "{}% " 84 | }, 85 | "temperature": { 86 | // "thermal-zone": 2, 87 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 88 | "critical-threshold": 80, 89 | // "format-critical": "{temperatureC}°C {icon}", 90 | "format": "{temperatureC}°C {icon}", 91 | "format-icons": ["", "", ""] 92 | }, 93 | "backlight": { 94 | // "device": "acpi_video1", 95 | "format": "{percent}% {icon}", 96 | "format-icons": ["", ""] 97 | }, 98 | "battery": { 99 | "states": { 100 | // "good": 95, 101 | "warning": 30, 102 | "critical": 15 103 | }, 104 | "format": "{capacity}% {icon}", 105 | "format-charging": "{capacity}% ", 106 | "format-plugged": "{capacity}% ", 107 | "format-alt": "{time} {icon}", 108 | // "format-good": "", // An empty format will hide the module 109 | // "format-full": "", 110 | "format-icons": ["", "", "", "", ""] 111 | }, 112 | "battery#bat2": { 113 | "bat": "BAT2" 114 | }, 115 | "network": { 116 | // "interface": "wlp2*", // (Optional) To force the use of this interface 117 | "format-wifi": "{essid} ({signalStrength}%) ", 118 | "format-ethernet": "Connected  ", 119 | "tooltip-format": "{ifname} via {gwaddr} ", 120 | "format-linked": "{ifname} (No IP) ", 121 | "format-disconnected": "Disconnected ⚠", 122 | "format-alt": "{ifname}: {ipaddr}/{cidr}", 123 | "on-click-right": "bash ~/.config/rofi/wifi_menu/rofi_wifi_menu" 124 | }, 125 | "pulseaudio": { 126 | // "scroll-step": 1, // %, can be a float 127 | "format": "{icon}", 128 | "format-bluetooth": "{icon}", 129 | "format-bluetooth-muted": "{icon} {format_source}", 130 | "format-muted": "{format_source}", 131 | "format-source": "", 132 | "format-source-muted": "", 133 | "format-icons": { 134 | "headphone": "", 135 | "hands-free": "", 136 | "headset": "", 137 | "phone": "", 138 | "portable": "", 139 | "car": "", 140 | "default": ["", "", ""] 141 | }, 142 | "on-click": "bash ~/.config/system_scripts/volume up", 143 | "on-click-right": "bash ~/.config/system_scripts/volume down" 144 | 145 | }, 146 | "custom/media": { 147 | "format": "{icon} {}", 148 | "return-type": "json", 149 | "max-length": 25, 150 | "format-icons": { 151 | "spotify": " ", 152 | "default": " " 153 | }, 154 | "escape": true, 155 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 156 | "on-click": "bash ~/.config/system_scripts/volume pause" 157 | }, 158 | "custom/launcher":{ 159 | "format": "", 160 | "on-click": "rofi -show drun -theme ~/.config/rofi/sway/sway_config.rasi", 161 | "on-click-right": "killall rofi" 162 | }, 163 | "custom/power":{ 164 | "format": "", 165 | "on-click": "nwg-bar", 166 | "on-click-right": "killall nwg-bar" 167 | }, 168 | "custom/updater":{ 169 | "format": "", 170 | "exec": "checkupdates | wc -l", 171 | "exec-if": "[[ $(checkupdates | wc -l) != 0 ]]", 172 | "interval": 15, 173 | "on-click": "alacritty -e yay -Syu" 174 | }, 175 | "custom/snip":{ 176 | "format": "", 177 | "on-click": "grimshot --notify save area $HOME/Pictures/$(zenity --entry --text 'Set filename:' --entry-text '.png')" 178 | } 179 | } 180 | 181 | -------------------------------------------------------------------------------- /waybar-examples/sway2/sway_style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | font-family: Material, Montserrat, Roboto, Helvetica, Arial, sans-serif; 5 | font-size: 14px; 6 | min-height: 0; 7 | 8 | } 9 | 10 | window#waybar { 11 | 12 | background-image: linear-gradient(120deg, #a6c0fe 0%, #f68084 100%); 13 | color: #ffffff; 14 | transition-property: background-color; 15 | transition-duration: .5s; 16 | } 17 | 18 | window#waybar.hidden { 19 | opacity: 0.2; 20 | } 21 | 22 | #workspaces { 23 | padding: 10px; 24 | margin-right: 0px; 25 | border-radius: 20px; 26 | opacity: 0.88; 27 | } 28 | 29 | #workspaces button { 30 | color: #131313; 31 | border-radius: 20px; 32 | font-weight:bold; 33 | margin: 0px; 34 | padding: 5px; 35 | border-bottom: 3px solid #ffffff; 36 | 37 | } 38 | 39 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 40 | #workspaces button:hover { 41 | background: lightblue; 42 | color: #131313; 43 | border-bottom: 3px solid #ffffff; 44 | 45 | } 46 | 47 | #workspaces button.focused { 48 | background: #1f1f1f; 49 | color: white; 50 | border-bottom: 3px solid #ffffff; 51 | 52 | } 53 | 54 | #workspaces button.focused:hover { 55 | background: lightblue; 56 | color: black; 57 | border-bottom: 3px solid #ffffff; 58 | 59 | } 60 | 61 | #workspaces button.urgent { 62 | background-color: #eb4d4b; 63 | } 64 | 65 | #mode { 66 | background-color: #64727D; 67 | border-bottom: 3px solid #ffffff; 68 | } 69 | 70 | #clock, 71 | #battery, 72 | #cpu, 73 | #memory, 74 | #disk, 75 | #temperature, 76 | #backlight, 77 | #network, 78 | #pulseaudio, 79 | #custom-media, 80 | #custom-launcher, 81 | #custom-power, 82 | #tray, 83 | #mode, 84 | #idle_inhibitor, 85 | #custom-updater, 86 | #custom-snip, 87 | #mpd { 88 | padding: 0 10px; 89 | color: black; 90 | } 91 | 92 | #custom-updater, 93 | #custom-launcher, 94 | #pulseaudio, 95 | #custom-snip, 96 | #custom-power{ 97 | font-size: 20px; 98 | } 99 | 100 | #window, 101 | #workspaces { 102 | margin: 0px 4px; 103 | } 104 | 105 | /* If workspaces is the leftmost module, omit left margin */ 106 | .modules-left > widget:first-child > #workspaces { 107 | margin-left: 0px; 108 | } 109 | 110 | /* If workspaces is the rightmost module, omit right margin */ 111 | .modules-right > widget:last-child > #workspaces { 112 | margin-right: 0px; 113 | } 114 | 115 | #clock { 116 | color: black; 117 | margin-right: 4px; 118 | } 119 | 120 | #battery { 121 | color: #000000; 122 | } 123 | 124 | #battery.charging, #battery.plugged { 125 | color: #ffffff; 126 | background-color: #26A65B; 127 | } 128 | 129 | @keyframes blink { 130 | to { 131 | background-color: #ffffff; 132 | color: #000000; 133 | } 134 | } 135 | 136 | #battery.critical:not(.charging) { 137 | background-color: #f53c3c; 138 | color: #ffffff; 139 | animation-name: blink; 140 | animation-duration: 0.5s; 141 | animation-timing-function: linear; 142 | animation-iteration-count: infinite; 143 | animation-direction: alternate; 144 | } 145 | 146 | label:focus { 147 | background-color: #000000; 148 | } 149 | 150 | #network.disconnected { 151 | color: red; 152 | } 153 | 154 | #pulseaudio { 155 | 156 | color: black; 157 | } 158 | 159 | #pulseaudio.muted { 160 | 161 | color: red; 162 | } 163 | 164 | 165 | #temperature.critical { 166 | background-color: #eb4d4b; 167 | } 168 | 169 | #tray { 170 | color: black; 171 | } 172 | 173 | #tray > .passive { 174 | -gtk-icon-effect: dim; 175 | color: black; 176 | } 177 | 178 | #tray > .needs-attention { 179 | -gtk-icon-effect: highlight; 180 | color: black; 181 | } 182 | 183 | 184 | #language { 185 | color: black; 186 | min-width: 16px; 187 | } 188 | 189 | #keyboard-state { 190 | background: #97e1ad; 191 | color: #000000; 192 | min-width: 16px; 193 | } 194 | 195 | #keyboard-state > label { 196 | padding: 0px 5px; 197 | } 198 | 199 | #keyboard-state > label.locked { 200 | background: rgba(0, 0, 0, 0.2); 201 | } 202 | -------------------------------------------------------------------------------- /waybar-examples/sway3/config-sway: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 0, 6 | "margin-top": 5, 7 | "margin-left": 10, 8 | "margin-right": 10, 9 | "margin-bottom": 10, 10 | 11 | 12 | // Choose the order of the modules 13 | 14 | "modules-left":["custom/updater", "idle_inhibitor","tray","clock","custom/snip", "sway/language", "backlight"], 15 | 16 | "modules-center": ["sway/workspaces"], 17 | 18 | "modules-right":["custom/media", "custom/network", "pulseaudio","battery", "battery#bat2", "custom/power"], 19 | 20 | // Modules configuration 21 | 22 | "sway/workspaces": { 23 | "disable-scroll": false, 24 | "all-outputs": false, 25 | "format": "{icon}", 26 | "format-icons": { 27 | "focused": " ", 28 | "urgent": " ", 29 | "default": " ", 30 | }, 31 | "icon-size": 14 32 | }, 33 | "keyboard-state": { 34 | "numlock": true, 35 | "capslock": true, 36 | "format": "{name} {icon} ", 37 | "format-icons": { 38 | "locked": "", 39 | "unlocked": "" 40 | }, 41 | }, 42 | "sway/mode": { 43 | "format": "{}" 44 | }, 45 | "idle_inhibitor": { 46 | "format": "{icon}", 47 | "format-icons": { 48 | "activated": "", 49 | "deactivated": "" 50 | } 51 | }, 52 | "tray": { 53 | "icon-size": 18, 54 | "spacing": 3, 55 | "tooltip": true 56 | }, 57 | "clock": { 58 | // "timezone": "America/New_York", 59 | "format-alt": "{:%Y-%m-%d}", 60 | "tooltip": false 61 | }, 62 | "cpu": { 63 | "format": "", 64 | "tooltip": true 65 | }, 66 | "memory": { 67 | "format": "", 68 | "tooltip": true 69 | }, 70 | "temperature": { 71 | // "thermal-zone": 2, 72 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 73 | "critical-threshold": 80, 74 | // "format-critical": "{temperatureC}°C {icon}", 75 | "format": "{icon}", 76 | "format-icons": [""], 77 | "tooltip": true 78 | }, 79 | "backlight": { 80 | // "device": "acpi_video1", 81 | "format": "{icon}", 82 | "format-icons": ["", ""], 83 | "tooltip": true 84 | }, 85 | "battery": { 86 | "states": { 87 | // "good": 95, 88 | "warning": 30, 89 | "critical": 15 90 | }, 91 | "format": "{capacity}%", 92 | "format-charging": "", 93 | "format-plugged": "", 94 | "format-alt": "{icon}", 95 | // "format-good": "", // An empty format will hide the module 96 | // "format-full": "", 97 | "format-icons": ["","","","",""], 98 | "tooltip": true 99 | }, 100 | "battery#bat2": { 101 | "bat": "BAT2", 102 | "tooltip": false 103 | }, 104 | "pulseaudio": { 105 | // "scroll-step": 1, // %, can be a float 106 | "format": "{icon}", 107 | "format-bluetooth": "{icon}", 108 | "format-bluetooth-muted": "{icon} {format_source}", 109 | "format-muted": "{format_source}", 110 | "format-source": "", 111 | "format-source-muted": "", 112 | "format-icons": { 113 | "headphone": " ", 114 | "hands-free": "", 115 | "headset": "", 116 | "phone": "", 117 | "portable": "", 118 | "car": "", 119 | "default": ["", "", ""] 120 | }, 121 | "on-click": "bash $HOME/.config/system_scripts/volume up", 122 | "on-click-right": "bash $HOME/.config/system_scripts/volume down", 123 | "tooltip": false 124 | }, 125 | "custom/media": { 126 | "format": "{icon} {}", 127 | "return-type": "json", 128 | "max-length": 30, 129 | "format-icons": { 130 | "spotify": " ", 131 | "default": "" 132 | }, 133 | "escape": true, 134 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 135 | "on-click": "notify-send 'Play-Pause' `(playerctl play-pause)`" 136 | }, 137 | "custom/launcher":{ 138 | "format": "", 139 | "on-click": "wofi --show drun -p", 140 | "on-click-right": "killall wofi", 141 | "tooltip": false 142 | }, 143 | "custom/power":{ 144 | "format": "", 145 | "on-click": "nwg-bar", 146 | "tooltip": false 147 | }, 148 | "custom/updater":{ 149 | "format": "{} Updates", 150 | "exec": "checkupdates | wc -l", 151 | "exec-if": "[[ $(checkupdates | wc -l) != 0 ]]", 152 | "interval": 15, 153 | "on-click": "kitty -e yay -Syu" 154 | }, 155 | "custom/snip":{ 156 | "format": "", 157 | "on-click": "grimshot --notify save area $HOME/Pictures/$(zenity --entry --text 'Set filename:' --entry-text '.png')" 158 | }, 159 | "custom/wallpaper":{ 160 | "format": "", 161 | "on-click": "bash ~/.config/system_scripts/pkill_bc" 162 | }, 163 | "custom/network":{ 164 | "format": "{}", 165 | "max-length": 30, 166 | "escape": true, 167 | "interval": 15, 168 | "exec": "bash ~/.config/system_scripts/dynamic_network.sh", 169 | "on-click": "kitty -e nmtui" 170 | } 171 | } 172 | 173 | -------------------------------------------------------------------------------- /waybar-examples/sway3/sway_style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | /* `otf-font-awesome` is required to be installed for icons */ 5 | font-family: Material, Font Awesome, Roboto, Helvetica, Arial, sans-serif; 6 | font-size: 13px; 7 | min-height: 0; 8 | /*border-radius: 20px;*/ 9 | color: yellowgreen; 10 | } 11 | 12 | window#waybar { 13 | background: linear-gradient(90deg, rgba(63,94,251,1) 0%, rgba(6, 66, 115, 1) 55%, rgba(63,94,251,1) 100%); 14 | transition-property: background-color; 15 | transition-duration: .5s; 16 | } 17 | 18 | window#waybar.hidden { 19 | opacity: 0.2; 20 | } 21 | 22 | #workspaces { 23 | padding: 20px; 24 | margin-right: 0px; 25 | opacity: 0.88; 26 | } 27 | 28 | #workspaces button { 29 | color: #131313; 30 | font-weight:bold; 31 | margin: 0px; 32 | padding: 3px 3px 3px 6px; 33 | } 34 | 35 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 36 | #workspaces button:hover { 37 | background: rgba(4,52,61,1); 38 | color: #131313; 39 | } 40 | 41 | #workspaces button.focused { 42 | background: #1f1f1f; 43 | color: white; 44 | } 45 | 46 | #workspaces button.focused:hover { 47 | background: rgba(4,52,61,1); 48 | color: black; 49 | } 50 | 51 | 52 | tooltip { 53 | background: #1f1f1f; 54 | } 55 | 56 | tooltip label { 57 | color: white; 58 | } 59 | 60 | #clock, 61 | #cpu, 62 | #memory, 63 | #disk, 64 | #temperature, 65 | #backlight, 66 | #network, 67 | #pulseaudio, 68 | #custom-media, 69 | #custom-launcher, 70 | #custom-power, 71 | #custom-layout, 72 | #custom-updater, 73 | #custom-snip, 74 | #custom-network, 75 | #custom-wallpaper, 76 | #custom-layout, 77 | #taskbar, 78 | #workspaces, 79 | #mode, 80 | #idle_inhibitor, 81 | #mpd { 82 | padding: 6; 83 | color: yellowgreen; 84 | } 85 | 86 | #window{ 87 | margin: 0px 4px; 88 | } 89 | 90 | #battery{ 91 | font-size: 26px; 92 | } 93 | 94 | 95 | #battery.charging, #battery.plugged { 96 | color: #ffffff; 97 | background-color: #26A65B; 98 | } 99 | 100 | @keyframes blink { 101 | to { 102 | background-color: #ffffff; 103 | color: #000000; 104 | } 105 | } 106 | 107 | #battery.critical:not(.charging) { 108 | background-color: #f53c3c; 109 | color: #ffffff; 110 | animation-name: blink; 111 | animation-duration: 0.5s; 112 | animation-timing-function: linear; 113 | animation-iteration-count: infinite; 114 | animation-direction: alternate; 115 | } 116 | 117 | label:focus { 118 | background-color: #000000; 119 | } 120 | 121 | #network.disconnected { 122 | color: red; 123 | } 124 | 125 | #pulseaudio { 126 | font-size: 18px; 127 | } 128 | 129 | #pulseaudio.muted { 130 | color: red; 131 | } 132 | 133 | #custom-media{ 134 | font-style: italic; 135 | font-family: sans-serif; 136 | } 137 | 138 | #custom-power{ 139 | font-size: 18px; 140 | font-weight: bold; 141 | margin-left: 5px; 142 | padding: 10px; 143 | background: linear-gradient(90deg, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%); 144 | } 145 | 146 | #custom-launcher{ 147 | font-size: 20px; 148 | margin-left: 5px; 149 | color: #dd3366; 150 | border: 2px solid #c9545d; 151 | } 152 | 153 | #custom-updater { 154 | color:black; 155 | font-weight: bold; 156 | background: linear-gradient(90deg, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%); 157 | } 158 | 159 | #custom-snip { 160 | font-size: 20px; 161 | } 162 | 163 | #clock, 164 | #language{ 165 | font-size: 14px; 166 | } 167 | 168 | #custom-wallpaper, 169 | #custom-network, 170 | #custom-snip{ 171 | font-size: 20px; 172 | } 173 | 174 | #temperature.critical { 175 | background-color: #eb4d4b; 176 | } 177 | 178 | #tray{ 179 | margin: 0px 5px 0px 5px; 180 | } 181 | 182 | #tray > .passive { 183 | -gtk-icon-effect: dim; 184 | background-color: #171717; 185 | color: #ffffff; 186 | } 187 | 188 | #tray > .needs-attention { 189 | -gtk-icon-effect: highlight; 190 | background-color: #171717; 191 | color: #ffffff; 192 | } 193 | 194 | #idle_inhibitor { 195 | font-size: 18px; 196 | padding: 10px; 197 | background: linear-gradient(-90deg, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%); 198 | } 199 | 200 | #idle_inhibitor.activated { 201 | color: #ffffff; 202 | background: linear-gradient(-90deg, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%); 203 | } 204 | 205 | #language { 206 | min-width: 16px; 207 | } 208 | 209 | #keyboard-state { 210 | min-width: 16px; 211 | } 212 | 213 | #keyboard-state > label { 214 | padding: 0px 5px; 215 | } 216 | 217 | #keyboard-state > label.locked { 218 | background: rgba(0, 0, 0, 0.2); 219 | } 220 | 221 | -------------------------------------------------------------------------------- /waybar-examples/wayfire/config-wayfire: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 4, 6 | "margin-top": 10, 7 | "margin-bottom":5, 8 | 9 | // Choose the order of the modules 10 | 11 | "modules-left":[ "idle_inhibitor", "pulseaudio", "cpu", "memory", "temperature"], 12 | "modules-center": [ "custom/launcher", "custom/media","wlr/taskbar", "custom/power"], 13 | "modules-right":["custom/layout", "custom/updater", "custom/snip", "backlight", "keyboard-state", "battery", "battery#bat2", "network", "tray", "clock"], 14 | // Modules configuration 15 | 16 | "keyboard-state": { 17 | "numlock": true, 18 | "capslock": true, 19 | "format": " {name} {icon}", 20 | "format-icons": { 21 | "locked": "", 22 | "unlocked": "" 23 | } 24 | }, 25 | "wlr/taskbar": { 26 | "format": "{icon}", 27 | "icon-size": 20, 28 | "icon-theme": "Star", 29 | "tooltip-format": "{title}", 30 | "on-click": "minimize", 31 | "on-click-middle": "close", 32 | "on-click-right": "activate" 33 | }, 34 | "sway/language": { 35 | "format": " {}", 36 | }, 37 | "idle_inhibitor": { 38 | "format": "{icon}", 39 | "format-icons": { 40 | "activated": "", 41 | "deactivated": "" 42 | } 43 | }, 44 | "tray": { 45 | "icon-size": 20, 46 | "spacing": 10 47 | }, 48 | "clock": { 49 | // "timezone": "America/New_York", 50 | "tooltip-format": "{:%Y %B}\n{calendar}", 51 | "format-alt": "{:%Y-%m-%d}" 52 | }, 53 | "cpu": { 54 | "format": "{usage}% ", 55 | "tooltip": false 56 | }, 57 | "memory": { 58 | "format": "{}% " 59 | }, 60 | "temperature": { 61 | // "thermal-zone": 2, 62 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 63 | "critical-threshold": 80, 64 | // "format-critical": "{temperatureC}°C {icon}", 65 | "format": "{temperatureC}°C {icon}", 66 | "format-icons": ["", "", ""] 67 | }, 68 | "backlight": { 69 | "format": "{percent}% {icon}", 70 | "format-icons": ["", ""] 71 | }, 72 | "battery": { 73 | "states": { 74 | // "good": 95, 75 | "warning": 30, 76 | "critical": 15 77 | }, 78 | "format": "{capacity}% {icon}", 79 | "format-charging": "{capacity}% ", 80 | "format-plugged": "{capacity}% ", 81 | "format-alt": "{time} {icon}", 82 | "format-icons": ["", "", "", "", ""] 83 | }, 84 | "battery#bat2": { 85 | "bat": "BAT2" 86 | }, 87 | "network": { 88 | // "interface": "wlp2*", // (Optional) To force the use of this interface 89 | "format-wifi": "{essid} ({signalStrength}%) ", 90 | "format-ethernet": "Connected  ", 91 | "tooltip-format": "{ifname} via {gwaddr} ", 92 | "format-linked": "{ifname} (No IP) ", 93 | "format-disconnected": "Disconnected ⚠", 94 | "format-alt": "{ifname}: {ipaddr}/{cidr}", 95 | "on-click-right": "bash ~/.config/rofi/wifi_menu/rofi_wifi_menu" 96 | 97 | }, 98 | "pulseaudio": { 99 | "format": "{volume}% {icon}", 100 | "format-bluetooth": "{volume}% {icon}", 101 | "format-bluetooth-muted": "{icon} {format_source}", 102 | "format-muted": "{format_source}", 103 | "format-source": "", 104 | "format-source-muted": "", 105 | "format-icons": { 106 | "headphone": "", 107 | "hands-free": "", 108 | "headset": "", 109 | "phone": "", 110 | "portable": "", 111 | "car": "", 112 | "default": ["", "", ""] 113 | }, 114 | "on-click": "pavucontrol" 115 | }, 116 | "custom/media": { 117 | "format": "{icon} {}", 118 | "return-type": "json", 119 | "max-length": 15, 120 | "format-icons": { 121 | "spotify": " ", 122 | "default": " " 123 | }, 124 | "escape": true, 125 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 126 | "on-click": "playerctl play-pause" 127 | }, 128 | "custom/launcher":{ 129 | "format": " ", 130 | "on-click": "rofi -show drun -theme ~/.config/rofi/wayfire/config.rasi", 131 | "on-click-right": "killall rofi" 132 | }, 133 | "custom/power":{ 134 | "format": " ", 135 | "on-click": "nwg-bar", 136 | "on-click-right": "killall nwg-bar" 137 | }, 138 | "custom/layout":{ 139 | "format": "", 140 | "on-click": "bash ~/.config/system_scripts/layout.sh" 141 | }, 142 | "custom/updater":{ 143 | "format": " {} Updates", 144 | "exec": "checkupdates | wc -l", 145 | "exec-if": "[[ $(checkupdates | wc -l) != 0 ]]", 146 | "interval": 15, 147 | "on-click": "alacritty -e yay -Syu" 148 | } 149 | } 150 | 151 | -------------------------------------------------------------------------------- /waybar-examples/wayfire/layout2/config-wayfire: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 4, 6 | "margin-top": 10, 7 | "margin-bottom":5, 8 | 9 | // Choose the order of the modules 10 | 11 | "modules-left":[ "custom/launcher", "wlr/taskbar"], 12 | "modules-right":["custom/media", "idle_inhibitor", "custom/updater", "custom/snip", "pulseaudio", "cpu", "memory", "temperature", "custom/layout", "backlight", "keyboard-state", "battery", "battery#bat2", "network", "tray", "clock", "custom/power"], 13 | // Modules configuration 14 | 15 | "wlr/taskbar": { 16 | "format": "{icon}", 17 | "icon-size": 20, 18 | "icon-theme": "Star", 19 | "tooltip-format": "{title}", 20 | "on-click": "minimize", 21 | "on-click-middle": "close", 22 | "on-click-right": "activate" 23 | }, 24 | "keyboard-state": { 25 | "numlock": true, 26 | "capslock": true, 27 | "format": " {name} {icon}", 28 | "format-icons": { 29 | "locked": "", 30 | "unlocked": "" 31 | } 32 | }, 33 | "sway/language": { 34 | "format": " {}", 35 | }, 36 | "idle_inhibitor": { 37 | "format": "{icon}", 38 | "format-icons": { 39 | "activated": "", 40 | "deactivated": "" 41 | } 42 | }, 43 | "tray": { 44 | "icon-size": 20, 45 | "spacing": 10 46 | }, 47 | "clock": { 48 | // "timezone": "America/New_York", 49 | "tooltip-format": "{:%Y %B}\n{calendar}", 50 | "format-alt": "{:%Y-%m-%d}" 51 | }, 52 | "cpu": { 53 | "format": "{usage}% ", 54 | "tooltip": false 55 | }, 56 | "memory": { 57 | "format": "{}% " 58 | }, 59 | "temperature": { 60 | // "thermal-zone": 2, 61 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 62 | "critical-threshold": 80, 63 | // "format-critical": "{temperatureC}°C {icon}", 64 | "format": "{temperatureC}°C {icon}", 65 | "format-icons": ["", "", ""] 66 | }, 67 | "backlight": { 68 | // "device": "acpi_video1", 69 | "format": "{percent}% {icon}", 70 | "format-icons": ["", ""] 71 | }, 72 | "battery": { 73 | "states": { 74 | // "good": 95, 75 | "warning": 30, 76 | "critical": 15 77 | }, 78 | "format": "{capacity}% {icon}", 79 | "format-charging": "{capacity}% ", 80 | "format-plugged": "{capacity}% ", 81 | "format-alt": "{time} {icon}", 82 | // "format-good": "", // An empty format will hide the module 83 | // "format-full": "", 84 | "format-icons": ["", "", "", "", ""] 85 | }, 86 | "battery#bat2": { 87 | "bat": "BAT2" 88 | }, 89 | "network": { 90 | // "interface": "wlp2*", // (Optional) To force the use of this interface 91 | "format-wifi": "{essid} ({signalStrength}%) ", 92 | "format-ethernet": "Connected  ", 93 | "tooltip-format": "{ifname} via {gwaddr} ", 94 | "format-linked": "{ifname} (No IP) ", 95 | "format-disconnected": "Disconnected ⚠", 96 | "format-alt": "{ifname}: {ipaddr}/{cidr}", 97 | "on-click-right": "bash ~/.config/rofi/wifi_menu/rofi_wifi_menu" 98 | }, 99 | "pulseaudio": { 100 | // "scroll-step": 1, // %, can be a float 101 | "format": "{volume}% {icon}", 102 | "format-bluetooth": "{volume}% {icon}", 103 | "format-bluetooth-muted": "{icon} {format_source}", 104 | "format-muted": "{format_source}", 105 | "format-source": "", 106 | "format-source-muted": "", 107 | "format-icons": { 108 | "headphone": "", 109 | "hands-free": "", 110 | "headset": "", 111 | "phone": "", 112 | "portable": "", 113 | "car": "", 114 | "default": ["", "", ""] 115 | }, 116 | "on-click": "pavucontrol" 117 | }, 118 | "custom/media": { 119 | "format": "{icon} {}", 120 | "return-type": "json", 121 | "max-length": 20, 122 | "format-icons": { 123 | "spotify": " ", 124 | "default": " " 125 | }, 126 | "escape": true, 127 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 128 | "on-click": "playerctl play-pause" 129 | }, 130 | "custom/launcher":{ 131 | "format": "", 132 | "on-click": "rofi -show drun -theme ~/.config/rofi/wayfire/config2.rasi", 133 | "on-click-right": "killall rofi" 134 | }, 135 | "custom/power":{ 136 | "format": " ", 137 | "on-click": "nwg-bar", 138 | "on-click-right": "killall nwg-bar" 139 | }, 140 | "custom/layout":{ 141 | "format": " ", 142 | "on-click": "bash ~/.config/system_scripts/layout.sh" 143 | }, 144 | "custom/updater":{ 145 | "format": " {} Updates", 146 | "exec": "checkupdates | wc -l", 147 | "exec-if": "[[ $(checkupdates | wc -l) != 0 ]]", 148 | "interval": 15, 149 | "on-click": "alacritty -e yay -Syu" 150 | }, 151 | "custom/snip":{ 152 | "format": " ", 153 | "on-click": "grimshot --notify save area $HOME/Pictures/$(zenity --entry --text 'Set filename:' --entry-text '.png')" 154 | } 155 | } 156 | 157 | -------------------------------------------------------------------------------- /waybar-examples/wayfire/layout2/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | /* `otf-font-awesome` is required to be installed for icons */ 5 | font-family: Roboto, Helvetica, Arial, sans-serif; 6 | font-size: 13px; 7 | min-height: 0; 8 | } 9 | 10 | window#waybar { 11 | background-color: transparent; 12 | color: #ffffff; 13 | transition-property: background-color; 14 | transition-duration: .5s; 15 | } 16 | 17 | window#waybar.hidden { 18 | opacity: 0.2; 19 | } 20 | 21 | 22 | #workspaces button { 23 | background: #1f1f1f; 24 | color: #ffffff; 25 | border-radius: 20px; 26 | 27 | } 28 | 29 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 30 | #workspaces button:hover { 31 | background: lightblue; 32 | color: black; 33 | border-bottom: 3px solid #ffffff; 34 | 35 | } 36 | 37 | #workspaces button.focused { 38 | background: #1f1f1f; 39 | } 40 | 41 | #workspaces button.focused:hover { 42 | background: lightblue; 43 | color: black; 44 | border-bottom: 3px solid #ffffff; 45 | 46 | } 47 | 48 | #workspaces button.urgent { 49 | background-color: #eb4d4b; 50 | } 51 | 52 | #mode { 53 | background-color: #64727D; 54 | border-bottom: 3px solid #ffffff; 55 | } 56 | 57 | #clock, 58 | #battery, 59 | #cpu, 60 | #memory, 61 | #disk, 62 | #temperature, 63 | #backlight, 64 | #network, 65 | #pulseaudio, 66 | #custom-media, 67 | #custom-launcher, 68 | #custom-power, 69 | #custom-layout, 70 | #custom-updater, 71 | #custom-snip, 72 | #taskbar, 73 | #tray, 74 | #mode, 75 | #idle_inhibitor, 76 | #mpd { 77 | padding: 0 10px; 78 | color: #ffffff; 79 | } 80 | 81 | #window, 82 | #workspaces { 83 | margin: 0px 4px; 84 | } 85 | 86 | /* If workspaces is the leftmost module, omit left margin */ 87 | .modules-left > widget:first-child > #workspaces { 88 | margin-left: 0px; 89 | } 90 | 91 | /* If workspaces is the rightmost module, omit right margin */ 92 | .modules-right > widget:last-child > #workspaces { 93 | margin-right: 0px; 94 | } 95 | 96 | #clock { 97 | background-color: #171717; 98 | color: #ffffff; 99 | } 100 | 101 | #battery { 102 | background-color: #ffffff; 103 | color: #000000; 104 | } 105 | 106 | #battery.charging, #battery.plugged { 107 | color: #ffffff; 108 | background-color: #26A65B; 109 | } 110 | 111 | @keyframes blink { 112 | to { 113 | background-color: #ffffff; 114 | color: #000000; 115 | } 116 | } 117 | 118 | #battery.critical:not(.charging) { 119 | background-color: #f53c3c; 120 | color: #ffffff; 121 | animation-name: blink; 122 | animation-duration: 0.5s; 123 | animation-timing-function: linear; 124 | animation-iteration-count: infinite; 125 | animation-direction: alternate; 126 | } 127 | 128 | label:focus { 129 | background-color: #000000; 130 | } 131 | 132 | #cpu { 133 | background-color: #171717; 134 | color: #ffffff; 135 | } 136 | 137 | #memory { 138 | background-color: #171717; 139 | color: #ffffff; 140 | } 141 | 142 | #disk { 143 | background-color: #171717; 144 | color: #ffffff; 145 | } 146 | 147 | #backlight { 148 | background-color: #90b1b1; 149 | } 150 | 151 | #network { 152 | background-color: #171717; 153 | color: #ffffff; 154 | } 155 | 156 | #network.disconnected { 157 | background-color: #171717; 158 | color: red; 159 | } 160 | 161 | #pulseaudio { 162 | background-color: #171717; 163 | color: #ffffff; 164 | } 165 | 166 | #pulseaudio.muted { 167 | background-color: #171717; 168 | color: red; 169 | } 170 | 171 | #custom-media { 172 | background-color: #8EC5FC; 173 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 174 | color: black; 175 | border-radius: 20px; 176 | margin-right: 5px; 177 | margin-left: 5px; 178 | } 179 | 180 | #custom-media.custom-spotify { 181 | background-color: #8EC5FC; 182 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 183 | color: black; 184 | border-radius: 20px; 185 | margin-right: 5px; 186 | 187 | } 188 | 189 | #custom-media.custom-vlc { 190 | background-color: #8EC5FC; 191 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 192 | color: black; 193 | border-radius: 20px; 194 | margin-right: 5px; 195 | } 196 | 197 | #custom-power{ 198 | background-color: #171717; 199 | font-size: 18px; 200 | border-radius: 0px 20px 20px 0px; 201 | margin-right: 5px; 202 | 203 | } 204 | 205 | #custom-launcher{ 206 | background-color: #171717; 207 | font-size: 20px; 208 | border-radius: 20px 0px 0px 20px; 209 | margin-left: 5px; 210 | 211 | } 212 | 213 | #custom-layout{ 214 | background-color: #171717; 215 | color: white; 216 | font-size:20px; 217 | } 218 | 219 | #custom-updater { 220 | background-color: #171717; 221 | color: white; 222 | } 223 | 224 | #custom-snip { 225 | background-color: #171717; 226 | color: skyblue; 227 | font-size: 20px; 228 | } 229 | 230 | 231 | #taskbar{ 232 | background-color: #171717; 233 | border-radius: 0px 20px 20px 0px; 234 | } 235 | 236 | #temperature { 237 | background-color: #171717; 238 | color: #ffffff; 239 | } 240 | 241 | #temperature.critical { 242 | background-color: #eb4d4b; 243 | } 244 | 245 | #tray { 246 | background-color: #171717; 247 | color: #ffffff; 248 | } 249 | 250 | #tray > .passive { 251 | -gtk-icon-effect: dim; 252 | background-color: #171717; 253 | color: #ffffff; 254 | } 255 | 256 | #tray > .needs-attention { 257 | -gtk-icon-effect: highlight; 258 | background-color: #171717; 259 | color: #ffffff; 260 | } 261 | 262 | #idle_inhibitor { 263 | background-color: #171717; 264 | border-radius: 20px 0px 0px 20px; 265 | 266 | } 267 | 268 | #idle_inhibitor.activated { 269 | background-color: #171717; 270 | color: #ffffff; 271 | border-radius: 20px 0px 0px 20px; 272 | 273 | } 274 | 275 | #language { 276 | background-color: #171717; 277 | color: #ffffff; 278 | min-width: 16px; 279 | } 280 | 281 | #keyboard-state { 282 | background: #97e1ad; 283 | color: #000000; 284 | min-width: 16px; 285 | } 286 | 287 | #keyboard-state > label { 288 | padding: 0px 5px; 289 | } 290 | 291 | #keyboard-state > label.locked { 292 | background: rgba(0, 0, 0, 0.2); 293 | } 294 | -------------------------------------------------------------------------------- /waybar-examples/wayfire/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | /* `otf-font-awesome` is required to be installed for icons */ 5 | font-family: Roboto, Helvetica, Arial, sans-serif; 6 | font-size: 13px; 7 | min-height: 0; 8 | } 9 | 10 | window#waybar { 11 | background-color: transparent; 12 | color: black; 13 | transition-property: background-color; 14 | transition-duration: .5s; 15 | } 16 | 17 | window#waybar.hidden { 18 | opacity: 0.2; 19 | } 20 | 21 | 22 | #workspaces button { 23 | background: #1f1f1f; 24 | color: black; 25 | border-radius: 20px; 26 | 27 | } 28 | 29 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 30 | #workspaces button:hover { 31 | background: lightblue; 32 | color: black; 33 | border-bottom: 3px solid black; 34 | 35 | } 36 | 37 | #workspaces button.focused { 38 | background: #1f1f1f; 39 | } 40 | 41 | #workspaces button.focused:hover { 42 | background: lightblue; 43 | color: black; 44 | border-bottom: 3px solid black; 45 | 46 | } 47 | 48 | #workspaces button.urgent { 49 | background-color: #eb4d4b; 50 | } 51 | 52 | #mode { 53 | background-color: #64727D; 54 | border-bottom: 3px solid black; 55 | } 56 | 57 | #clock, 58 | #battery, 59 | #cpu, 60 | #memory, 61 | #disk, 62 | #temperature, 63 | #backlight, 64 | #network, 65 | #pulseaudio, 66 | #custom-media, 67 | #custom-launcher, 68 | #custom-power, 69 | #custom-layout, 70 | #custom-updater, 71 | #custom-snip, 72 | #taskbar, 73 | #tray, 74 | #mode, 75 | #idle_inhibitor, 76 | #mpd { 77 | padding: 0 10px; 78 | color: black; 79 | } 80 | 81 | #window, 82 | #workspaces { 83 | margin: 0px 4px; 84 | } 85 | 86 | /* If workspaces is the leftmost module, omit left margin */ 87 | .modules-left > widget:first-child > #workspaces { 88 | margin-left: 0px; 89 | } 90 | 91 | /* If workspaces is the rightmost module, omit right margin */ 92 | .modules-right > widget:last-child > #workspaces { 93 | margin-right: 0px; 94 | } 95 | 96 | #clock { 97 | background-color: #FA8BFF; 98 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 99 | color: black; 100 | border-radius: 0px 20px 20px 0px; 101 | margin-right: 4px; 102 | 103 | } 104 | 105 | #battery { 106 | background-color: black; 107 | color: #000000; 108 | } 109 | 110 | #battery.charging, #battery.plugged { 111 | color: black; 112 | background-color: #26A65B; 113 | } 114 | 115 | @keyframes blink { 116 | to { 117 | background-color: black; 118 | color: #000000; 119 | } 120 | } 121 | 122 | #battery.critical:not(.charging) { 123 | background-color: #f53c3c; 124 | color: black; 125 | animation-name: blink; 126 | animation-duration: 0.5s; 127 | animation-timing-function: linear; 128 | animation-iteration-count: infinite; 129 | animation-direction: alternate; 130 | } 131 | 132 | label:focus { 133 | background-color: #000000; 134 | } 135 | 136 | #cpu { 137 | background-color: #FA8BFF; 138 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 139 | color: black; 140 | } 141 | 142 | #memory { 143 | background-color: #FA8BFF; 144 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 145 | color: black; 146 | } 147 | 148 | #disk { 149 | background-color: #FA8BFF; 150 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 151 | color: black; 152 | } 153 | 154 | #backlight { 155 | background-color: #90b1b1; 156 | } 157 | 158 | #network { 159 | background-color: #FA8BFF; 160 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 161 | color: black; 162 | } 163 | 164 | #network.disconnected { 165 | background-color: #FA8BFF; 166 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 167 | color: red; 168 | } 169 | 170 | #pulseaudio { 171 | background-color: #FA8BFF; 172 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 173 | color: black; 174 | } 175 | 176 | #pulseaudio.muted { 177 | background-color: #FA8BFF; 178 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 179 | color: red; 180 | } 181 | 182 | #custom-media { 183 | background-color: #8EC5FC; 184 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 185 | color: black; 186 | border-radius: 20px; 187 | margin-right: 5px; 188 | margin-left: 5px; 189 | } 190 | 191 | #custom-media.custom-spotify { 192 | background-color: #8EC5FC; 193 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 194 | color: black; 195 | border-radius: 20px; 196 | margin-right: 5px; 197 | 198 | } 199 | 200 | #custom-media.custom-vlc { 201 | background-color: #8EC5FC; 202 | background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); 203 | color: black; 204 | border-radius: 20px; 205 | margin-right: 5px; 206 | } 207 | 208 | #custom-power{ 209 | background-color: #FA8BFF; 210 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 211 | font-size: 18px; 212 | border-radius: 20px; 213 | margin-left: 2px; 214 | } 215 | 216 | #custom-launcher{ 217 | background-color: #FA8BFF; 218 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 219 | font-size: 25px; 220 | border-radius: 20px; 221 | margin-right: 2px; 222 | } 223 | 224 | #custom-updater { 225 | background-color: #FA8BFF; 226 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 227 | color: black; 228 | } 229 | 230 | #custom-snip { 231 | background-color: #FA8BFF; 232 | background-image: linear-gradient(45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 233 | color: black; 234 | font-size: 20px; 235 | } 236 | 237 | #custom-layout{ 238 | background-color: #FA8BFF; 239 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 240 | color: black; 241 | font-size: 18px; 242 | border-radius: 20px 0px 0px 20px; 243 | } 244 | 245 | #taskbar { 246 | background-color: #2BD2FF; 247 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #FA8BFF 90%); 248 | border-radius: 20px; 249 | 250 | } 251 | 252 | 253 | #temperature { 254 | background-color: #FA8BFF; 255 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 256 | color: black; 257 | border-radius: 0px 20px 20px 0px; 258 | } 259 | 260 | #temperature.critical { 261 | background-color: #eb4d4b; 262 | } 263 | 264 | #tray { 265 | background-color: #FA8BFF; 266 | background-image: linear-gradient(-45deg, #2BD2FF 0%, #2BD2FF 52%, #2BD2FF 90%); 267 | color: black; 268 | } 269 | 270 | #tray > .passive { 271 | -gtk-icon-effect: dim; 272 | background-color: #FA8BFF; 273 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 274 | color: black; 275 | } 276 | 277 | #tray > .needs-attention { 278 | -gtk-icon-effect: highlight; 279 | background-color: #FA8BFF; 280 | background-image: linear-gradient(-45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 281 | color: black; 282 | } 283 | 284 | #idle_inhibitor { 285 | background-color: #FA8BFF; 286 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 287 | border-radius: 20px 0px 0px 20px; 288 | 289 | } 290 | 291 | #idle_inhibitor.activated { 292 | background-color: #FA8BFF; 293 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 294 | color: black; 295 | border-radius: 20px 0px 0px 20px; 296 | 297 | } 298 | 299 | #language { 300 | background-color: #FA8BFF; 301 | background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BD2FF 90%); 302 | color: black; 303 | min-width: 16px; 304 | padding-left : 8px; 305 | border-radius: 20px 0px 0px 20px; 306 | } 307 | 308 | #keyboard-state { 309 | background: #97e1ad; 310 | color: #000000; 311 | min-width: 16px; 312 | } 313 | 314 | #keyboard-state > label { 315 | padding: 0px 5px; 316 | } 317 | 318 | #keyboard-state > label.locked { 319 | background: rgba(0, 0, 0, 0.2); 320 | } 321 | -------------------------------------------------------------------------------- /waybar-examples/wayfire2/config-wayfire: -------------------------------------------------------------------------------- 1 | { 2 | "layer": "top", 3 | "position": "bottom", 4 | "height": 35, 5 | "spacing": 4, 6 | "margin-top": 0, 7 | "margin-bottom":0, 8 | 9 | // Choose the order of the modules 10 | 11 | "modules-left":[ "custom/launcher", "wlr/taskbar"], 12 | "modules-center":["custom/media"], 13 | "modules-right":["backlight", "battery", "battery#bat2", "idle_inhibitor", "custom/updater", "pulseaudio", "custom/snip", "custom/wallpaper", "tray", "clock", "custom/power"], 14 | // Modules configuration 15 | 16 | "wlr/taskbar": { 17 | "format": "{icon}", 18 | "icon-size": 20, 19 | "icon-theme": "Star", 20 | "tooltip-format": "{title}", 21 | "on-click": "activate", 22 | "on-click-middle": "close", 23 | "on-click-right": "minimize" 24 | }, 25 | "keyboard-state": { 26 | "numlock": true, 27 | "capslock": true, 28 | "format": " {name} {icon}", 29 | "format-icons": { 30 | "locked": "", 31 | "unlocked": "" 32 | } 33 | }, 34 | "sway/language": { 35 | "format": " {}", 36 | }, 37 | "idle_inhibitor": { 38 | "format": "{icon}", 39 | "format-icons": { 40 | "activated": "", 41 | "deactivated": "" 42 | } 43 | }, 44 | "tray": { 45 | "icon-size": 20, 46 | "spacing": 10 47 | }, 48 | "clock": { 49 | // "timezone": "America/New_York", 50 | "tooltip-format": "{:%Y %B}\n{calendar}", 51 | "format-alt": "{:%Y-%m-%d}" 52 | }, 53 | "cpu": { 54 | "format": "{usage}% ", 55 | "tooltip": false 56 | }, 57 | "memory": { 58 | "format": "{}% " 59 | }, 60 | "temperature": { 61 | // "thermal-zone": 2, 62 | // "hwmon-path": "/sys/class/hwmon/hwmon2/temp1_input", 63 | "critical-threshold": 80, 64 | // "format-critical": "{temperatureC}°C {icon}", 65 | "format": "{temperatureC}°C {icon}", 66 | "format-icons": ["", "", ""] 67 | }, 68 | "backlight": { 69 | // "device": "acpi_video1", 70 | "format": "{icon}", 71 | "format-icons": ["", ""], 72 | "on-click": "bash $HOME/.config/system_scripts/brightness up", 73 | "on-click-right": "bash $HOME/.config/system_scripts/brightness down", 74 | "on-scroll-up": "", 75 | "on-scroll-down": "" 76 | }, 77 | "battery": { 78 | "states": { 79 | // "good": 95, 80 | "warning": 30, 81 | "critical": 15 82 | }, 83 | "format": "{icon}", 84 | "format-charging": "{capacity}% ", 85 | "format-plugged": "{capacity}% ", 86 | "format-alt": "{time} {icon}", 87 | // "format-good": "", // An empty format will hide the module 88 | // "format-full": "", 89 | "format-icons": ["", "", "", "", ""] 90 | }, 91 | "battery#bat2": { 92 | "bat": "BAT2" 93 | }, 94 | "network": { 95 | // "interface": "wlp2*", // (Optional) To force the use of this interface 96 | "format-wifi": "{essid} ({signalStrength}%) ", 97 | "format-ethernet": "Connected  ", 98 | "tooltip-format": "{ifname} via {gwaddr} ", 99 | "format-linked": "{ifname} (No IP) ", 100 | "format-disconnected": "Disconnected ⚠", 101 | "format-alt": "{ifname}: {ipaddr}/{cidr}", 102 | "on-click-right": "bash ~/.config/rofi/wifi_menu/rofi_wifi_menu" 103 | }, 104 | "pulseaudio": { 105 | // "scroll-step": 1, // %, can be a float 106 | "format": "{icon}", 107 | "format-bluetooth": "{volume}% {icon}", 108 | "format-bluetooth-muted": "{icon} {format_source}", 109 | "format-muted": "{format_source}", 110 | "format-source": "", 111 | "format-source-muted": "", 112 | "format-icons": { 113 | "headphone": "", 114 | "hands-free": "", 115 | "headset": "", 116 | "phone": "", 117 | "portable": "", 118 | "car": "", 119 | "default": ["", "", ""] 120 | }, 121 | "on-click": "bash $HOME/.config/system_scripts/volume up", 122 | "on-click-right": "bash $HOME/.config/system_scripts/volume down", 123 | "on-scroll-up": "", 124 | "on-scroll-down": "" 125 | }, 126 | "custom/media": { 127 | "format": "{icon} {}", 128 | "return-type": "json", 129 | "max-length": 30, 130 | "format-icons": { 131 | "spotify": " ", 132 | "default": "" 133 | }, 134 | "escape": true, 135 | "exec": "$HOME/.config/system_scripts/mediaplayer.py 2> /dev/null", 136 | "on-click": "playerctl play-pause" 137 | }, 138 | "custom/launcher":{ 139 | "format": "", 140 | "on-click": "wofi --show drun", 141 | "on-click-right": "killall wofi" 142 | }, 143 | "custom/power":{ 144 | "format": " ", 145 | "on-click": "nwg-bar", 146 | "on-click-right": "killall nwg-bar" 147 | }, 148 | "custom/updater":{ 149 | "format": "{} Updates", 150 | "exec": "checkupdates | wc -l", 151 | "exec-if": "[[ $(checkupdates | wc -l) != 0 ]]", 152 | "interval": 15, 153 | "on-click": "alacritty -e yay -Syu" 154 | }, 155 | "custom/snip":{ 156 | "format": "", 157 | "on-click": "grimshot --notify save area $HOME/Pictures/$(zenity --entry --text 'Set filename:' --entry-text '.png')" 158 | }, 159 | "custom/wallpaper":{ 160 | "format": "", 161 | "on-click": "bash ~/.config/system_scripts/pkill_bc" 162 | } 163 | } 164 | 165 | -------------------------------------------------------------------------------- /waybar-examples/wayfire2/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | border: none; 3 | border-radius: 0px; 4 | /* `otf-font-awesome` is required to be installed for icons */ 5 | font-family: Material, Roboto, Helvetica, Arial, sans-serif; 6 | font-size: 13px; 7 | min-height: 0; 8 | /*border-radius: 20px;*/ 9 | 10 | } 11 | window#waybar { 12 | background-image: linear-gradient(to right, #000000 0%, #434343 51%, #000000 100%); 13 | color: #ffffff; 14 | transition-property: background-color; 15 | transition-duration: .5s; 16 | } 17 | 18 | window#waybar.hidden { 19 | opacity: 0.2; 20 | } 21 | 22 | 23 | #workspaces button { 24 | background: #1f1f1f; 25 | color: #ffffff; 26 | border-radius: 20px; 27 | 28 | } 29 | 30 | /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ 31 | #workspaces button:hover { 32 | background: lightblue; 33 | color: black; 34 | border-bottom: 3px solid #ffffff; 35 | 36 | } 37 | 38 | #workspaces button.focused { 39 | background: #1f1f1f; 40 | } 41 | 42 | #workspaces button.focused:hover { 43 | background: lightblue; 44 | color: black; 45 | border-bottom: 3px solid #ffffff; 46 | 47 | } 48 | 49 | #workspaces button.urgent { 50 | background-color: #eb4d4b; 51 | } 52 | 53 | #mode { 54 | background-color: #64727D; 55 | border-bottom: 3px solid #ffffff; 56 | } 57 | 58 | #clock, 59 | #battery, 60 | #cpu, 61 | #memory, 62 | #disk, 63 | #temperature, 64 | #backlight, 65 | #network, 66 | #pulseaudio, 67 | #custom-media, 68 | #custom-launcher, 69 | #custom-power, 70 | #custom-wallpaper, 71 | #custom-updater, 72 | #custom-snip, 73 | #taskbar, 74 | #tray, 75 | #mode, 76 | #idle_inhibitor, 77 | #mpd { 78 | padding: 0 10px; 79 | color: #ffffff; 80 | } 81 | 82 | #window, 83 | #workspaces { 84 | margin: 0px 4px; 85 | } 86 | 87 | /* If workspaces is the leftmost module, omit left margin */ 88 | .modules-left > widget:first-child > #workspaces { 89 | margin-left: 0px; 90 | } 91 | 92 | /* If workspaces is the rightmost module, omit right margin */ 93 | .modules-right > widget:last-child > #workspaces { 94 | margin-right: 0px; 95 | } 96 | 97 | #clock { 98 | background-color: #090909; 99 | color: #ffffff; 100 | } 101 | 102 | #battery { 103 | background-color: #ffffff; 104 | color: #000000; 105 | } 106 | 107 | #battery.charging, #battery.plugged { 108 | color: #ffffff; 109 | background-color: #26A65B; 110 | } 111 | 112 | @keyframes blink { 113 | to { 114 | background-color: #ffffff; 115 | color: #000000; 116 | } 117 | } 118 | 119 | #battery.critical:not(.charging) { 120 | background-color: #f53c3c; 121 | color: #ffffff; 122 | animation-name: blink; 123 | animation-duration: 0.5s; 124 | animation-timing-function: linear; 125 | animation-iteration-count: infinite; 126 | animation-direction: alternate; 127 | } 128 | 129 | label:focus { 130 | background-color: #000000; 131 | } 132 | 133 | #cpu { 134 | color: #ffffff; 135 | } 136 | 137 | #memory { 138 | color: #ffffff; 139 | } 140 | 141 | #disk { 142 | color: #ffffff; 143 | } 144 | 145 | #backlight { 146 | background-color: #90b1b1; 147 | } 148 | 149 | #pulseaudio { 150 | color: #ffffff; 151 | font-size: 18px; 152 | } 153 | 154 | #pulseaudio.muted { 155 | color: red; 156 | } 157 | 158 | #custom-media { 159 | color: whitesmoke; 160 | margin: 5px; 161 | font-size: 13px; 162 | } 163 | 164 | #custom-media.custom-spotify { 165 | background-color: #8EC5FC; 166 | background-image: linear-gradient(to right, #434343 0%, #000000 51%, #434343 100%); 167 | color: whitesmoke; 168 | margin-right: 5px; 169 | } 170 | 171 | #custom-media.custom-vlc { 172 | background-color: #8EC5FC; 173 | background-image: linear-gradient(to right, #434343 0%, #000000 51%, #434343 100%); 174 | color: whitesmoke; 175 | margin-right: 5px; 176 | } 177 | 178 | #custom-power{ 179 | background-image: linear-gradient(to left, #000000 0%, #000000 51%, #434343 100%); 180 | font-size: 20px; 181 | margin-right: 5px; 182 | 183 | } 184 | 185 | #custom-launcher{ 186 | background-image: linear-gradient(to right, #000000 0%, #000000 51%, #434343 100%); 187 | font-size: 20px; 188 | margin-left: 5px; 189 | } 190 | 191 | #custom-wallpaper{ 192 | color: white; 193 | font-size:18px; 194 | } 195 | 196 | #custom-updater { 197 | color: white; 198 | } 199 | 200 | #custom-snip { 201 | color: white; 202 | font-size: 20px; 203 | } 204 | 205 | #taskbar{ 206 | color: white; 207 | } 208 | 209 | #temperature { 210 | color: #ffffff; 211 | } 212 | 213 | #temperature.critical { 214 | background-color: #eb4d4b; 215 | } 216 | 217 | #tray { 218 | color: #ffffff; 219 | } 220 | 221 | #tray > .passive { 222 | -gtk-icon-effect: dim; 223 | color: #ffffff; 224 | } 225 | 226 | #tray > .needs-attention { 227 | -gtk-icon-effect: highlight; 228 | color: #ffffff; 229 | } 230 | 231 | #idle_inhibitor { 232 | font-size: 18px; 233 | 234 | } 235 | 236 | #idle_inhibitor.activated { 237 | color: #ffffff; 238 | 239 | } 240 | 241 | #language { 242 | color: #ffffff; 243 | min-width: 16px; 244 | } 245 | 246 | #keyboard-state { 247 | background: #97e1ad; 248 | color: #000000; 249 | min-width: 16px; 250 | } 251 | 252 | #keyboard-state > label { 253 | padding: 0px 5px; 254 | } 255 | 256 | #keyboard-state > label.locked { 257 | background: rgba(0, 0, 0, 0.2); 258 | } 259 | --------------------------------------------------------------------------------