From 7978162b94d755b2486b0696bd425355390b52ec Mon Sep 17 00:00:00 2001 From: Nikolai Papin Date: Sun, 28 Sep 2025 22:04:17 +0300 Subject: [PATCH] feat: transition for stopped and playing mpd widget --- waybar/config.jsonc | 16 ++++++++-------- waybar/style.css | 23 +++++++++++++---------- 2 files changed, 21 insertions(+), 18 deletions(-) diff --git a/waybar/config.jsonc b/waybar/config.jsonc index e4072b7..b61f082 100644 --- a/waybar/config.jsonc +++ b/waybar/config.jsonc @@ -107,7 +107,7 @@ }, "tooltip-format": "MPD (connected)", "tooltip-format-disconnected": "MPD (disconnected)", - "format-stopped": "", + "format-stopped": " Stopping player...", "on-click": "mpc toggle --password kapuchinamusica" }, "idle_inhibitor": { @@ -142,7 +142,7 @@ } }, "cpu": { - "format": "󰓅 {load:2.0f}%", + "format": "󰓅 {usage}%", "tooltip": false, "interval": 3, "format-icons": [ @@ -158,7 +158,7 @@ }, "memory#swap": { "format": "󰋊 {swapPercentage}%", - "interval": 3, + "interval": 10, "format-icons": [ "󰄰", "󰪞", "󰪟", "󰪠", "󰪡", "󰪢", "󰪣", "󰪤", "󰪥" ] @@ -182,13 +182,13 @@ "warning": 30, "critical": 18 }, - "format": "{capacity}% {icon}", - "format-full": "{capacity}% {icon}", - "format-charging": "{capacity}% {icon}󱐋", - "format-plugged": "{capacity}% {icon}", + "format": "{icon} {capacity}%", + "format-full": "{icon} {capacity}%", + "format-charging": "{icon}󱐋 {capacity}%", + "format-plugged": "{icon} {capacity}%", "format-alt": "{time} {icon}", // "format-good": "", // An empty format will hide the module - "format-full": "󰋑", + "format-full": "󱈏", "format-icons": ["󰂎", "", "", "󰁽", "", "󰁿", "", "󰂁", "󰂂", ""], "tooltip-format": "{capacity}%, draws {power:2.1f}W, time is {time}" }, diff --git a/waybar/style.css b/waybar/style.css index 4f47453..184b783 100644 --- a/waybar/style.css +++ b/waybar/style.css @@ -36,10 +36,11 @@ window#waybar.chromium { } /* Common module styling */ -.modules-right, #mpd.playing, #mpd.paused { +.modules-right, #mpd { background: linear-gradient(to bottom, @bg-primary, @bg-secondary); border: 3px solid @border-color; border-top: none; + padding: 0 10px; } .modules-left { @@ -53,19 +54,21 @@ window#waybar.chromium { } /* MPD player states */ -#mpd.stopped { - border: none; - border-radius: 0 0 10px 10px; -} - -#mpd.playing, #mpd.paused { - border-radius: 0 0 10px 10px; +#mpd { + transition: color 2s ease-out, border-bottom 2s ease-out, background 2s ease-out, border-color 2s ease-out; + border-radius: 0 0 10px 10px; } #mpd.playing { color: @accent-alt; } +#mpd.stopped { + border-color: transparent; + background: transparent; + color: transparent; +} + /* Workspaces */ #workspaces { background: linear-gradient(to bottom, @bg-primary, @bg-secondary); @@ -132,7 +135,7 @@ window#waybar.chromium { /* Module base styling */ #clock, #battery, #cpu, #memory, #disk, #temperature, #backlight, #network, #pulseaudio, #wireplumber, #custom-media, #tray, #mode, -#idle_inhibitor, #scratchpad, #mpd { +#idle_inhibitor, #scratchpad { padding: 0 10px; color: @text-primary; transition: color 2s ease-out, border-bottom 2s ease-out, background 2s ease-out; @@ -148,7 +151,7 @@ window#waybar.chromium { transition: color 0.5s ease-out, border-bottom 0.5s ease-out, background 0.5s ease-out; } -#mpd:hover { +#mpd.playing:hover, #mpd.paused:hover { color: @accent-color; animation: hover 0.2s 1; }