How to change the titlebar height in standard GTK apps and those with headerbars/CSDs on Gnome 3.20
- create a file ~/.config/gtk-3.0/gtk.css ( add the below CSS )
- then you will need to reload gnome-shell:
ALT + F2
and typer
I was able to reduce the app Titlebar on Gnome 3.20 with the following CSS:
headerbar entry,
headerbar spinbutton,
headerbar button,
headerbar separator {
margin-top: 0px; /* same as headerbar side padding for nicer proportions */
margin-bottom: 0px;
}
headerbar {
min-height: 24px;
padding-left: 2px; /* same as childrens vertical margins for nicer proportions */
padding-right: 2px;
margin: 0px; /* same as headerbar side padding for nicer proportions */
padding: 0px;
}
Headerbar/CSD
Actually, a section of the code that I found via reddit and posted above, namely
headerbar entry,
headerbar spinbutton,
headerbar button,
headerbar separator {
margin-top: 2px; /* same as headerbar side padding for nicer proportions */
margin-bottom: 2px;
}
DOES modify the headerbars/CSDs. However the effect is not immediate. Even if you reload gnome, you might need to close all windows, wait a while, or log out and log back in again to see the effect.
I am still not seeing any difference in the header bar when modifying the following.
headerbar {
min-height: 38px;
padding-left: 2px; /* same as children's vertical margins for nicer proportions */
padding-right: 2px;
}
Standard titlebar
The two sections for the normal window titlebars work as expected.
.default-decoration {
min-height: 0; /* let the entry and button drive the titlebar size */
padding: 2px
}
.default-decoration .titlebutton {
min-height: 26px; /* tweak these two props to reduce button size */
min-width: 26px;
}
Titlebar border
You can use the following to remove the titlebar border if you are running the default adwaita theme. From https://bbs.archlinux.org/viewtopic.php?id=211102
window.ssd headerbar.titlebar {
border: none;
background-image: linear-gradient(to bottom,
shade(@theme_bg_color, 1.05),
shade(@theme_bg_color, 0.99));
box-shadow: inset 0 1px shade(@theme_bg_color, 1.4);
}