[SOLVED] Change xfce csd title bar font color

[rattkjelke]

This problem of the text being grey rather than black probably affects other things as well if it is theme-related as you say. However, if your concern is just that title text in the CSD headerbar you could try adding some css code to your home folder at ~/.config/gtk-3.0/gtk.css (make sure Thunar is set to show hidden files and create the gtk.css file if it does not already exist).

I just tried that. I already had a gtk.css to fix desktop icon spacing and some other things.

"headerbar" color didn't work. I changed it to "GtkHeaderBar" and that didn't work either.
So either those variable names are wrong, ~/.config/gtk-3.0/gtk.css can't change CSD, or it's not overriding it for some reason.

[rattkjelke]

I just discovered that adding

Code: Select all

/* color of CSD headerbar text */
headerbar {
    color: black;
} 

to ~/.config/gtk-3.0 works on Adwaita and Mint-Y themes but not Mint-X themes.
On Adwaita and Mint-Y it makes the text black all the time, even when the window is unfocused.

[michael-hi]

That's odd. I wonder why Mint-X should be different.

But on the second point: yes, I would expect that code to make the text black all the time including on unfocused windows. However, if you use the second of the two options shown in my previous post I think it would only blacken the text of the focused window.

[rattkjelke]

However, if you use the second of the two options shown in my previous post I think it would only blacken the text of the focused window.

It does. I overlooked that.

[michael-hi]

I've found an alternative wording that seems to work for CSD apps under Mint-X themes. The problem is I don't have Mint 20.2 so I can't test whether it also works for the new CSD-style settings windows in the latest Xfce. Anyway, what you could try is replacing the term headerbar with .csd .title so the code to use would be:

Code: Select all

/* color of CSD headerbar title */
.csd .title {
    color: black;
}

.csd .title:backdrop {
    color: gray;
}

[rattkjelke]

I've found an alternative wording that seems to work for CSD apps under Mint-X themes. The problem is I don't have Mint 20.2 so I can't test whether it also works for the new CSD-style settings windows in the latest Xfce. Anyway, what you could try is replacing the term headerbar with .csd .title so the code to use would be:

Code: Select all

/* color of CSD headerbar title */
.csd .title {
    color: black;
}

.csd .title:backdrop {
    color: gray;
}

That worked! At least on the stock themes.
Thanks!

[secureIT]

nice that it is solved for your system, but I tried it under LM 20.1 and LM 20.2 - and unfortunately it does not work ,,,,,,,,

[palo]

Thank you for the solutions michael-hi. It is worth mentioning that the .config file may be good for testing these changes but a better long term solution would be making the change to the theme instead (after it has been copied to Home). Otherwise when switching themes in the future there may be an unwanted effect.
I am using a dark theme in Mint 20.2 XFCE and noticed with CSD windows the titles were staying white when loosing focus.

Adding

Code: Select all

 /* color of CSD headerbar title 
to distinguish unfocused window*/

.csd .title:backdrop {
    color: black;
}

to the bottom of my ~/.local/share/themes/my-theme/gtk-3.0/gtk.css fixed that problem but now I have to wade through the other 4,000 lines in that file to make the window buttons black when loosing focus - just to make everything unicorns.

Any idea michael-hi?

[michael-hi]

I should say I am not any kind of css guru - I really don't know what all the dots and stuff mean! I simply look online and try stuff out. A good resource for anything Xfce-related is the Xfce Forum and in particular the many helpful posts by ToZ. For instance, this thread makes reference to css and headerbars:
https://forum.xfce.org/viewtopic.php?id=14574

secureIT:

The solution may not apply universally because everyone's system is different and not all themes are standard. Bear in mind too that it only changes the title text on CSD windows, so it will have no effect on other windows. Most Xfce windows are drawn by xfwm and your previous post mainly related to these. Even with CSD windows the effect may not be very noticeable, except where a theme is used which has a particularly pale font colour in the headerbar (as in the OP's first post). What you could do just to test this out is try using the same css code but with more prominent colours eg red and blue.

