Flatpak apps are not properly themed if a accent color other than the default is choosed

[Nicolás Abel Carbone]

If I use any accent color other than the default orange, flatpak apps use the default old adwaita theme.

These is specially obvious/important if using the dark variant of the theme, as the flatpak app will use a light theme.

I attach screenshots of a flatpak app when using the default accent color and a different accent color, as well as the list of the installed yaru flatpak themes. The used accent color seems to be installed.

ProblemType: Bug
DistroRelease: Ubuntu 22.04
Package: yaru-theme-gtk 22.04.4
ProcVersionSignature: Ubuntu 5.17.0-1003.3-oem 5.17.0
Uname: Linux 5.17.0-1003-oem x86_64
ApportVersion: 2.20.11-0ubuntu82
Architecture: amd64
CasperMD5CheckResult: pass
CurrentDesktop: ubuntu:GNOME
Date: Mon Apr 25 19:09:38 2022
InstallationDate: Installed on 2022-02-02 (82 days ago)
InstallationMedia: Ubuntu 21.10 "Impish Indri" - Release amd64 (20211012)
PackageArchitecture: all
RebootRequiredPkgs: Error: path contained symlinks.
SourcePackage: yaru-theme
UpgradeStatus: Upgraded to jammy on 2022-03-18 (38 days ago)

[Launchpad Janitor (janitor)]

Status changed to 'Confirmed' because the bug affects multiple users.

[Santiago Fernández Núñez (santiagofn)]

I'm also seeing this. There are popular GNOME apps that recommend installing them as Flatpak so it could generate some inconsistency. Extension Manager is a full GTK 4 app and it doesn't respect the system choice.

[Ernst Persson (ernstp)]

I've started a thread about it here also: https://github.com/flathub/org.gtk.Gtk3theme.Yaru-Red-dark/issues/1#issuecomment-1089261840

[Nicolás Abel Carbone (nicocarbone)]

Since I couple of days ago, I can no longer reproduce this bug, at least with Yaru-prussiagreen. I am not sure what update fixed it, if any. Maybe it is still not solved for all accent colors?

[Nicolás Abel Carbone (nicocarbone)]

By the way, @santiagofn: Have you installed the corresponding flatpak gtk theme for the accent color you are using?

[Joao M (inzrtuzr)]

For a Flatpak application to follow the system theme in use, the corresponding Flatpak theme needs to be installed. For example, if I use the "Yaru" theme in "Dark mode" with the "Prussian Green" accent color, the "org.gtk.Gtk3theme.Yaru-prussiangreen-dark" needs to be installed. If it is, both system applications and Flatpak applications look consistent.
However, only a few themes are available in the Flathub repos. If you search for Yaru themes on Flathub (flatpak search Yaru), you will notice there are alot of variations, but only the packages not presenting a "Version" number correspond to the new 22.04 Yaru theme. As such, only the following Yaru (22.04) themes have a correspondent Flatpak theme:

Yaru
Yaru-dark
Yaru-sage
Yaru-bark
Yaru-bark-dark
Yaru-prussiangreen
Yaru-prussiangreen-dark
Yaru-olive
Yaru-olive-dark
Yaru-magenta
Yaru-magenta-dark

For a consistent look between Flatpak and non-Flatpak applications in Ubuntu 22.04, the missing accent color themes need to be available in Flathub.

[Santiago Fernández Núñez (santiagofn)]

Hi @nnicocarbone. I didn't know I needed to install the accent color themes manually (I'd say most users wouldn't know how to do it). I visited Flathub and now I have these themes installed:

- org.gtk.Gtk3theme.Yaru
- org.gtk.Gtk3theme.Yaru-Orange
- org.gtk.Gtk3theme.Yaru-Orange-dark
- org.gtk.Gtk3theme.Yaru-Orange-light
- org.gtk.Gtk3theme.Yaru-Orange-light
- org.gtk.Gtk3theme.Yaru-dark

I've selected the dark theme and an orange accent in Ubuntu but Extension Manager is still showing a blue accent.

[Marco Trevisan (Treviño) (3v1n0)]

Yaru team added flatpaks to flathub, but not sure why they are not picked: https://github.com/flathub/?q=yaru&type=all&language=&sort=

HOWEVER.... If the application is GTK4 *and* uses libadwaita, there's no way to make it use the accent color as we had to patch libadwaita for that.

[Brandon Liles (brandon.liles)]

Installing the flatpak version of the theme fixes things more many of the accent colors, but due to case sensitivity and inconsistently named themes, it does not fix all accent colors.

Due to apps like Thunderbird using a blue color scheme, I prefer Yaru's blue accent so that my UI can be consistent, but system theme is named Yaru-blue while the flatpak is named Yaru-Blue, this results in Flatpak apps not using the correct theme.

If the case can just be made consistent theming will be more consistent.