From 325466cb176975721c3c512418f5ca828e5f79c9 Mon Sep 17 00:00:00 2001 From: Price Hiller Date: Tue, 30 May 2023 03:43:39 -0500 Subject: [PATCH] feat(hypr,waybar): finalize visual overhaul --- dots/.config/hypr/wm/appearance.conf | 2 +- dots/.config/hypr/wm/general.conf | 2 +- dots/.config/waybar/config | 95 +++++++++------ dots/.config/waybar/scripts/get-media.bash | 31 +++-- dots/.config/waybar/style.css | 133 +++++++++++++++++---- 5 files changed, 195 insertions(+), 68 deletions(-) diff --git a/dots/.config/hypr/wm/appearance.conf b/dots/.config/hypr/wm/appearance.conf index 0936ef02..5b7f8df1 100644 --- a/dots/.config/hypr/wm/appearance.conf +++ b/dots/.config/hypr/wm/appearance.conf @@ -1,5 +1,5 @@ decoration { - rounding = 8 + rounding = 10 blur = true blur_size = 10 diff --git a/dots/.config/hypr/wm/general.conf b/dots/.config/hypr/wm/general.conf index 1cd5ad69..6e32a1c7 100644 --- a/dots/.config/hypr/wm/general.conf +++ b/dots/.config/hypr/wm/general.conf @@ -6,7 +6,7 @@ general { gaps_in = 5 gaps_out = 10 border_size = 2 - col.active_border = 0xff$waveRed + col.active_border = 0xff$waveRed 0xff$surimiOrange 0xff$sakuraPink 0xff$roninYellow 0xff$crystalBlue 115deg col.inactive_border = 0xff$oniViolet apply_sens_to_raw = false } diff --git a/dots/.config/waybar/config b/dots/.config/waybar/config index 41dd223a..cc39c8b9 100644 --- a/dots/.config/waybar/config +++ b/dots/.config/waybar/config @@ -11,7 +11,7 @@ "disk", "battery", "custom/audio-device", - "custom/pipewire" + "wireplumber" ], "modules-center": [ "custom/media" @@ -34,8 +34,8 @@ "min-length": 5, "design-capacity": true, "states": { - "full": 90, - "warning": 20, + "warning": 30, + "near-critical": 15, "critical": 10 }, "tooltip": false, @@ -57,20 +57,36 @@ ] }, "wlr/workspaces": { - "format": "{icon}", - "format-icons": { - "active": "", - "default": "" - }, + "format": "", "on-scroll-up": "hyprctl dispatch workspace e-1", "on-scroll-down": "hyprctl dispatch workspace e+1", "on-click": "activate" }, "clock": { "format": " {:%a %b %d %I:%M %p}", - "tooltip": true, - "tooltip-format": "{:%Y %B \t week: %V }\n{calendar}", - "min-length": 18 + "format-alt": " {:%H:%M %p}", + "tooltip-format": "{calendar}", + "calendar": { + "mode": "year", + "mode-mon-col": 3, + "weeks-pos": "right", + "on-scroll": 1, + "on-click-right": "mode", + "format": { + "months": "{}", + "days": "{}", + "weeks": "W{}", + "weekdays": "{}", + "today": "{}" + } + }, + "actions": { + "on-click-right": "mode", + "on-click-forward": "tz_up", + "on-click-backward": "tz_down", + "on-scroll-up": "shift_up", + "on-scroll-down": "shift_down" + } }, "custom/lock": { "tooltip": false, @@ -79,15 +95,25 @@ "on-click": "swaylock" }, "network": { - "interval": 10, - "format-wifi": " {essid}", - "format-ethernet": " {ipaddr}", - "format-linked": " {ifname}", - "format-disconnected": " Disconnected", + "on-click-right": "iwctl station wlan0 disconnect", + "interval": 1, + "format-alt": " {bandwidthUpBytes} |  {bandwidthDownBytes}", + "format-disconnected": "{icon} Disconnected", + "format-linked": " {ifname} | ↕ {bandwidthTotalBytes}", + "format-wifi": "{icon} {essid} | ↕ {bandwidthTotalBytes}", + "format-ethernet": "{icon} {ipaddr}/{cidr} | ↕ {bandwidthTotalBytes}", + "tooltip-format": "{ifname}: {ipaddr}/{cidr} 󰌹 {gwaddr}", + "format-icons": { + "ethernet": "󰈀", + "disconnected": "", + "wifi": [ + "󰖪", + "" + ] + }, "tooltip": true, - "tooltip-format": "IP: {ipaddr}/{cidr}\nGW: {gwaddr}/{cidr}\nNM: {netmask}", - "max-length": 20, - "min-length": 14 + "max-length": 60, + "min-length": 30 }, "custom/audio-device": { "tooltip": false, @@ -96,21 +122,16 @@ "format": " {}", "exec": "wpctl status | grep -m 1 '*' | cut -d '.' -f2 | cut -d '[' -f1 | xargs" }, - "custom/pipewire": { - "format": "{icon} {percentage}%", - "return-type": "json", - "signal": 8, - "interval": "once", - "format-icons": { - "mute": "婢", - "default": [ - "奄", - "奔", - "墳" - ] - }, - "on-click": "pw-volume mute toggle; pkill -RTMIN+8 waybar", - "exec": "pw-volume status" + "wireplumber": { + "format": "{icon}{volume}%", + "format-muted": "󰖁 0%", + "on-right-click": "helvum", + "on-click": "pw-volume mute toggle", + "format-icons": [ + "󰕿 ", + "󰖀 ", + "󰕾 " + ] }, "idle_inhibitor": { "tooltip": false, @@ -149,6 +170,8 @@ "custom/asusmode": { "interval": 1, "format": " {}", + "on-click": "asusctl profile -n", + "on-click-right": "rog-control-center", "exec": "asusctl profile -p | awk '{print $NF}'" }, "memory": { @@ -164,14 +187,14 @@ "interval": 60, "tooltip-format": "{used} used out of {total} ({percentage_used}%)", "min-length": 5, - "format": "🖴 {percentage_used}%", + "format": "󰋊 {percentage_used}%", "states": { "critical": 90 } }, "custom/media": { - "interval": 1, "return-type": "json", + "on-click": "playerctl play-pause", "exec": "~/.config/waybar/scripts/get-media.bash", "escape": true } diff --git a/dots/.config/waybar/scripts/get-media.bash b/dots/.config/waybar/scripts/get-media.bash index bd68faa3..f7203da2 100755 --- a/dots/.config/waybar/scripts/get-media.bash +++ b/dots/.config/waybar/scripts/get-media.bash @@ -1,22 +1,33 @@ #!/usr/bin/env bash -main() { +get-album-info () { local class local text="" - class="$(playerctl metadata --format '{{lc(status)}}')" - local player_ctl_info - player_ctl_info="$(playerctl metadata --format '{{ artist }} | {{ title }} | {{ album }}')" + while :; do + if class="$(playerctl metadata --format '{{lc(status)}}')"; then + local player_ctl_info + player_ctl_info="$(playerctl metadata --format '{{ artist }} | {{ title }} | {{ album }}')" - if [[ "${class}" == "playing" ]]; then - text=" ${player_ctl_info}" + if [[ "${class}" == "playing" ]]; then + text=" ${player_ctl_info}" - elif [[ "${class}" == "paused" ]]; then - text=" ${player_ctl_info}" - fi + elif [[ "${class}" == "paused" ]]; then + text=" ${player_ctl_info}" + fi + else + class="paused" + text="󰓄 No Media" + fi - printf '{"class": "%s", "text": "%s"}\n' "${class}" "${text}" + printf '{"class": "%s", "text": "%s"}\n' "${class}" "${text}" + sleep .08 + done +} + +main() { + get-album-info } main diff --git a/dots/.config/waybar/style.css b/dots/.config/waybar/style.css index be40d439..6298443a 100644 --- a/dots/.config/waybar/style.css +++ b/dots/.config/waybar/style.css @@ -58,13 +58,14 @@ #battery, #disk, #custom-audio-device, -#custom-pipewire, #workspaces, #custom-media, #custom-weather, #custom-launcher, #network, #clock, +#wireplumber, +#image, #custom-lock { background-color: #16161d; color: #dcd7ba; @@ -72,6 +73,19 @@ border-radius: 20px; } +/* Media */ +#custom-media { + margin: 0; + background: linear-gradient( + -45deg, + rgba(126, 156, 216, 0.9), + rgba(210, 126, 153, 0.9), + rgba(149, 127, 184, 0.9) + ); + background-size: 400% 400%; + animation: gradient_scroll 10s ease infinite; +} + /* Launcher */ #custom-launcher { padding-right: 0.3rem; @@ -84,48 +98,88 @@ #cpu, #temperature, #memory, -#disk { +#disk, +#battery { color: #7e9cd8; + margin-left: 0rem; + margin-right: 0rem; } #cpu { border-top-right-radius: 0; border-bottom-right-radius: 0; - padding-left: 1rem; - padding-right: 0.2rem; - margin-right: 0rem; + padding-right: 0em; } #memory { border-radius: 0px; padding-left: 0.1rem; padding-right: 0.35rem; - margin-left: 0rem; - margin-right: 0rem; } #temperature { border-radius: 0px; padding-left: 0.35rem; padding-right: 0.35rem; - margin-left: 0rem; - margin-right: 0rem; } #disk { - color: #ff5d62; - border-top-left-radius: 0; - border-bottom-left-radius: 0; + color: #dca561; + border-radius: 0px; padding-left: 0.35rem; padding-right: 1rem; +} + +#battery { margin-left: 0rem; + padding-left: 0rem; + border-top-left-radius: 0; + border-bottom-left-radius: 0; + color: #98bb6c; +} + +#battery.warning { + color: #e6c384; +} + +#battery.near-critical { + color: #c34043; +} + +#battery.critical { + color: #e82424; + animation: blink_text 1.5s linear infinite; +} + +/* Audio Device & Wireplumber Audio Return */ +#custom-audio-device, +#wireplumber { + margin-right: 0rem; +} + +#custom-audio-device { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + padding-right: 0.35rem; + color: #ff9e3b; +} + +#wireplumber { + border-top-left-radius: 0; + padding-left: 0.35rem; + border-bottom-left-radius: 0; + margin-left: 0rem; + color: #d27e99; } /* Worksapces */ #workspaces { - border-radius: 14px; margin-left: 0.25rem; margin-right: 0.25rem; + margin-top: 0rem; + margin-bottom: 0rem; + padding-top: 1em; + padding-bottom: 1em; } #workspaces * { @@ -133,12 +187,15 @@ } #workspaces button { - padding: 0px; - margin: 5px 5px; - min-height: 0.75rem; - min-width: 0.75rem; - border-radius: 100%; + border-radius: 50%; + min-height: 0.0em; + min-width: 0.0em; + padding-left: 0.0rem; + padding-right: 0.0rem; + padding-top: 0.4rem; + padding-bottom: 0.4rem; background-color: #54546d; + color: transparent; } #workspaces button.active { @@ -169,8 +226,26 @@ /* Asus Fan Mode */ #custom-asusmode { - margin-right: 0.25rem; - margin-left: 0.25rem; + color: #ffa066; +} + +/* Network */ +#network { + color: #a3d4d5; +} + +#network.disconnected { + color: #e6c384; +} + +/* Clock */ +#clock { + color: #ff5d62; +} + +/* Lock */ +#custom-lock { + color: #957fb8; } /*=============*/ @@ -189,3 +264,21 @@ background-position: 400% 200%; } } + +@keyframes blink_text { + 50% { + color: transparent; + } +} + +@keyframes gradient_scroll { + 0% { + background-position: 0% 50%; + } + 50% { + background-position: 100% 50%; + } + 100% { + background-position: 0% 50%; + } +}