refi64 / stylepak

Automatically install your host GTK+ theme as a Flatpak
Mozilla Public License 2.0
430 stars 20 forks source link

Doesn't work for themes with "assets" #13

Closed iommu closed 3 years ago

iommu commented 3 years ago

See themes such as Nordic Polar which has an assets directory for icons like close and such.

Not including this directory means that the icons end up blank

refi64 commented 3 years ago

Due to the way the GTK3 theme extension point is set up, the entire extension contents need to be in the gtk-3.0 directory, so this is not possible. You could probably just copy the entire assets folder into the gtk-3.0 folder and then use sed to quickly edit the URLs, but it's not something I'm keen to add in here (because trying to make it generic would be incredibly error-prone).

iommu commented 3 years ago

I completely understand not wanting to find/replace ../ with ./ however I think I might have just found a workaround for this issue that doesn't add possible errors.

GTK's CSS has the @import operator which allows for importing CSS files from a different local directory while still keeping their relative paths.

image

So here I've edited the flatpak runtime directory /var/lib/flatpak/runtime/org.gtk.Gtk3theme.Nordic-Polar/x86_64/3.22/active/files adding the entire directory of my system theme and editing gtk.css deleting every line and adding only @import url('./Nordic-Polar/gtk-3.0/gtk.css'); which seems to be working quite well.

iommu commented 3 years ago

Ok so I've been running this for a bit over a month now and I've seen 0 issues with any flatpak application. So if it's ok with you I'd like to reopen the issue and possibly at some time create a pull request to add this CSS linking as a CLI option

eggbean commented 3 years ago

@iommu Have you got a public repository with your fork?

iommu commented 3 years ago

https://github.com/iommu/pakitheme/tree/import-option Here, I just made this :)

iommu commented 3 years ago

use-import is a secondary option so running ./pakitheme install-system use-import is how you use it

eggbean commented 3 years ago

@iommu Thanks for that, but unfortunately I am unable to get it to work. I am using this theme (the admin-gtk3-dark-slimmer-osx variant). The installation instructions install it at ~/.themes, so I tried syncing it to /usr/share/themes in a way that also converts the symlinks to real files, but still the same negative result.

jason@hydra:~/pakitheme$ ./pakitheme install-user
Converting theme: admin-gtk3-dark-slimmer-osx
Found theme located at: /home/jason/.themes/admin-gtk3-dark-slimmer-osx
Processing application org.gtk.Gtk3theme.admin-gtk3-dark-slimmer-osx
Saving AppStream /home/jason/.cache/pakitheme/admin-gtk3-dark-slimmer-osx/build/files/share/app-info/xmls/org.gtk.Gtk3theme.admin-gtk3-dark-slimmer-osx.xml.gz
Done!
b3a953d387d1861a72c1add7bfcac2a3f3e00f3073503183f079b3877c17b80c
25562d746efc24133156730a090cb9100f1af8e29a349b1c2896c931334bf6cd

        ID                                                           Branch                Op                Remote                                            Download
 1. [✓] org.gtk.Gtk3theme.admin-gtk3-dark-slimmer-osx                3.22                  i                 admin-gtk3-dark-slimmer-osx-origin                0 bytes

Installation complete.

jason@hydra:~/pakitheme$ ./pakitheme install-user use-import
Converting theme: use-import
Could not locate theme.

jason@hydra:~/pakitheme$ mkdir /usr/share/themes/admin-gtk3-dark-slimmer-osx/
jason@hydra:~/pakitheme$ rsync --archive --copy-links --recursive ~/.themes/AdMin/admin-gtk3-dark-slimmer-osx/ /usr/share/themes/admin-gtk3-dark-slimmer-osx/

jason@hydra:~/pakitheme$ sudo ./pakitheme install-system use-import
Converting theme: use-import
Could not locate theme.
iommu commented 3 years ago

Are you in the import-option branch? git checkout import-option (sorry, should have made this more obvious)

