You are not logged in.
I am trying to increase the launcher-button padding on Xubuntu 18.10 where with GTK2 version of the panel is done by changing the "xthickness" and "ythickness" values however I can't seem to make it work with Xfce's GTK3 panel.
As a test, I have tried changing the "gtk-contained.css" file in the Greybird dir but except for the background color, it affects nothing else:
Here is what I have done:
.xfce4-panel.background button
{
background-color: #80800; /* this works which means I am modifying the correct section
padding: 10px; /* this does not work, it does not affect the padding */
}
Since the background of the button is affected, I was expecting for the padding to also be changed. The original "gtk-contained.css" file does have some references to padding but those have no effect.
How do I change the launcher button padding? That above example also affects the taskbar buttons.
I also tried:
.xfce4-panel button
{
background-color: #80800; /* this works which means I am modifying the correct section
padding: 10px; /* this does not work, it does not affect the padding */
}
The outcome is the same.
Update: I have noticed this one works but padding does not:
.xfce4-panel button
{
margin-left: 5px;
margin-right: 5px;
margin-top: 5px;
margin-bottom: 5px;
}
Last edited by marko (2018-11-26 07:49:30)
Offline
Your first snippet works for me in 18.10. However, the padding just clips the icon. Are you noticing clipping or no effect at all?
If no effect at all, do you have any content in ~/.config/gtk-3.0/gtk.css?
Are you using the default Greybird theme and bottom panel with size of 24?
In GTK3, you can scale the icons (which will give you extra padding at the expense of icon size) using something like:
.xfce4-panel.background button*
{
-gtk-icon-transform: scale(0.8);
}
...but this will affect all panel buttons. You can direct it at specific launchers by pointing the change at:
#launcher-XX*
{
-gtk-icon-transform: scale(0.8);
}
...where XX is the launcher ID.
Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki | Community | Contribute ---
Offline
Thanks!! Adding the following at the very bottom of the gtk-contained.css file appears to work and gets exactly the result I wanted to get This can be used with all GTk3.x themes if you edit the correct CSS file.
.xfce4-panel.background button*
{
-gtk-icon-transform: scale(0.8);
}
Absolutely beautiful, it even affects the notification buttons on the right which is what I wanted and lIke you said, it affects all buttons (including the taskbar buttons). Now I can make my panel look identical and nicely spaced as with the GTK2.x version Looks beautiful especially if you apply a squared or a rounded icon theme!
One final question, can the taskbar/window buttons widget also be CSSed?
Thanks again for this, much appreciated!
Last edited by marko (2018-11-26 21:55:40)
Offline
Thanks!! Adding the following at the very bottom of the gtk-contained.css file appears to work and gets exactly the result I wanted to get
Probably best to add this to ~/.config/gtk-3.0/gtk.css. If you add it to the theme's files it might get overwritten if the theme package is ever updated.
One final question, can the taskbar/window buttons widget also be CSSed?
Yes they can:
.tasklist* {
-gtk-icon-transform: scale(0.8);
}
Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki | Community | Contribute ---
Offline
That worked too Thanks, I just had to restart xfce4-panel after I modified ~/.config/gtk-3.0/gtk.css
xfce4-panel -r
Also I went a bit further:
.xfce4-panel.background .tasklist button {}
.xfce4-panel.background .tasklist button:hover {}
.xfce4-panel.background .tasklist button:checked {}
#showdesktop-button{}
#whiskermenu-button{}
Last edited by marko (2018-11-27 06:23:51)
Offline
In addition to the aforementioned, I noticed that "padding" does work with the Arc theme so it looks like the issues I had are to do with the Greybird theme specifically but nonetheless, the scale property does exactly what I wanted.
Last edited by marko (2018-11-27 06:26:57)
Offline
[ Generated in 0.010 seconds, 7 queries executed - Memory usage: 545.66 KiB (Peak: 546.5 KiB) ]