Yaru: Black buttons or corners in notifications

[chrisjbillington]

I'm having an issue in gnome-shell 3.30.2 where notifications with buttons are poorly themed.

Expected Behavior

Notifications should be themed as the yaru devs intended, with readable text on the buttons.

Actual Behavior

Notifications with buttons either look like this (notice the blackness around the rounded corners):

Or like this (totally black buttons and unrounded bottom corners)

Notifications with no buttons appear totally fine.

Steps to Reproduce the Problem

The following Python snippet results in a notification with a black button for me:

from gi.repository import Notify
Notify.init("Test App")
notification = Notify.Notification.new("Hi!")
notification.add_action("action_click", "Here is a button", lambda: None, None)
notification.show()

Specifications

I'm using the yaru gnome-shell theme on Arch Linux with gnome shell 3.30.2, I installed the yaru themes via the AUR yaru-git packages, which are, if I understand correctly, are cloning from github and installing the yaru components from the master branch.

[Feichtmeier]

Uhm strange
They work totally fine and without glitches on Ubuntu 18.04 with the snap installation and gnome 3.28 or with 18.10 regular Yaru and gnome 3.30

[chrisjbillington]

Hm. I might ask if anyone else on arch is getting this issue (or see if it reproduces in a virtual box on a clean install). I did try to rule out it having to do with any of the extensions I had enabled.

[godlyranchdressing]

I'm guessing the Arch Linux's package just makes the theme available and not the session, right? My guess is that some of Adwaita's styling is being leaking through. Unless a theme explicitly overwrites Adwaita's rules then you'll see odd stuff like this happening.

[chrisjbillington]

@godlyranchdressing yes, it just makes the theme available, which you choose from gnome-tweaks. The package is just in the user repositories, not the official ones, and I can see it the [build script] (https://aur.archlinux.org/cgit/aur.git/tree/PKGBUILD?h=yaru-git) for the package that it looks like it is removing the x and wayland sessions. I might modify it not to remove them, or make a separate subpackage to include them, see if that works, and take up the issue with the package maintainer.

The way it's implemented is to split yaru up into the separate components to minimise dependencies. But if the theme doesn't quite work without the session then it probably shouldn't be packaged that way.

[Feichtmeier]

I fear we can not do much about this. We only make SCSS styling here :) Thus I am closing this, feel free to reopen aaro/carlo
This is how it looks on ubuntu

[chrisjbillington]

I can confirm this was a packaging issue, apologies for the noise.

The arch package applies a patch that changes some install directories, presumably to make the shell theme available for selection from gnome-tweak, but either this isn't done correctly or is not a valid thing to do because it leads to this bug. If I modify the package build script to just be a plain "ninja -C build install" and log into the Yaru session, everything is great.

[Feichtmeier]

Np! Thanks for contributing

[godlyranchdressing]

Can confirm that this is what I thought it was. I installed Yaru on Fedora and did some symlinking so it was selectable in GNOME Tweaks as opposed to the session. Yaru doesn't overwrite all of Adwaita's styling so if the Yaru _session_ isn't used (which does away with Adwaita and changes the shell's "fallback theme" to /usr/share/gnome-shell/theme/Yaru/gnome-shell.css or something like that) then a couple issues like this will occur.

Should we address? It'll make Yaru more accessible since it can be installed just like any other theme. We'll have to do a side by side comparison with Adwaita and Yaru and make sure that if Adwaita uses something like color: black under one class then Yaru has color: gray under the same class.

Tedious, but doable. Reopening for discussion.

[drakkan]

I'm fixing the Arch package with some symlinks just now, but I agree that Yaru should be installable as any other theme, thanks!

[Feichtmeier]

Sure, if it brings us closer to upstream I think that is a good idea, as long as we can keep track of the changes

[Feichtmeier]

@chrisjbillington could you please test if this is still happening with master?

[chrisjbillington]

The Arch package was changed so that the theme was only available via the session - what do I have to symlink to get it to appear in gnome-tweaks to test this?

[chrisjbillington]

Ended up using an old version of the AUR package to install yaru master such that it is available in gnome-tweaks.

I no longer see black buttons, but still see black in some of the the rounded corners of notifications:

I'll keep running with this arrangement for a while and point out anything else that looks different to the Yaru session.

[Feichtmeier]

Imho, since we use 100% upstream CSS (plus our colours) plus some gtk additions on top of upstream, I can say that this is not fixable with CSS.
It must be related to the session or the build we use that doesn't work with arch.

[Feichtmeier]

Can confirm that this is what I thought it was. I installed Yaru on Fedora and did some symlinking so it was selectable in GNOME Tweaks as opposed to the session. Yaru doesn't overwrite all of Adwaita's styling so if the Yaru _session_ isn't used (which does away with Adwaita and changes the shell's "fallback theme" to /usr/share/gnome-shell/theme/Yaru/gnome-shell.css or something like that) then a couple issues like this will occur.

Should we address? It'll make Yaru more accessible since it can be installed just like any other theme. We'll have to do a side by side comparison with Adwaita and Yaru and make sure that if Adwaita uses something like color: black under one class then Yaru has color: gray under the same class.

Tedious, but doable. Reopening for discussion.

Ah, sometimes it's good to read old comments.
Is this is true, then this should no longer happen in arch or fedora, because we're using upstream themes' common and drawing now and only change the colours. So I think as soon as the gnome shell packages are 3.34 in those distros, those issues should no longer occur. @chrisjbillington could you test this in some test environment with gnome shell 3.34 and yaru master?

[chrisjbillington]

Test environment, bah!

...however I can't build gnome-shell 3.34 on Arch at the moment due to a few libraries that aren't updated on Arch yet. Most required components are in the AUR, but not all are and I'm not about to venture outside my package manager or put more time into this for now!

I'll test once Arch updates to the latest releases of the libraries, shouldn't be more than a few weeks I imagine.

[Feichtmeier]

@chrisjbillington any news yet?

[chrisjbillington]

I've just enabled testing repositories on Arch and upgraded all the GNOME things to 3.34. Am using the latest released version of Yaru, using an older build script from the AUR that makes it selectable in gnome-tweaks instead of via the session, the situation in which this bug was originally observed.

I did see a black corner the first time I made a notification appear, but am now not able to reproduce it, now every notification I get looks correct! And no dark grey buttons.

I wonder if there might be something about using uninitialised memory on rounded corners of things generally - I am seeking black corners on Chrome windows that go away depending on which direction the window is dragged or resized. But that occurs with the default shell and gtk themes and so is probably a mutter/xorg/graphics driver issue. Just mentioning it because it might explain the single black corner I did see on a notification, so that observation might have had nothing to do with Yaru or theming.

Happy to tentatively call this bug fixed if you like, and I'll reopen it if it rears its head again!

[Feichtmeier]

We were still using the upstream gresource in the asstes for some places were our assets were the same so we didnt see this mistake - I am pretty sure that this was the reason. Thanks for all the feedback!