MX Linux Forum

Posted: **Tue Jul 24, 2018 9:10 pm**

For those wishing to theme Whiskermenu… in gtk3, here is an example theme. I have made it so that it compliments the POP! Theme nicely (from system76). Hopefully it will give folks a useful template to edit and customize for their own purposes.

This file should be placed in your /home/username/.config/gtk-3.0 folder as gtk.css:

/* bottom of the main body area */
#whiskermenu-window {
background-color: #393634;
color: #E5E5E5;
}

/* Make sidebar buttons match */
#whiskermenu-window button {
background-color: #574F4A;
color: #F1E9E9;
}
#whiskermenu-window button:hover {
background-color: #B0710B;
color: #FFA500;
}
#whiskermenu-window button:checked {
background-color: #574F4A;
color: white;
}

/* main body area */

#whiskermenu-window treeview:hover {
background-color: #F3E8D4;
color: #251212;
}

#whiskermenu-window treeview {
background-color: #F9F9F9;
color: #1a1a1a;
}

/* whiskermenu outer border */

#whiskermenu-window border {
background-color: #574F4A;
border-color: #4C4845;
}

Just log out and login to see the changes...

Posted: **Wed Jul 25, 2018 3:29 am**

thanks sparker (you are also using sparky, aren't you? )
and welcome to mx

Posted: **Wed Jul 25, 2018 4:40 am**

That's useful info. Thanks. Let's hope this doesn't come to MX-17 and break our current themes.

Is there no fallback for the gtk3 version to the gtk3 theme in use? The gtk2 version just adopts the gtk2 (gtkrc file) theme colors.

Posted: **Wed Jul 25, 2018 5:24 am**

Thanks for the helpful post, @manyroads! I think I saw you post this in Manjaro forum as well.

Right now MX17.1 itself is still using gtk2 Whisker and XFCE, but your post is great for those people who are using the gtk3 version of Whisker Menu, maybe because they are using Debian Testing or Sid base. And of course, eventually MX Linux will be using gtk3 XFCE and Whisker once XFCE 4.14 is officially released and reaches Debian Stable repos.

Last week, a poster asked a question here: https://forum.mxlinux.org/viewtopic.php?f=104&t=45828

but from his/her posts, I think it was indeed the gtk3 version of Whisker that was being run.

After reading that thread, I got interested in trying to tweak the themeing for gtk3 Whisker, where previously I had only tweaked the themeing for gtk2 whisker.

I found an earlier thread in Manjaro forum that had enough basic information. Then I made an oomox-numix theme that looked like a hybrid of mx-greybird and mediterranean themes, and edited some configs in gtk2.0, gtk3.0 and gtk3.20 folders so that it used the MX17 panel/whisker colour scheme, whether one used gtk2 or gtk3 versions of whisker menu.

I'll post the screenshots of my experiments tonight when I get home from work. :-)

dreamer wrote:Is there no fallback for the gtk3 version to the gtk3 theme in use? The gtk2 version just adopts the gtk2 (gtkrc file) theme colors.

After my initial tests with oomox, I think that this is not a question of whether there is a fallback to the gtk3 theme in use (because there is) but whether you like how gtk3 whisker menu applies the gtk3 theme to itself.

[AMENDED - I'm caveating the rest of this post: it might not be correct, since I based it on how numix themes the gtk3 whisker menu. It might be that different themes assign the colours of other different elements to the whisker menu elements]

Example:
1. MX-greybird's window bar theming comes from applying the Arc-Dark xfwm4 window manager theme. It's separate from the gtk3 theme. So the Arc-dark blue-grey xfwm4 theme colour isn't going to be applied to gtk3 whisker menu or panel. The xfce-gtk3 panel is assigned the same colour as the current gtk3 theme's window bar colour. So for MX-greybird applied on XFCE-gtk3, the xfce-gtk3 panel will look grey like the greybird gtk theme's grey window bar. The current panel colour settings in MX-greybird are found in the gtk2.0 folder (being for gtk2 panel), so are not applicable to the future gtk3 XFCE Panel.

2. as for gtk3 Whisker menu, its frame is assigned the same theme colour as the colour assigned to the body of the window in the gtk3 theme (in greybird, that's light grey). The whisker's internal panes are assigned the same colour as the text field background colour of the gtk3 theme in use, which is white in greybird.

So if you apply greybird or mx-greybird theme to gtk3 XFCE, the panel and whisker menu will probably just look grey, with white internal panes in whisker menu.

MX-Greybird will eventually need to be specifically tweaked for gtk3 XFCE, in order that the panel and whisker menu show up in the same dark blue-grey panel/frame with very light white-grey internal panes colour scheme as it currently has in gtk2 XFCE.

Posted: **Wed Jul 25, 2018 6:59 am**

Yes, thanks for the example. Graeme Gott's blog post is very helpful on this:

https://gottcode.wordpress.com/2017/10/ ... enu-redux/

Posted: **Wed Jul 25, 2018 10:18 am**

asqwerth wrote: Wed Jul 25, 2018 5:24 am
dreamer wrote:Is there no fallback for the gtk3 version to the gtk3 theme in use? The gtk2 version just adopts the gtk2 (gtkrc file) theme colors.
After my initial tests with oomox, I think that this is not a question of whether there is a fallback to the gtk3 theme in use (because there is)...

That was my question and you answered it so thank you for that.

Posted: **Wed Jul 25, 2018 10:30 am**

xali wrote: Wed Jul 25, 2018 3:29 am thanks sparker (you are also using sparky, aren't you? )
and welcome to mx

Yes, I use manjaro... sparky ... mx... mint (linux & pepper) and and kali. Different platforms for different users (I support several dozen Linux users of various ages and interests). My youngest user is 5 and oldest is nearly 90.

Posted: **Wed Jul 25, 2018 11:09 am**

Let's hope this doesn't come to MX-17 and break our current themes.

The gtk+ 3.0 version is currently in the MX Test Repo, so interested users can install it to test and fool around with theming.

Posted: **Wed Jul 25, 2018 12:06 pm**

My favorite difference in the newer versions is a popped up menu behaves better with Alt-Tab keypress - (2.1.6 release I think - https://gottcode.org/xfce4-whiskermenu-plugin/ for changelog) Nice tweak.

Posted: **Wed Jul 25, 2018 12:43 pm**

Fully gtk3 version of XFCE in Manjaro:

This is another oomox-created numix variation - a mix of mx-greybird and one of the medium-dark mediterranean themes:

https://imgur.com/pn8OsdZ

Added this to the /gtk-3.20/gtk-dark.css file [it didn't work when added to the gtk.css file, but I don't understand why]:

Code: Select all

/* Whisker menu gtk3 colors */

#whiskermenu-window {
	background-color: #2f343f;
	border-color: #203665;
        color: #fafafa; }

#whiskermenu-window border { 
	border-color: #2f343f; 
}

/* Make sidebar buttons match */
#whiskermenu-window button {
	background-color: #2f343f;
	color: #f7eff4;
}
#whiskermenu-window button:hover {
	background-color: #4195ec;
	color: #fff;
}

I assume that if a theme doesn't have the gtk-3.20 subfolder, then just add the above text to the corresponding .css file in the gtk-3.0 subfolder.

For the numix themes, the XFCE-gtk3 panel follows the colour of the window bar without needing to edit any configurations, so it was only the whisker settings that had to be changed. There appear to be very comprehensive theme settings already set up in the css files in the /gtk-3.20/dist and /gtk-3.0/dist subfolders.

But this may not be the case for every other theme. I just opened the greybird theme that is currently in Manjaro's repos (so it must be pretty up to date), and it seems to have tons more files in the gtk-3.0 folder than numix, but no gtk-3.0/dist subfolder. The README file in the gtk-3.0 folder informs me that greybird theme is very complex and that the css files should not be edited directly but through SASS. That is beyond me. No idea how to do that.

Posted: **Wed Jul 25, 2018 1:45 pm**

@asqwerth

Like the light grey background. Easy on the eyes.

Posted: **Wed Jul 25, 2018 2:04 pm**

I have my mods in the gtk-3.0 folder... your edits/ changes look like they should work just fine.

I know this is obvious but did you verify that your main theme calls the gtk.css stylesheet?

Posted: **Wed Jul 25, 2018 2:12 pm**

manyroads wrote: Wed Jul 25, 2018 2:04 pm I have my mods in the gtk-3.0 folder... your edits/ changes look like they should work just fine.

I tried adding my changes to the gtk-3.0 folder files first, but it didn't seem to affect the whisker menu at all. Only editing the /gtk-3.20/gtk-dark.css file worked. At least for this oomox-numix theme.

...I know this is obvious but did you verify that your main theme calls the gtk.css stylesheet?

I assume you are referring to the oomox theme and not the greybird theme.

The gtk-dark.css file originally had this line:

Code: Select all

@import url("resource:///org/numixproject/gtk-3.20/dist/gtk-dark.css");

Are you referring to that? I just added the rest of my edits before this line and left the latter as the last line.

Posted: **Wed Jul 25, 2018 5:35 pm**

Yes... you might try doing an import of your gtk-3.0/gtk.css

Posted: **Wed Jul 25, 2018 10:31 pm**

manyroads wrote: Wed Jul 25, 2018 5:35 pm Yes... you might try doing an import of your gtk-3.0/gtk.css

All the css files in gtk-3.0/ subfolder had only that one line. The meat of the theming appeared to be in the css files in gtk-3.0/dist/ subfolder.

[ADDED]
Based on the one-liner in the .css files, I would assume all the stuff in the gtk-3.20/dist subfolders were imported from the numix dev's resources webpage. I guess that for oomox-numix variants, they save on the heavy work that way.

For another theme, if I have to import over a specific css stylesheet file, what is the syntax for the import command?

Code: Select all

@import url("$HOME/.themes/themename/gtk-3.0/gtk.css");

?

MX Linux Forum

Whiskermenu edits in gtk-3.0

Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0

Re: Whiskermenu edits in gtk-3.0