Xfce Forum

pcarvalho

Member

Registered: 2016-04-09

Posts: 3

xfce panel : launcher arrow padding

Hi!

i'm trying to style this little arrow:

Started the inspector to find this

but can't find a property that makes the clickable area larger. in browser world, i would go for padding, but can't find that in the properties tab.

Adding border or margin just makes the outside of the arrow larger, keeping the clickable tiny as seen in the first image.

any clues?

2- Also, what should i use from the css selector to put in the gtk.css file?

thank you!

Last edited by pcarvalho (2020-02-10 17:34:25)

ToZ

Administrator

From: Canada

Registered: 2011-06-02

Posts: 11,482

Re: xfce panel : launcher arrow padding

Unfortunately, there is no css element defined for that object. You _might_ be able to get away with:

#XfcePanelWindow .toggle { padding: 15px; }

...adjust the padding as necessary, but some other panel plugins use the ".toggle" class (like show desktop and directorymenu) and you may not want the padding there.

The long way to do this is via the following:

#launcher-18 .toggle { padding: 15px; }

...but you'll need to create an entry for every launcher that you have (specifying its proper widget number). Example:

#launcher-1 .toggle { padding: 15px; }
#launcher-2.toggle { padding: 15px; }
#launcher-3 .toggle { padding: 15px; }
...etc

...or:

#launcher-1 .toggle, #launcher-2.toggle, #launcher-3 .toggle { padding: 15px; }

...if you want it cleaner.

Note: you'll need to play around with the padding value to get something to fit. You can also specify specific sides (padding-top, padding-bottom, padding-left, padding-right).

---

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 ---

pcarvalho

Member

Registered: 2016-04-09

Posts: 3

Re: xfce panel : launcher arrow padding

THANK YOU!! That little button had a bit of inertia to click on it, now i can just click almost anywhere

went with this:

/* file browsers */
#launcher-10 .toggle,
/* code apps */
#launcher-16 .toggle,
/* image apps */
#launcher-17 .toggle { padding: 7px; }

I don't change the menu that often, and now i can always come here and remind me how you did it.

Now i get it what are the ids from the css selector tab.

Enjoy your day!

Last edited by pcarvalho (2020-02-11 20:40:36)