Add GTK3 wallpaper color overrides for Electron/GTK3 apps

Create gtk3-colors.css matugen template and import it in GTK3
gtk.css so apps like Vesktop get wallpaper-based headerbar colors.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
ediblerope 2026-04-14 09:46:45 +01:00
parent 25189a0d99
commit 6c6794efb9
3 changed files with 20 additions and 0 deletions

View file

@ -48,6 +48,10 @@
input_path = "${inputs.self}/templates/gtk4-colors.css"
output_path = "${config.home.homeDirectory}/.config/gtk-4.0/colors.css"
[templates.gtk3]
input_path = "${inputs.self}/templates/gtk3-colors.css"
output_path = "${config.home.homeDirectory}/.config/gtk-3.0/colors.css"
[templates.gnome-shell]
input_path = "${inputs.self}/templates/gnome-shell.css"
output_path = "${config.home.homeDirectory}/.local/share/themes/WallpaperShell/gnome-shell/gnome-shell.css"

View file

@ -100,6 +100,7 @@
'';
home.file.".config/gtk-3.0/gtk.css".force = true;
home.file.".config/gtk-3.0/gtk.css".text = ''
@import url("colors.css");
headerbar {
min-height: 0;
padding: 0;

15
templates/gtk3-colors.css Normal file
View file

@ -0,0 +1,15 @@
@define-color accent_color {{colors.primary.default.hex}};
@define-color accent_bg_color {{colors.primary_container.default.hex}};
@define-color accent_fg_color {{colors.on_primary_container.default.hex}};
@define-color window_bg_color {{colors.surface.default.hex}};
@define-color window_fg_color {{colors.on_surface.default.hex}};
@define-color view_bg_color {{colors.surface_container_low.default.hex}};
@define-color view_fg_color {{colors.on_surface.default.hex}};
@define-color headerbar_bg_color {{colors.surface_container.default.hex}};
@define-color headerbar_fg_color {{colors.on_surface.default.hex}};
@define-color card_bg_color {{colors.surface_container_high.default.hex}};
@define-color card_fg_color {{colors.on_surface.default.hex}};
@define-color sidebar_bg_color {{colors.surface_container.default.hex}};
@define-color sidebar_fg_color {{colors.on_surface.default.hex}};
@define-color popover_bg_color {{colors.surface_container.default.hex}};
@define-color popover_fg_color {{colors.on_surface.default.hex}};