Add a 1px black border around the tab-switcher

[ralf3u]

Steps to reproduce

1. open Geany
2. open some documents, so that there are some tabs in the editor
3. press Shift+F10 (result: the tab-switcher appears)

Result on a TFT/LCD-display
there is a thin gray border around the tab-switcher, so one can easily read the content of the tab-switcher

Result on a ePaper-display when using text-mode (text-mode means that there is only the black color on the display)
there is no thin gray border around the tab-switcher, so it is hard to read the content of the tab-switcher because there is no border at all around the tab-switcher

Expectation
a 1px black border around the tab-switcher would make it easier to read the content of the tab-switcher on ePaper-display when using text-mode

Remark I
in the application-switcher in Lubuntu 23.10 there is a 1px border around the application-switcher; the 1px border is a great help to read easier the content of the application-switcher on a ePaper-display when using text-mode

Remark II
Is there a way how I can change it now that there is a 1px black border around the tab-switcher?
Thank you for an answer

System
Lubuntu 23.10
Geany 1.38

[elextr]

Things like this are not controlled by Geany, they are controlled by the GTK theme. You can make tweaks using geany.ccs, (I don't remember if 1.38 has Tools->Configuration Files->geany.css to handle all the copying and stuff) but having no experience with ePaper displays and their interaction with themes and don't know of other contributors who use them you may have to experiment with it yourself.

[ralf3u]

I don't remember if 1.38 has Tools->Configuration Files->geany.css to handle all the copying and stuff

Yes, it has.

You can make tweaks using geany.ccs

I know that I have to add the value border: 1px solid black;, but I don't know the selector name.
On this webpage https://www.geany.org/manual/dev/geany.txt, there is this text:

Geany offers a number of CSS IDs which can be used to taylor its appearance. Among the more interesting include:

I tried in geany.css different selector names, like

#geany-tab-switch
#geany-tabswitcher
#geany-tab-switcher
#geany-switcher
#geany-switch

but it does not work.

Where do I find some more CSS IDs?
Thank you for an answer in advance.

[elextr]

Only the listed selectors exist, the popup isn't named. You could try applying it to all menus and see if it ruins the normal menus, or maybe even makes them clearer as well.

[ralf3u]

You could try applying it to all menus [...]

How?

[eht16]

Maybe the GTK Inspector can help, https://wiki.gnome.org/Projects/GTK/Inspector.

Basically, enable it by executing gsettings set org.gtk.Settings.Debug enable-inspector-keybinding true and then start it from within Geany with the keyboard shortcut Control-Shift-D.

The inspector allows to pick various GUI objects and show the CSS path. However, I failed to pick the mentioned menu. Surely there is some trick to get it.

[elextr]

@ralf3u

You could try applying it to all menus [...]

How?

menu??

Most GTK classes have the CSS nodes specified in the docs, like menu

@eht16 The popup is a dynamically created menu, can you invoke the inspector while it remains visible?

[xiota]

I found the name "GeanyDialog". Maybe following should be added to default geany.css because the existing dialog (at least on my computer) is a borderless rectangle that blends in with the Geany document behind it.

#GeanyDialog {
	border-width: 2px;
	border-style: solid;
	border-color: black;
}

[ralf3u]

I added the code from the last comment in geany.css.
First in geany.css that is located in .config/geany/, and then in geany.css that is located in /usr/share/geany/.
After a restart of Geany the tab-switcher has still no border.

[elextr]

@xiota does that change the tab switcher popup, AFAICT (from the code) it has no name? @ralf3u thats why I suggested using "menu" as the selector.

AFAICT GeanyDialog is only used for dialogs, except for GeanyDialogSearch and GeanyDialogProject which for some reason have their own names.

But as I keep saying, what things look like is set by the user theme, we should not be overriding everybodys theme with our own CSS just because one theme does not do something somebody wants. Note that the theme @ralf3u uses works on normal screens, the problem is with the characteristics of epaper displays.

It would be nice if the manual did not just list "some interesting" widget names and listed all of them, contributions welcome.

[xiota]

Unknown reason, the tab switcher dialog on my computer is named GeanyDialog, and the CSS I pasted does work. (Arch Linux, Geany 2.0)

Maybe the switcher dialog should be assigned a name (GeanyDialogSwitcher?) so that it can be styled more easily after the next release.

[elextr]

@xiota hmmmm, we seem to be talking about different things. Here (Geany 1.38 and 2.0) shift+f10 does not create a dialog, it creates a popup menu, which isn't named.

[xiota]

I see now. Yes, different popup.

[eht16]

@eht16 The popup is a dynamically created menu, can you invoke the inspector while it remains visible?

No :(. This is what I meant with "I failed to pick the mentioned menu" above.
But maybe it is possible and it is just me not getting it.

Maybe a search engine can help on this or some GTK expert.

[elextr]

@ralf3u did it work using "menu" as the selector in the CSS?

[ralf3u]

[...] did it work using "menu" as the selector in the CSS?

That works for me:

menu {border: 1px solid black}

Then indeed not only the tab-switcher has a border but also the menu-list of each item of the menu bar. It is good to have it like this to make also there a clear separation between content and the rest around.

Thank you so much for your help.