Xfce, GTK and Qt: remove rounded corners using css

[D.Dave]

EDIT: partially solved: check EDIT2 on the bottom of this message

---

Hi, On Xfce I’d want to get rid of rounded corners around the applications windows (due CSD), so in ~/.config/gtk-3.0/gtk.css
I added:

headerbar {
  border-radius: 0 0 0 0;
}

headerbar .title {
  border-radius: 0 0 0 0;
}

Which, in facts, remove rounded corners, but only in “pure” GTK applications, like gedit, gnome-calculator, firefox (after unckeck Title Bar option), pamac-gtk.

All others Xfce applications, still have the rounded corners (Xfce4-Terminal, taskmanager, thunar).
What else should I add to ~/.config/gtk-3.0/gtk.css for get rid of rounded corners everywhere?
I also tried to set xfconf-query -c xsettings -p /Gtk/DialogsUseHeader -s false but didn’t helped.

I’m using Adwaita-dark theme on Xfce 4.16.

EDIT:

I added the following section to gtk.css and has removed rounded corners also from the context menu on the desktop, but not on others Xfce applications:

.csd .titlebar {
 border-radius: 0;
}

.window-frame {
 border-radius: 0;
}

decoration, window, window.background, window.titlebar, * {
border-radius: 0px;
}

.titlebar,
.titlebar .background, * {
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}


.window-frame {
    border-radius: 0 0 0 0;
}

.background.csd {
    border-radius: 0 0 0px 0px;
}
.background.maximized, .background.solid-csd {
    border-radius: 0;
}

.window-frame, .window-frame:backdrop {
 box-shadow: 0 0 0 black;
 border-style: none;
 margin: 0;
 border-radius: 0;
}

.titlebar {
 border-radius: 0;
} 

---

EDIT2
After experimenting, I found out an odd thing: I installed gtk3-nocsd and I exported export GTK_CSD=1 instead of the suggested export GTK_CSD=0 (so in some way for forcing csd instead of disable them).
And now, all Xfce applications are honoring gtk.css: no longer rounded corners, except on Qt applications: these are using adwaita-qt, but these Qt applications are ignoring at all gtk.css; I suspect that I have to create a stylesheet in Qt5 Configuration Tool (qt5ct) but I have no clue.

Some hints?

[bill_t]

I’m afraid that you can’t solve this using CSS. It has to do with the Window Manager (xfwm4) theme.

Open the theme you’re using for your Window Manager in /usr/share/themes/ (or better copy it in the ~/.themes/ or ~/.local/share/themes/ directory) and inside the xfwm4 directory you’ll find the images usually called

top-left-active.png
top-left-inactive.png
top-right-active.png
top-right-inactive.png

You have to edit these images using a program like Gimp for example, so that they don’t display rounded corners.
After saving them, logout/login in order to see the changes in your windows.

[D.Dave]

After exporting export GTK_CSD=1 only Qt applications are still have rounded corners; they use adwaita-qt, which doesn’t have any equivalent files.
To summarize: to avoid rounded corners using ~/.config/gtk-3.0/gtk.css I had to force CSD on any app of Xfce.

