How to enable/add window borders in 17.10 & 18.04?

Question

I have multiple terminal windows open with a black background and the black shadow on the black background is completely lost when they overlap. This is a problem for any windows with a black background. I used to modify unity.css to add window borders, but 17.10 is Gnome and that doesn't work any more! I don't see any Gnome theme controls in the settings UI either.

Worked in Ubuntu 17.04, but not 17.10

Edit /usr/share/themes/Ambiance/gtk-3.20/apps/unity.css and change

-UnityDecoration-extents: 28px 0 0 0;

to

-UnityDecoration-extents: 28px 2 2 2;

Doesn't work: gnome-terminal.css

Edit /usr/share/themes/Ambiance/gtk-3.20/apps/gnome-terminal.css

@define-color terminal_border #ff0000;

vte-terminal.terminal-screen {
    -TerminalScreen-background-darkness: 0.95;
    background-color: @terminal_bg;
    color: #fff;
    border-width: 1px 1px 0px 1px;
    border-color: @terminal_border;
}

Doesn't work: gnome-applications.css

Edit /usr/share/themes/Ambiance/gtk-3.20/apps/gnome-applications.css to say

TerminalScreen {
    background-color: @theme_base_color;
    color: @theme_fg_color;
    -TerminalScreen-background-darkness: 0.95;
    border-bottom-width: 2px;
    border-right-width: 2px;
    border-left-width: 2px;
}

TerminalWindow GtkNotebook.notebook {
    border-bottom-width: 2px;
    border-right-width: 2px;
    border-left-width: 2px;
}

Possible Hint:

Maybe I should be editing something in /usr/share/gnome-shell/theme?

alternatives.log:update-alternatives 2017-11-12 10:59:31:
run with --install /usr/share/gnome-shell/theme/gdm3.css gdm3.css
    /usr/share/gnome-shell/theme/ubuntu.css 10
    alternatives.log:update-alternatives 2017-11-12 10:59:31:
    link group gdm3.css updated to point to
    /usr/share/gnome-shell/theme/ubuntu.css

Answer 1

I found the answer here.

1. Make a file ~/.config/gtk-3.0/gtk.css

2. Add the lines:

   decoration {
     border: 1px solid gray;
     background: gray;
   }
   

3. Reboot or log out+log in

Answer 2

The following adds the border only to gnome-terminal windows; tested on GNOME 3.22 (in Debian 9).

1. Make/edit the file ~/.config/gtk-3.0/gtk.css

2. Add the following:

   terminal-window notebook {
     border-width: 0px 1px 1px 1px;
     border-style: solid;
     border-color: grey;
   }
   
     terminal-window.maximized notebook,
     terminal-window.fullscreen notebook {
     border-style: none;
   }
   

3. Log out/log in

Answer 3

I don't really like that bright gray, here's my preference for ~/.config/gtk-3.0/gtk.css (rgba colors only worked in wayland for me, so I settled on #383838.)

terminal-window notebook {
  border: 1px solid #383838;
}

But that alone doesn't work for emacs, so I also add:

/* for emacs */
window#Emacs.background box#pane {
  border-style: solid;
  border-color: rgba(0,0,0,0.75);
  border-width: 0 1px 1px 1px;
}

Here's the pretty, subtle result:

Bonus / note to self: you can test and tweak css using the GTK inspector, e.g.: GTK_DEBUG=interactive emacs (tutorial) - and a reference for how gtk CSS selectors work.