palo:

I suppose both ways are valid. If you are making many alterations to a theme then it makes sense to roll them all into one file, but if you are making minor tweaks which will likely apply across the board then putting them in .config keeps things neater I think. As for the buttons, you could try:

Code: Select all

button.titlebutton.minimize:backdrop {
    color: black;
}

button.titlebutton.maximize:backdrop {
    color: black;
}

button.titlebutton.close:backdrop {
    color: black;
}

But if there are other elements in the headerbar you want to change, I am not sure how these would be described. Someone more expert might offer an answer here or you could look for clues eg in the link above. Or indeed post an enquiry in the Xfce Forum...

[palo]

As for the buttons, you could try:

Code: Select all

button.titlebutton.minimize:backdrop {
    color: black;
}

button.titlebutton.maximize:backdrop {
    color: black;
}

button.titlebutton.close:backdrop {
    color: black;
}

But if there are other elements in the headerbar you want to change, I am not sure how these would be described. Someone more expert might offer an answer here or you could look for clues eg in the link above. Or indeed post an enquiry in the Xfce Forum...

I think you might be underrating yourself michael-hi - that code worked perfectly. I would never have thought to look for "titlebutton". Those 3 white dots are left in the headerbar but I'm sure a little guesswork and trials can pin that down. I will have a look at the link. Thanks.

[michael-hi]

Those 3 white dots are left in the headerbar but I'm sure a little guesswork and trials can pin that down.

This might work. .csd .titlebar * would seem to pick up everything on the headerbar so in place of the previous code you could simply use:

Code: Select all

.csd .titlebar *:backdrop {
    color: black;
}

Not sure if there would be any unintended consequences of using an asterisk as wildcard but worth a try.

[palo]

This might work. .csd .titlebar * would seem to pick up everything on the headerbar so in place of the previous code you could simply use:

Code: Select all

.csd .titlebar *:backdrop {
    color: black;
}

Not sure if there would be any unintended consequences of using an asterisk as wildcard but worth a try.

In addition to the menu dots some windows have other objects such as the magnifier on the Settings Manager. Your magic wildcard line takes care of everything in one swell foop. Brilliant idea
So far no ill effects on my theme.

Thank you again this has been very enlightening.

[michael-hi]

Excellent! Glad it all worked, both for you and the OP

[secureIT]

Hi together

I dont want to hijack this thread.

As i stated before the solution doesnt work in my mint 20.2 Xfce

So may i ask you on which DEs ou are on ?

I ask the question, because i am planning to do a script for it and merge it together with other scripts, that belongs to the font color
e.g like i did here with the change of desktop-font-color :

viewtopic.php?f=42&t=342387

This should be a new graphical frontend for font-color-changing in LM Xfce.

To make it common i will need more informations and thats the reason i ask for it...........

[michael-hi]

So may i ask you on which DEs ou are on ?

Hi

I am currently using Mageia 8 (32 bit) but also tried out the code successfully on a Live USB version of LM 20.1 (64 bit). I note that in their posts rattkjelke and palo both said they are using LM 20.2.

I have just tested it now on my 64 bit version of LM 19.3 (which is installed onto a USB stick) and one thing strikes me. Of course it only works on CSD windows anyway but it won't work if you have gtk3-no csd installed, presumably because in that case the headerbar is buried within a normal xfwm window border. I uninstalled gtk3-nocsd, logged out/in and then it worked. Maybe this is the problem in your case?

EDIT: Forgot to say that the Mageia is Xfce 4.16 and my two Mint versions are both Xfce 4.14

[secureIT]

Many thanks @ michael-hi

I created a new thread to create a script for changing the font color in csd windows.

You and everyone else in this thread are invited to participate and test.

The thread can be found here: .......

update :

thread is cancelled