Alex
Alex

Reputation: 1641

Dont get css in gtk3 with glade to work

I want to load a glade-file and change the color of all toggle-buttons ( class "GtkToggleButton" , I want to change the "pressed" color) The toggle-button is one of many sub-sub-element in the glade-file. Here the C-code-snipped I use to load the .css and the .glade:

void on_minute_pressed(GtkWidget *button)
{
    GtkCssProvider *cssProvider = gtk_css_provider_new ();
    gtk_css_provider_load_from_path(cssProvider,"./test.css",NULL);
    GtkBuilder *builder = gtk_builder_new();
    gtk_builder_add_from_file (builder, "minute_dialog.glade", NULL);
    GtkWidget       *window= GTK_WIDGET(gtk_builder_get_object(builder, "MinuteWizard"));
    gtk_window_set_transient_for (window,main_window);
    gtk_style_context_add_provider(gtk_widget_get_style_context(window),cssProvider,GTK_STYLE_PROVIDER_PRIORITY_USER);
    gtk_builder_connect_signals(builder, NULL);

    gtk_widget_show(window);
    g_object_unref(builder);
}

And here the .css I currently use:

.button {
  padding: 30;
  background-color: shade (@bg_color, 55);
}

togglebutton entry {
  color: 900185;
}

button:active {
  background-color: #0274d9;
}

What currently happens: The new window load's fine, but it seems like it does not matter what I write into the .css, it does not change the look of the window-elements. I can see that the .css is loaded, because I get warnings like:

Gtk-WARNING **: Theme parsing error: test.css:2:13: Not using units is deprecated. Assuming 'px'.

What is wrong ? Do I need to apply the .css to each sub-widged separately?

Upvotes: 2

Views: 5551

Answers (4)

Akshay James
Akshay James

Reputation: 31

Try adding the class name in 'style classes' for the widget in Glade: glade_screenshot_button_attr

Upvotes: 0

Alex
Alex

Reputation: 1641

Ok, I found out myself what was the problem:

According to the documentation of gtk_style_context_add_provider css providers are not inherited to the children style contexts.

So either one needs to apply the css to each single widget, or use gtk_style_context_add_provider_for_screen to change the css of the whole screen:

gtk_style_context_add_provider_for_screen(gdk_screen_get_default(), GTK_STYLE_PROVIDER(cssProvider), GTK_STYLE_PROVIDER_PRIORITY_USER);

Upvotes: 4

jcoppens
jcoppens

Reputation: 5440

A list of suggestions too long to put as comments:

  • Could it be that you have another version of your theme's CSS installed in ~/.themes? If so, that theme will be superseding the theme in /usr/share/themes.

  • Since XDG, there is yet another possibility for the location of the CSS: From the dev documentation ($XDG_CONFIG_HOME below is typically ~/.config):

In addition, certain files will be read when GTK+ is initialized. First, the file $XDG_CONFIG_HOME/gtk-3.0/gtk.css is loaded if it exists. Then, GTK+ loads the first existing file among XDG_DATA_HOME/themes/theme-name/gtk-VERSION/gtk.css, $HOME/.themes/theme-name/gtk-VERSION/gtk.css, $XDG_DATA_DIRS/themes/theme-name/gtk-VERSION/gtk.css and DATADIR/share/themes/THEME/gtk-VERSION/gtk.css, where THEME is the name of the current theme (see the #GtkSettings:gtk-theme-name setting), DATADIR is the prefix configured when GTK+ was compiled (unless overridden by the GTK_DATA_PREFIX` environment variable), and VERSION is the GTK+ version number. If no file is found for the current version, GTK+ tries older versions all the way back to 3.0.

  • Another solution for you might be to use the GtkCssProvider interface for specific widget styles.

An interesting reference is Installing, Obtaining, and Making GTK Themes

Upvotes: 1

makonnen dos santos
makonnen dos santos

Reputation: 348

Try with this

.button {
  padding: 30px; /* px unit added */
  background-color: shade (@bg_color, 55);
}
    
.togglebutton .entry {
  color: #900185; /* # added */
}
    
.button:active {
  background-color: #0274d9;
}
<button class="button">aaaa</button>
<button class="button togglebutton"><span class="entry">aaaa</span></button>

Upvotes: 0

Related Questions