In anyway under /usr/share/themes/Adwaita-dark/ there is no xfwm4 folders, and the css file for GTK3 only contains @import url("resource:///org/gtk/libgtk/theme/Adwaita/gtk-contained-dark.css");; so I rely on `~/.config/gtk-3.0/gtk.css which has been helped by forcing CSD; now I have to find a way to do the same for Qt applications.

Somethin about style sheet?

[bill_t]

Just to be clear, what I mention above is not referring to the gtk3-nocsd package, since I never used it. Furthermore, it doesn’t have anything to do with Qt style sheets.

@D.Dave

In anyway under /usr/share/themes/Adwaita-dark/ there is no xfwm4 folders

Adwaita doesn’t have a theme for the Xfce Window Manager, you are using a different one.
To find out which theme this is, navigate to Settings Manager → Window Manager → Style (tab).

[D.Dave]

Is set to default; I can change it to any others; with CSD enabled aren’t applied.
To change Window Manager Style, I have to rely on gtk3-classic (which have CSD totally disabled).

In anyway, as I’ve said, by forcing CSD and tweaking ~/.config/gtk-3.0/gtk.css has removed the rounded corners everywhere, but not in Qt applications: for Qt applications, I installed adwaita-qt and in qt5ct, I set it: but I don’t know how to tweaks adwaita-qt for removing rounded corners.

Screenshot:

On left: Thunar, which now have the headerbar without rounded corners (after tweaking ~/.config/gtk-3.0/gtk.css and set export GTK_CSD=1)
On right: Qbittorrent (but is the same with any Qt application) with rounded corners. For this I was thinking about creating a style sheet in qt5ct, but I have no clue.

[bogdancovaciu]

@D.Dave

To change Window Manager Style, I have to rely on gtk3-classic

Actually it seems, from your animated screenshot, is not working as is not changing Window Decoration style while you select a new one … and that is a separate thing than Widget Style as pointed out

@bill_t

it doesn’t have anything to do with Qt style sheets

From what i know only Arc, Numix, Plata themes have Window Decorations without round corners, so you could use one of those as template.

@D.Dave

export GTK_CSD=1

In combination with

@D.Dave

gtk3-classic (which have CSD totally disabled)

From what i gathered, you only need exactly what you did for ~/.config/gtk-3.0/gtk.css
the headerbar entries and then the next ones you mentioned, use the default gtk3 package and drop the gtk3-classic, make sure you have a working Window decoration theme, and it switches in Window manager, for instance here is with Plata-Noir-Compact theme; Qt apps have straight corners as any other app

except Pamac that follows the gtk3 theme and CSD decoration

And here is with AdwaitaEx dark … window decoration and gtk+ theme

So, i think you overcomplicated things a bit, and what you have to keep in mind is just what Vasilis mentioned.

[D.Dave]

@bogdancovaciu

you overcomplicated things a bit

Yep, is true, I admit it
Is due to the fact that I have cognitive disturbances caused by multiple sclerosis, but don’t worry guys, I’m fine

I will try to explain better the subject of this topic:

Since I installed Manjaro two years ago I always had installed gtk3-classic, since I didn’t like CSD, but with the new pamac 10.1.2-2 and with Xfce 4.16 which have a better integration of CSD I’d wanted to try again CSD in my system, so some day ago I uninstalled gtk3-classic and back to the official gtk3 package. And I changed my opinion about CSD: give a modern look to the system.

Yesterday I tried gtk3-nocsd to get rid of rounded corners without using/ tweak ~/.config/gtk-3.0/gtk.css but gtk3-nocsd didn’t helped. And I uninstalled it; then I discovered that the environment variable export GTK_CSD=1 (forcing CSD, the opposite of export GTK_CSD=0 required by gtk3-nocsd) also works, maybe is an integrated env variable in gtk3.

If I unset export GTK_CSD=1 and i logout/login, in facts, rounded corners back on Xfce applications (terminal, thunar, tkas manager and so on), while on Gnome applications (gnome-calculator, gedit and the new pamac) still have flat corners as I like/want; if i set again export GTK_CSD=1 rounded corners go away again, as indicated in ~/.config/gtk-3.0/gtk.css.

But whit forced CSD (export GTK_CSD=1), I can’t change Window Decoration style; and as I unset export GTK_CSD=1 I can change Window Decoration style.

My current theme is adwaita dark for GTK applications and adwaita-qt (set as dark variant in qt5ct) for Qt applications. To summarize: I aim to remove rounded corners everywhere: is the only thig that I don’t like.

@bogdancovaciu

AdwaitaEx dark

Looks fine as I’d wish, but I cannot find it in Pamac; I have to build/install it from github GitHub - hrdwrrsk/AdwaitaExtended: A modified default GNOME/GTK theme with some extras/enhancements/additions. ?
In the screenshot on github I see the rounded corners; so this theme will honor ~/.config/gtk-3.0/gtk.css to get rid of rounded corners everywhere, also in Qt applications?

EDIT
I built, install and set AdwaitaExtended Dark, but Qt applications still have rounded corners.

EDIT2

@bogdancovaciu

Plata-Noir-Compact

Yep! I installed it, and I also been able to change Window Decoration style to this theme and there are no longer rounded corners!

Thank you and sorry for the confusion

FINAL EDIT:

I ended up by installing qogir-gtk-theme and kvantum-theme-qogir-git; I perfectly uniformed the appearance of any applications with diferent backend and I like more this theme

[stargazer]

@D.Dave

I installed gtk3-nocsd

I’m not sure this is a long-term solution, because:

We are currently concentrating on Gnome and XFCE edition first, to get Pamac ready. Also we don’t support gtk3-nocsd or gtk3-classic, as libhandy and libadwaita only works with CSD enabled. Our focus on theme support is on Adwaita and Matcha. Supporting Plasma with this v10.1.x series is currently secondary, as we first have to finalize the Gnome 40.1 ports. ^link

[D.Dave]

If you read above, you will see that uninstalled them because I “embraced” CSD.

@D.Dave

I uninstalled gtk3-classic

@D.Dave

gtk3-nocsd didn’t helped. And I uninstalled

[stargazer]

@D.Dave

I “embraced” CSD.

All smiles

An interesting and educational thread.

The statement reminded me of that Stanley Kubrick movie, or was it the Next Generation and Picard

Something XFCE-wise that is encouraging

A user in the XFCE mailing list summarized their needs and requirements

Consistency:

• All windows looks like the same (borders, shadows, title, …).
• All the compositor configs and GTK styles affects in same way all windows.

Functionallity/Usability:

• All the windows have the same buttons (minimize, maximize, …).
• And I can roll all the windows (this is not possible with CSD)

And XFCE came back with a much appreciated authentic response

So, if we were to find solutions to these problems, that would solve the CSD issues for you? I
think at least some, if not all of these, might be solvable with some work.

As part of this discussion, if we move forward with Xfce CSD, using GTK_CSD=0 in your profile should revert the layout to classic Xfce. Simon’s branch [1] can be patched accordingly to check for this environment variable for the XfceTitledDialog.

It was a helpful thread to read starting at Xfce Digest, Vol 191, Issue 7.

XFCE is listening to its’ users. We just need to communicate and help.

[D.Dave]

Yep, and for completeness, I ended up by setting the official/default Xfce theme: greybird; I manually edidted, by using GIMP, all xpm files in /usr/share/themes/Greybird-dark/xfwm4/

And now everything is perfectly uniformed (so, GTK3, GTK2 and Qt applications) without rounded corners:

I am satisfied, I achieved what I wanted
Anyway is interesting the fact that I had to set export GTK_CSD=1 in ~/.profile; without this env variable, most of Xfce apps, as well GTK2 and Qt didn’t followed the settings of ~/.config/gtk-3.0/gtk.css

But yeah: I already read, some time ago and elsewhere, that Xfce team will introduce more CSD in the system.