sway: waybar background based on smart_gaps

[primalmotion]

I've looked around but I could not find any issue related to this. I would like to be able to use a different style for the general background of waybar based on gaps. I use smart_gaps in sway that basically removes any gaps when there is only one window in a workspace. I usually set the waybar background transparent, but I would like to use a solid color when the windows actually "touch" waybar.

Is this something we can do and I missed it, or is it something we could add support for in waybar?

Awesome project otherwise!

[WuerfelDev]

I don't think it's currently possible
My 'solution' was to use a black-to-transparent gradient. It is not too distracting with only one window, but still offers the transparency when gaps are there, or the wallpaper is visible.

This works well for me:

background: linear-gradient(0deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.6) 100%);

(https://gitlab.com/WuerfelDev/dotfiles/-/blob/master/dots/waybar/.config/waybar/style.css#L10)

[primalmotion]

Thanks for the tip, but my mom does not want me to use gradients :)
Would there be a way to code it, or is there some wayland limitations? I have written a small python script using i3ipc to determine if the current workspace has one single window or not, but I can't find a way to tell waybar to dynamically update the style.

[WuerfelDev]

You should be able to change the name (which is essentially a css class) of the bar via IPC: https://github.com/Alexays/Waybar/wiki/Configuration#bar-config
Then in your style.css just add this: (assuming you set the name to 'singlewindow')

window#waybar.singlewindow {
    background: black;
}

Then with a nice fade out transition:

window#waybar {
    background: rgba(0,0,0,0);
    transition: background .3s;
}

window#waybar.singlewindow {
    background: rgba(0,0,0,1);
    transition: none;
}

[primalmotion]

Oh. This feels so close, but I can't figure out how to change the bar name from IPC..

[WuerfelDev]

I have not used IPC so I don't really know, but I have another idea.
From what I've read is that you can change the mode via IPC so you could have two almost identical sway bars, one with solid color and one transparent. Then you have to toggle the modes for both bars between your default mode and invisible. However I am not sure if you can toggle modes individually per bar...

Or the hacky way: trigger a bash script that swaps the style.css with a copy that has a solid background bar. Then reload waybar killall -SIGUSR2 waybar

[primalmotion]

It feels hacky. I will try to do dig a bit more on switching the bar name. thanks for the suggestions!

[victordiaz]

I would love to have something like this.

I nice solution would be to add/remove/toggle a class dynamically to an ID selector sending a signal, the same way you can send a signal to a module to update.

For example if the selector is window#waybar we could add a class .dark to it that darkens the bar.
That would give a lot of flexibility also to show and hide elements of the bar, scaling or highlight as we want...

[primalmotion]

Another dead end I ended up in was to try using swaymsg 'bar bar-0 colors background #ff0000'. This effectively changes the background color of swaybar, but waybar does not seem to listen to this

[RobertMueller2]

Apologies if I don't understand the use case correctly. I don't think there's much of a chance for waybar to get aware of smartgaps configuration in a dynamic way. But it does have different styles for the window#waybar.empty und window#waybar.solo when the sway-window module is active, depending on how many windows are in the workspace. The classes are added to the main waybar rather than the label widget underlying the window module. So something like the below should have a transparent waybar if there's many or no containers, and a soild waybar if there's just one window.

Does this help?

window#waybar {
  background-color: transparent;
}

window#waybar.solo {
  background-color: #333333;
}

window#waybar.solo #window {
  color: #ffffff;
}

[primalmotion]

@RobertMueller2 yes this is exactly what I want to achieve. The smartgaps thing is probably me poorly explaining what I was needing :) You say these classes should work even without your patch? Because I just tried what you wrote above, but I can't see it doing anything

[primalmotion]

ooooh with the sway-window module active! it works!