Gnome Taskbar Height Change

A while ago, I downloaded the Orchis-theme. The taskbar (or status bar/top bar? Anyway, it's called the panel top bar in English) at the top is too wide. It looks really awkward on smaller screens, so I had to search for a fix myself. The process is as follows.

1. Background

The directory for installed Gnome themes is in ~/.theme, as shown below. I installed the Orchis theme in various colors.

➜ ~ cd .themes ➜ .themes ls Orchis Orchis-Green-Dark-Compact Orchis-Grey-Light Orchis-Orange-Dark-Compact Orchis-Pink-Light Orchis-Purple-Light-Compact Orchis-Yellow Orchis-Compact Orchis-Green-Light Orchis-Grey-Light-Compact Orchis-Orange-Light Orchis-Pink-Light-Compact Orchis-Red Orchis-Yellow-Compact Orchis-Dark Orchis-Green-Light-Compact Orchis-Light Orchis-Orange-Light-Compact Orchis-Purple Orchis-Red-Compact Orchis-Yellow-Dark Orchis-Dark-Compact Orchis-Grey Orchis-Light-Compact Orchis-Pink Orchis-Purple-Compact Orchis-Red-Dark Orchis-Yellow-Dark-Compact Orchis-Green Orchis-Grey-Compact Orchis-Orange Orchis-Pink-Compact Orchis-Purple-Dark Orchis-Red-Dark-Compact Orchis-Yellow-Light Orchis-Green-Compact Orchis-Grey-Dark Orchis-Orange-Compact Orchis-Pink-Dark Orchis-Purple-Dark-Compact Orchis-Red-Light Orchis-Yellow-Light-Compact Orchis-Green-Dark Orchis-Grey-Dark-Compact Orchis-Orange-Dark Orchis-Pink-Dark-Compact Orchis-Purple-Light Orchis-Red-Light-Compact ➜ .themes pwd /home/mephisto/.themes ➜ .themes ls -al /usr/share/themes total 255 drwxr-xr-x 47 root root 47 May 19 13:45 . drwxr-xr-x 345 root root 347 Sep 9 16:04 .. drwxr-xr-x 4 root root 5 Apr 19 18:04 Adwaita drwxr-xr-x 4 root root 5 Apr 19 18:04 Adwaita-dark drwxr-xr-x 3 root root 3 May 19 13:45 Bright drwxr-xr-x 3 root root 3 May 19 13:45 Daloa drwxr-xr-x 6 root root 6 May 19 13:45 Default drwxr-xr-x 3 root root 3 May 19 13:45 Default-hdpi

Switch the shell theme using Gnome Tweaks

If you encounter an exclamation mark and can't select it, you need to install gnome-shell-extensions:

sudo apt install gnome-shell-extensions Check user themes. If you don't know how to do it, you can search online.

2. Modify the Gnome Shell style

The target file to modify is gnome-shell.css. The path is in the gnome-shell directory of the used themes.

➜ gnome-shell realpath gnome-shell.css /home/mephisto/.themes/Orchis-Green/gnome-shell/gnome-shell.css

Open it in an editor (I use VSCode) and find the style configuration line for the Top Bar.

You can refer to the CSS documentation for the meaning of the configuration values. I won't go into detail here. Be careful when making changes, otherwise the interface will break and it will be very troublesome. After confirming everything is correct, reload the theme without restarting Gnome Shell. Press Alt+F2 and type rt (presumably "reload theme"). You can adjust the settings based on your screen size and preferences until you're satisfied. You can also back up the changes before making them so you can roll back in an emergency.

3. Results

If you're familiar with CSS and Gnome Shell configuration logic, and have a knack for design, you can create your own themes for your own use and share them with others.

Finally, if the Gnome Shell interface crashes during modification, you can use the following method:

• Press Ctrl+Alt+F1 to log in to tty1. # I usually skip the following steps and directly startX to the graphical interface and restore the files.
• Enter export DISPLAY=:0
• Enter gdb /usr/bin/gnome-shell
• Enter r --replace in Gdb
• Press Alt-F7 to return to the graphical interface.

If the interface freezes, switch to another console (tty1 to tty6) and execute DISPLAY=:0 gnome-shell --replace or gnome-shell --replace --display=:0.