That looks like it's interpreting 'use-import' as the theme name which it shouldn't do in my branch

eggbean commented 3 years ago

Thanks. When I clone it I get the master branch only. In Settings>Branches you can set the default branch, I think. I figured out that I could get it with git clone -b import-option https://github.com/iommu/pakitheme.git

Now it seems to work, but I am not getting the result I was expecting. Maybe I am misunderstanding what it is supposed to do, but when I try opening a flatpak application like 'Getting Things GNOME!' I do get the theming that pakitheme enabled, but I am not getting the window decoration (specifically the min/max/close buttons) that I was expecting your mod to provide. Am I doing something wrong?

jason@hydra:~$ git clone -b import-option https://github.com/iommu/pakitheme.git
Cloning into 'pakitheme'...
remote: Enumerating objects: 41, done.
remote: Counting objects: 100% (33/33), done.
remote: Compressing objects: 100% (23/23), done.
remote: Total 41 (delta 16), reused 25 (delta 10), pack-reused 8
Receiving objects: 100% (41/41), 14.84 KiB | 14.84 MiB/s, done.
Resolving deltas: 100% (18/18), done.
jason@hydra:~$ cd pakitheme
jason@hydra:~/pakitheme$ git branch
* import-option
jason@hydra:~/pakitheme$ ./pakitheme install-user use-import
Converting theme: admin-gtk3-dark-slimmer-osx
Found theme located at: /home/jason/.themes/admin-gtk3-dark-slimmer-osx
Processing application org.gtk.Gtk3theme.admin-gtk3-dark-slimmer-osx
Saving AppStream /home/jason/.cache/pakitheme/admin-gtk3-dark-slimmer-osx/build/files/share/app-info/xmls/org.gtk.Gtk3theme.admin-gtk3-dark-slimmer-osx.xml.gz
Done!
8c75cfcf95239b3a10ffa331c1e32aff8007acc039d53fe9be299d7f2a013ccd
e7af69c7568f9a7df13b496673444b2a67262c1952d29cded7fb1ea35548c70a

        ID                                                           Branch                Op                Remote                                            Download
 1. [✓] org.gtk.Gtk3theme.admin-gtk3-dark-slimmer-osx                3.22                  i                 admin-gtk3-dark-slimmer-osx-origin                0 bytes

Installation complete.
iommu commented 3 years ago

The way my patch works is it change from just importing the files of the $theme/gtk-3.*/ directory to importing the entire theme directory (which usually contains all the assets necessary). However looking at how that theme you're using works it seems to install a little weird meaning it's not self contained to just the theme folder, but also needs the entire AdMin base folder as well to work. This IMO is a little bit of an edge case and will require a lot more work and so I don't think I'll integrate functionality for it into the patch.

(however, as a trash patch that just gets it working for you, change these lines to this Line 85 : cp -a "$theme_path/../../AdMin/" "$build_dir/files" #include external dependency folder Line 92 : echo "@import url('./AdMin/$(basename "${theme_path}")/gtk-3.$theme_gtk_version/gtk.css');" >> "$build_dir/files/gtk.css" I tested this and it does work for your theme specifically)

eggbean commented 3 years ago

@iommu Thanks a lot for your help. Seems to be working fine now and everything is looking great. Hopefully gtk-4.0 is not going to cause much grief.

iommu commented 3 years ago

NP ❤️ but unfortunately this isn't really a GTK3 issue, it's just an issue of there being many ways to program a theme with CSS being able to import assets from any directory.

As a more universal all solution I think writing a more in depth script that searches the gtk.css file for all assets and imports them could work but that would take quite a bit of time and would need to be written is a different programming language like python.

eggbean commented 3 years ago

I don't know much about theming, but I have been jumping through a lot of hoops just because I wanted to make the titlebars thinner and I have found that it is not easy with a gtk-3.0-only theme with no gnome-shell support. I don't think I have come across any gtk-4.0 apps yet and I don't know what to expect with this setup., but hopefully things like this will be written or updated.