I've installed a new theme due to issues with the Orchis theming showing too many invisible or darkened dropdowns for the shell and its Firefox theme. More info here.
That said, I found another theme, and I like it; but I've run into an issue with this one as well. This time, it concerns the Lock, Log Out, Restart and Shutdown buttons in the Zorin Menu. Below is a screen capture to show exactly what I'm seeing.
I've tried searching for all kinds of key words within the .css files of the theme I'm trying to use, including but not limited to: "power", "reboot", "restart", "logout", "log out", "lock", "shutdown"... etc. Most, if not all results could have been something or lead me somewhere, but they were inconclusive if only for the fact that I have no idea what I'm looking for, much less what to change once I find it.
After a bit of research I found that the Gnome-Inspector extension is deprecated/no longer available.
I've also found that an alternative - GTK+ Inspector - won't properly do what I need because apparently I need to have the GTK Inspector replace the GNOME shell in order to view these buttons after running GTK_DEBUG=interactive gnome-shell --replace in Terminal : That just crashed my Session...
I've attempted to use the looking-glass by running lg in the run dialogue after hitting my keybind to bring it up (default: Alt+F2). The problem here is that I need to open the Zorin Menu to inspect the buttons, but the looking-glass function won't allow me to do this, as it only captures the first thing on which I click: the Zorin Menu button (I can't use the Super key either in this mode.)
I have also tried xprop with xprop WM_CLASS - but a similar hiccup occurred as that described for the looking-glass attempt. I then tried to sleep the xprop command, to no avail, using commands like sleep 5s && xprop WM_CLASS, sudo sleep 5s && xprop WM_CLASS and sudo sleep 5s && sudo xprop -notype WM_CLASS, but all I get is the same error of xprop: error: Can't grab the mouse.
Does anyone have an idea of what I need to be searching for in my .css files of the theme directory I'm trying to use so that I can get the values of these buttons and change the padding or sizes? At least, that's what seems to be the issue to my mind.
Better still, does anyone have an idea of how I can inspect these buttons to obtain these info in a more efficient manner rather than searching a large .css file for key words?
What you are looking for is the padding or the min-width on the button.circular class used in the Zorin Menu shell extension .css file. I am not using Gnome, so I would need to pull it up and check later.
The best way to narrow down a class and its properties is by using GTK Inspector.
I know that the XFCE inspector can be called from the inspector - but I do not know if a gnome-shell extension menu can...
I would need to test that.
Is this actually the case? How would that extension have changed just by installing and utilizing a different theme? Does changing themes modify shell extension .css files somehow? I thought they (themes) have their own .css files.
It is about Priority.
When you have a bunch of different .css files on the computer, how does it know which to read and adhere to? Or which to fallback on?
It knows by set priority.
First Priority is given to Home directory and within home directory, it is ~/.config/gtk-3.0
Next is ~/.themes or ~/.local/share/themes
Next is in Root usr/share/themes
In the case of the Gnome extension .css files, those are in Root, too. So priority is still given to the User Selected Theme.
Yes, the .css will affect the appearance if the theme sets a wider min-width or padding on an element than a widget really allows for. Some of my own themes I have made have done this exact same Menu Button Spacing issue too on Zorin Gnome App Menu.
I think so, I am guessing on memory. It has been a while since I have themed Gnome elements.
I know it is .button class width or padding you need to affect - and we are looking for specificity to narrow down to affecting only those buttons and not all buttons on the menu.
You are catching me while I am in class and I am one of those people that can only do one thing at a time.
My theme's .css file doesn't have anything like that after a search. I attempted to break up that entry you suggested in a few different ways so I could find entries relevant to session-button, buttons-section, section.popup, popup-menu, and menu-item. The only entry for partial match was session-button and that is as follows:
That is specific to the Mate Desktop.
I just downloaded the Material-Black_Frost -3.38 file
Let me look it over...
Ok searched the theme/gnome-shell.css and came up empty handed.
This means that it does not have that class - so it is falling back to the .button class that is more broad.
What you can do - Add that class, then set the properties and values that you need.
To start, try:
Adding it to either:
the gtk.css in the /usr/share/themes/Material-Black-Frost-3.38/gtk-3.0 directory
or,
the gnome-shell.css in the /usr/share/themes/Material-Black-Frost-3.38/gnome-shell directory did not work.
I did make sure to reload the shell after saves, too.
I am leaning toward this issue being caused by a hiccup in the latter file. I spent some time looking through it again and now that I changed the color schemes of my text editor, some of the class headers looked like they could contain what I am looking for, but again haha... I don't know what I am looking for - I'm just making the assumption based on my intuitive interpretation of what each class header could contain in relation to this problem... if that makes any sense at all.
You teaching any classes soon? Haha... I would totally learn it if I saw the value in using that time other than for purposes of navigating my own files to fix theming issues caused by compatibility clashes. Also saving awesome folks like you from having to solve my problem for me would be a good incentive to learn... So hey! Maybe I will actually do some searching around for a good resource to use to teach myself.
That is it. Where things get tricky in gtk.css is in identifying the class you need so you can theme it.
With HTML and CSS, you set the class in the HTML and then style it with the CSS. You can name a class doofensmirz if you want to. But in gtk.css, the class is set in the application code. You cannot name it, you can only use what the maintainer named it.
And in the case of LibreOffice, for example, they named very few classes making attaining specificity in theming the app is exceptionally difficult.
I wish themers added more commented descriptions in their .css rather than just using their own short-hand for identification purposes.
I get that they don't need to and it's a "set it and forget it" situation for most, but it would still help them if they did because it would reduce the number of people that reach out for specific help and troubleshooting.
I imagine it would also help them in time saved because they don't have to search as long for the part of their .css that they want to change.
Hi again, I just wanted to bump this a little (nudge) to see if maybe you've had a chance to look into this issue further after downloading it yourself and digging into it. I still can't find the issue and there doesn't seem to be a reason to expect an update from the designer/uploader based solely on the fact that the last update this theme saw was 3 years ago.
I can go get a different theme easily enough and I don't have any issues moving on, but before I did finally give up, I wanted to touch base here.
