Space between panel and application

1

I have installed UB 20.10 yesterday and I love it. It is very smooth and beautiful.

I was playing around with the non-auto-hide panels and wonder if there is a way to obtain a space between the panel and the full-screen-application … The panel and the application often have the same background color and it is sometimes hard to distinguish between them …

2

There is a way, kinda… I am assuming you want to go from this:

tb1

to something like this:

tb2

Maybe someone has an easier way, but if you don’t mind doing this by editing the theme, you can add a transparent border to the bottom of the budgie panel.
border-bottom: 3px solid rgba(0, 0, 0, 0);

Disclaimer: I’ve seen that you make themes and have some on gnome-look, so I realize the rest of this is not necessary, but I figure I would throw in the details in case anyone else is interested.

If you are using Pocillo for example, you can edit the file:
/usr/share/themes/Pocillo/gtk-3.22/gtk.css

Alternatively, you can copy the Pocillo theme to ~/.themes/ and edit it there instead.

Down around line 4796, you can change this:

.budgie-panel {
  background-color: #383c4a;
  color: #FFFFFF;
  font-weight: 500;
}

to this:

.budgie-panel {
  background-color: #383c4a;
  color: #FFFFFF;
  font-weight: 500;
  border-bottom: 3px solid rgba(0, 0, 0, 0);
}

Change the theme, then change it back and it should have the gap now.

The big problem with this way is you have to do it with every theme you want to use (there is 6 variants of Pocillo alone) and you have to modify the gtk-dark.css file also if you want to turn on the “dark theme” switch in Budgie settings. Also, some themes are compiled, so they can’t be changed this easily.

1 Like
3

Hi @samlane , thanks for the input. You perfectly understood my intentions. :slight_smile: And it’s true: I like to play around with the Gtk-settings and css, and have a couple of themes on gnome-look.

The themes that come with Budgie/ Ubuntu often have a detail or two that I don’t like, so I usually give them a little of a “personal note”.

With the window margin I was hoping that there might be a decont-setting or something like that, so that I wouldn’t have to adapt the code of all the themes individually. But I couldn’t find one.

Your idea with the transparent border I have tried and it worked. Something like:

margin-bottom: 5px;

also does the trick.

There is a catch with both approaches, though: When using an additional left panel, the additional space under the top-panel also creates a gap between the top and the side-panel. What looks a little odd when using a desktop background that has a contrasting color with the panels.

Another problem is that for the left-panel, I need to create a right margin (or border), too, that also adds an additional space to the right of the top-panel.

I am now trying two find a way to create a margin around the window itself, but I still couldn’t find the correct entry in the style-sheet of the theme.

1 Like
4

I personally prefer when window top bar merges with the top panel, using applets like pixel-saver and menu global.

So I hope your idea will never get default, lol, but it’s always interesting to see « how things work behind » !

5

Lol, that’s why it’s so good to have open source software … everyone can create his/ her own mess :slight_smile: :slight_smile:

1 Like