Missing window borders

It’s been bothering me since gnome went from 2.x to 3.x. Window borders (== “decorations”) are not drawn by default and there never was a way to control it via settings or tweaks, I had to hack gtk’s css. I wonder why is it thought that no borders is a good default? What is the assumption, is every app supposed to have a single window and unique background? I feel I am not using gnome right, help me :slight_smile:

For example, 3 overlapping terminals looks horrendous:

The silence is impressive :slight_smile:

It’s just… a little unclear what you’re asking about. Window decorations and window borders aren’t the same thing.

By default, every GNOME app window has a thin border and a drop shadow. I personally think this separates them pretty well, it’s not like they are drawn with a single color and no drop shadow.

Are you using a custom theme? Because that’s the only thing I can think of.

Window borders are 1px, but:

  • there are drop shadows around windows
  • the area that can be used to drag/resize windows is larger than 1px

With both of these additions, there’s really no reason to have thick borders around windows.

No, the theme is “adwaita” + my css. Terminal windows have dark background so when overlapping shadows are not visible and thin borders of a dark color are also not visible (well, easily), and my screen is OLED. I just tried a fresh new user with all default settings, unbearable :frowning:

Well, I am asking 2 things (I think)

  • what do you call the window borders
  • how do I get 1px wide green window border
    Thanks,

This works with gtk3 and old gnome but does not with the gnome, wonder why.

decoration {
  border: 2px solid yellow;
  background: green;
}

The further I dig, the better it gets :-/
GTK+inspector does not recognize gnome-terminal at all, it allows inspecting naitilus but neither gnome-terminal nor (for example) firefox nor tilix. But both firefox and tilix pick up the decorations style (probably from gtk-3?). OTOH “terminator” does not get decotations.
So gnome-terminal is not gtk after all? I am confused.

Not quite, VTE interferes with the shortcuts that are usually used to bring up the inspector.

The inspector can still be launched from the menu (under Advanced → Inspector).

Tilix also uses VTE, so it’s the same issue as for gnome-terminal.

Firefox is not a GTK app, so the inspector is not expected to work.

Judging from the screenshot I think the issue is that you are using server side decorations and the gtk inspector won’t help with that. Also since 44 changed SSD rendering from gtk3 to gtk4, your CSS will need to be updated. window instead of decoration should work.

You can actually run the inspector in Firefox if you use GTK_DEBUG=interactive. But you will see an empty window with no widgets in it, and editing styles will mostly not work, because Firefox only uses GTK as a host to draw its own widgets.

Well,

window {
  border: 10px solid yellow;
  background: gray;
}

does not work (just tried - edited, rebooted), the border appears around the window caption but not for the rest.
And I thought the GTK+inspector app’s window locator can pick any GTK window but it only works with gadgets within the same process, right? In gnome-terminal the inspector menu is next to “about” btw but thanks for the hint.
Went through CSS, no window there:


Tried stupid stuff like vte-terminal { border: 10px solid yellow; background: gray; }, still no luck :frowning:

That’s because you are looking at the gnome-terminal inspector and as far as I can tell from your screenshot you are not using header bars in gnome-terminal, so you the decorations are not drawn by gnome-terminal but by mutter. Since 44 mutter uses gtk4 for the window decorations and in gtk4 the decorations use the window selector.

Changing the background of the window this way likely won’t work, because the titlebar is drawn on top of this, so you would need to change the background of the corresponding selector.

Or just use header bars in gnome-terminal: gsettings set org.gnome.Terminal.Legacy.Settings headerbar true. This should be the default, but maybe you changed it in the past. With header bars, everything is drawn by gnome-terminal and you can modify it using the gtk3 gtk.css and everything should show up in the inspector.

1 Like

org.gnome.Terminal.Legacy.Settings headerbar was false and turning it to true indeed fixed the borders, thanks! Totally do not remember touching this but this fedora is about 6-8 releases old :slight_smile:

(out of curiosity) What is the corresponding selector in this case?

The selector is headerbar.

1 Like

but changing headerbar again only changes the window titlebar, not the rest, so windows are still borderless.

headerbar {   background: #F0F0F0;   border: 2px solid yellow;   background: gray; }
headerbar:backdrop {   background: #404040;   border: 2px solid green;   background: gray; }

also, sadly, Signal/flatpak lost its window border, this is why I keep pushing this topic.
What is this mutter anyway, is there a way to configure window borders in it? man mutter says MUTTER - Clutter based compositing GTK2 Window Manager which is hardly it.

but changing headerbar again only changes the window titlebar, not the rest, so windows are still borderless.

I never said anything about borders on the headerbar/titlebar. I only said that the background of the titlebar will not be affected by changing the background of the window, because the headerbar/titlebar does not have a transparent background that you could see the window background through (at least with the default gtk4 theme).

If you want to change the border of the window, you need to use to window selector.

Since the last time I moved to “terminator” and have no luck with having borders in it. .config/gtk-4.0/gtk.css:

window {
  border: 2px solid gray;
}
decoration {
  border: 2px solid gray;
} 

And “terminator” does use gtk4 as other elements are picked after restarting the gnome. What do I miss this time?

* { border: 2px solid gray; } adds a border on the left and the top of the window but not on the right/bottom (well, among other hilarious changes because of “*” :slight_smile: ). So there is a selector I can use but it is not “window”. “box” works but pretty much everything is a box.
Reading Selectors Level 3
Sound like i need to find a NS for NS|box { border: 1px solid gray; } but what is the NS in case of “terminator”? It is not VteTerminal. window:backdrop:dir-ltr.background.terminator-terminal-window { border: 2px solid gray; } does not do it from the inspector’s CSS tab.

This topic was automatically closed 45 days after the last reply. New replies are no longer allowed.