13

In Ubuntu 14.04, I could style the appearance of the gnome terminal and its tabs by creating a file

/home/$user/.config/gtk-3.0/gtk.css

and putting CSS code into it e.g.

    TerminalWindow .notebook tab.top:active{
      padding: 0;
      border-image: none;
      background-color: #555;
    }
    [...]

Now on Ubuntu 16.04 this has no affect on the appearance of gnome terminal.
How can I modify gnome terminal's appearance on Ubuntu 16.04?

the_velour_fog
  • 2,350
  • Could you please mention the name of the gtk3 theme you're using? If you've tried different gtk3 themes, which are those? The reason I'm asking is hinted at here: http://askubuntu.com/questions/765909/tweaking-newer-gtk3-themes – DK Bose May 08 '16 at 01:12
  • BTW, there are quite a few differences in "gtk3" when moving from 14.04 (gtk 3.10) to 16.04 (gtk 3.18). – DK Bose May 08 '16 at 01:14
  • @DKBose this is the default theme. I tried installing a theme once in the last 6 years, and within a few hours - the system completely locked up, no tty nothing. Which is quite amazing that changing some icons and cosmetic items could cause catastrophic system failure. I would like to think it wasn't the theme, but I dont want to take the risk again! – the_velour_fog May 08 '16 at 01:17
  • @DKBose if you are intested the theme I installed which allegedly broke my system was numix GTK it seems from you other question you have tried it too? – the_velour_fog May 08 '16 at 01:23
  • IMO, you maybe safest with adwaita. It comes pre-packed with any GNOME-distro. By default theme, I'm guessing Ambiance. Ambiance in 16.04 is still old-school and so you should be able to edit things simply unlike with the Numix issue I described. If you can't, that simply means that the GNOME devs have hard-coded something :( – DK Bose May 08 '16 at 01:31
  • Have you tried editing /usr/share/themes/Ambiance/gtk-3.0/apps/gnome-terminal.css instead of /usr/share/themes/Ambiance/gtk-3.0/gtk.css? The latter basically points to /usr/share/themes/Ambiance/gtk-3.0/gtk-main.css which has @import url("apps/gnome-terminal.css"); near the end of the file. – DK Bose May 08 '16 at 03:40
  • @DKBose . you are right that my theme is "ambiance". the file I am used to editing on 14.04 was in my home dir .config/gtk-3.0/gtk.css changes to this file used to take effect immediately on any new instances of gnome terminal (existing windows would be unaffected). I just tried editing the files you mentioned and it seems to have no effect. – the_velour_fog May 08 '16 at 03:54

2 Answers2

3

This works for me:

/* gnome-terminal */
@define-color terminal_bg #300a24;

TerminalScreen {
    -TerminalScreen-background-darkness: 0.95;
    background-color: @terminal_bg;
    color: #fff;
}

TerminalScreenContainer .scrollbar:hover:not(.slider),
TerminalScreenContainer .scrollbar.dragging:not(.slider) {
    background-color: alpha(@scrollbar_track_color, 0.4);
}

/* Since .hovering class is not working here, we always
 use the same radius */
TerminalScreenContainer .scrollbar.slider.hovering,
TerminalScreenContainer .scrollbar.slider.dragging {
    border-radius: 1px;
}

TerminalScreenContainer .scrollbar {
    background-color: transparent;
}

TerminalWindow .notebook tab:active {
    padding: 0;
    border: none;
    background-color: #222;
}

The code I added is at the bottom. The file I edited is ~/.themes/ORIG-Ambiance/gtk-3.0/apps/gnome-terminal.css.

Notes:

  • I just copied over the Ambiance folder from /usr/share/themes and renamed it so that I don't need to use elevated privileges while editing the file.

  • I found that using #555 made it difficult to see the text in the tab.

  • I also changed the selected_fg_color to be sure of which theme is which and that's why the scrollbar isn't orange ;)

gnome-terminal

DK Bose
  • 42,548
  • 23
  • 127
  • 221
  • 1
    oh wow, nice work! I am currently working on setting gnome terminal preferences through gnome 3's gsettings program. once finjshed Ill try your code amd let you know how it went! – the_velour_fog May 09 '16 at 06:39
  • I've tried the things you've shown and its not doing anything, Im just wondering how you applied these changes? By adding this whole folder structure have you essentially created a new theme? If so does that mean you need to apply the theme in the same way you would apply e.g. a theme like Numix by using a tweak tool and and select the new theme ORIG-Ambiance from drop down menu and restart application, gnome , or user session? – the_velour_fog May 10 '16 at 02:53
  • I think you can do exactly what I did but with /usr/share/themes/Ambiance/gtk-3.0/apps/gnome-terminal.css. That way, you won't have the hassle of needing to switch themes. Of course, you'll need to use sudo nano or whatever you use to edit system files. And a back-up would be a good idea. I use the Openbox session of Lubuntu and it doesn't require me to install special tools to change themes. I just have a list of themes in ~/.config/gtk-3.0/settings.ini with all except one commented out. Changing user-level themes is then just a matter of editing that file. – DK Bose May 10 '16 at 03:26
  • For system-wide changes, the corresponding file is in /etc/gtk-3.0/. – DK Bose May 10 '16 at 03:27
  • 1
    thanks. - upvote - even if it doesnt directly fix the problem its still got good info on how to modify GTK. I will have a look and let you know if it works. thanks – the_velour_fog May 10 '16 at 03:31
1

Logging out/closing all my programs and logging back in applied the theming after all.
The GTK API reference for GtkCssProvider (the unstable dev version - I cant find the equivalent sections for stable) explains/confirms how GTK will read CSS code for a theme on startup:

An application can cause GTK+ to parse a specific CSS style sheet by calling gtk_css_provider_load_from_file() and adding the provider with gtk_style_context_add_provider() or gtk_style_context_add_provider_for_screen().
In addition, certain files will be read when GTK+ is initialized. First, the file $XDG_CONFIG_HOME/gtk-3.0/gtk.css is loaded if it exists.
Then, GTK+ tries to load $HOME/.themes/theme-name/gtk-3.0/gtk.css, falling back to datadir/share/themes/theme-name/gtk-3.0/gtk.css, where theme-name is the name of the current theme (see the "gtk-theme-name" setting) and datadir is the prefix configured when GTK+ was compiled, unless overridden by the GTK_DATA_PREFIX environment variable.

Previous experience suggested gnome-terminal all you needed to do was close all gnome-terminal tabs and windows to make new theming take effect. As per the docs, maybe GTK needed to go through its initialisation, or there may have been a gnome-terminal process still running, requiring me to logout and back in.

the_velour_fog
  • 2,350