Can anyone use gtk inspector and tell me the class name of the sidebar of gtk4 apps like nautilus
Can anyone use gtk inspector and tell me the class name of the sidebar of gtk4 apps like nautilus
Basically I am using this gtk.css file in ~/.config/gtk-4.0/gtk.css but it's weird that the sidebar is not themed correctly. If anyone knows about this, please do tell. My only lead at this moment is to find the class and add it in gtk.css file. For some reason I can't install the gtk inspector app, So if anyone has it already or knows the classname, please help.
gtk.css file ->
@define-color accent_color #fe8019;
@define-color accent_bg_color #d65d0e;
@define-color accent_fg_color #ebdbb2;
@define-color destructive_color #8ec07c;
@define-color destructive_bg_color #689d6a;
@define-color destructive_fg_color #ebdbb2;
@define-color success_color #b8bb26;
@define-color success_bg_color #98971a;
@define-color success_fg_color #ebdbb2;
@define-color warning_color #fabd2f;
@define-color warning_bg_color #d79921;
@define-color warning_fg_color #ebdbb2;
@define-color error_color #fb4934;
@define-color error_bg_color #cc241d;
@define-color error_fg_color #ebdbb2;
@define-color window_bg_color #282828;
@define-color window_fg_color #ebdbb2;
@define-color view_bg_color #282828;
@define-color view_fg_color #ebdbb2;
@define-color headerbar_bg_color #282828;
@define-color headerbar_fg_color #ebdbb2;
@define-color headerbar_border_color #ebdbb2;
@define-color headerbar_backdrop_color @window_bg_color;
@define-color headerbar_shade_color rgba(0, 0, 0, 0.36);
@define-color card_bg_color rgba(255, 255, 255, 0.08);
@define-color card_fg_color #ebdbb2;
@define-color card_shade_color rgba(0, 0, 0, 0.36);
@define-color dialog_bg_color #3c3836;
@define-color dialog_fg_color #ebdbb2;
@define-color popover_bg_color #3c3836;
@define-color popover_fg_color #ebdbb2;
@define-color shade_color rgba(0, 0, 0, 0.36);
@define-color scrollbar_outline_color rgba(0, 0, 0, 0.5);
Sidebar ->
Defining sidebarbgcolor does not work?
@define-color sidebar_bg_color @define-color sidebar_fg_color @define-color sidebar_backdrop_color @define-color sidebar_border_color @define-color sidebar_shade_color @define-color secondary_sidebar_bg_color @define-color secondary_sidebar_fg_color @define-color secondary_sidebar_backdrop_color @define-color secondary_sidebar_border_color @define-color secondary_sidebar_shade_colorsee libadwaita named colors
GTK Inspector comes with GTK, you don't need to install it.
Enable it with gsettings
gsettings get org.gtk.Settings.Debug enable-inspector-keybinding trueso you can invoke it either by running
GTK_DEBUG=interactive application-name-hereor, when alredy using the application, via Control + Shift + I/Control + Shift + DThat's it. Thank you for this.
You're most certainly welcome.
I wanted to add on this, for anyone else stumbling across this post and struggling with sidebar theming: The above will work 90% of the time, but in case your
some-random-theme.cssoverrides@sidebar_, or doesn't follow the naming convention to begin with, search your gtk.css for.sidebar-pane, which should be the actual css selector for@sidebar_, and.content-panefor@secondary-sidebar_.