Saturday, July 4. 2015
Customizing gnome 3.16
Another quick entry to document step by step how to change the aspect of the recently upgraded gnome 3.16 in debian (testing). As you know I had several issues upgrading gnome 3 in the past (specially gnome-shell). It seems that now this desktop is more mature and with 3.16 the packages upgraded successfully. But, as I think you also know, I have a thing about customizing the colors of my gnome (I want just a little change, instead of the blue foreground color I prefer a beautiful red). Every time I do this it is different and I spent more time. I do not know if gnome guys are crazy or I am simply more stupid than before. Today's entry is going to summary the process to change css of gnome-shell and gtk./p>
gnome-shell
About gnome-shell I found some information in the following arch linux forum. The steps to change the color are the following:
Create this script inside the /tmp/lala.sh file (the script just decompresses the gresource file with the resources of the default Adwaita theme inside /tmp/lala directory).
#! /bin/sh #change workdir to suit your system workdir=/tmp/lala gst=/usr/share/gnome-shell/gnome-shell-theme.gresource mkdir theme for r in `gresource list $gst`; do gresource extract $gst $r >$workdir${r/#\/org\/gnome\/shell/} done
Create the directory and execute the script to obtain the files:
mkdir /tmp/lala bash -x /tmp/lala.sh cd /tmp/lala/theme
I have a custom background for login and lock-screen. I added it to the working directory:
cp ~/images/login-background.jpg .
I Changed the lockDialogGroup (file gnome-shell.css) to include that background image (this step is the same than in version 3.8 as I commented in the previous entry):
#lockDialogGroup { background: #2e3436 url(resource:///org/gnome/shell/theme/login-background.jpg); background-repeat: no-repeat; }
Finally I modified some colors to use red instead of blue. I replaced the following words in the same gnome-shell.css file: "215d9c" to "f43030"; "256ab1" to "bd3232"; and "rgba(33, 93, 156," to "rgba(155, 33, 33,").
At this point the resource bundle should be re-created. In order to do that an xml file with the resource files is needed. I created a gnome-shell-theme.gresource.xml file with all the files contained by the working directory:
for i in *; do echo " <file>$i</file>"; done >gnome-shell-theme.gresource.xml
Just append to the generated file these lines at the beginning:
<?xml version="1.0" encoding="UTF-8"?> <gresources> <gresource prefix="/org/gnome/shell/theme">
And complete the XLM with these closing lines at the end:
</gresource> </gresources>
The resulting file is a well-formed gresources definition file.
Finally with the just created XML file the resources are packaged inside a new bundle:
glib-compile-resources gnome-shell-theme.gresource.xml
And now you can swap the system gresource file (I created a backup of the original file and a backup of my new bundle, just in case of an upgrade). You need root access to do this:
cd /usr/share/gnome-shell cp gnome-shell-theme.gresource gnome-shell-theme.gresource.ORIG cp /tmp/lala/theme/gnome-shell-theme.gresource gnome-shell-theme.gresource cp gnome-shell-theme.gresource gnome-shell-theme.gresource.RICKY
Restart the gnome-shell (Alt+F2 and then type "r" in the box) and try your new gnome-shell colors.
GTK
GTK themes are changed a lot in gnome 3.16. I was unable to find where the hell the real gtk.css is (if you try to find the previous one, /usr/share/themes/Adwaita/gtk-3.0/gtk.css, you will see that it is almost empty with a beautiful "this file is not used"). I suppose that now the css is compiled somewhere but I do not know where. A second difference is that now GTK uses a sass (Syntactically Awesome Stylesheets) preprocessor (although I almost got crazy at that time, now I think it is a fantastic idea, because now you can change basic colors and all the crazy css files are regenerated easily).
After some hours trying to find a way to create the css file using a red color, the following steps worked for me:
Install as root ruby and use gem to install a sass implementation using the gem utility. The gem command is a package manager for ruby itself (the final command is placed in /usr/local). I followed this quick article.
apt-get install ruby-full gem install sass
Clone the git repository for gtk+ (in order to get the Adwaita theme for GTK).
cd ~ git clone git://git.gnome.org/gtk+
The subdirectory gtk/gtk+/theme/Adwaita contains the css files for Adwaita.
Create the new theme AdwaitaRed as I did in the previous entry (copying the default Adwaita and changing the name).
cd ~/.themes mkdir AdwaitaRed cd AdwaitaRed cp -r /usr/share/themes/Adwaita/* . sed "s/Adwaita/AdwaitaRed/g" index.theme > index2.theme mv index2.theme index.theme
Move to the gtk-3.0 folder and copy the gtk resources from the cloned repository in step 2:
cd gtk-3.0 cp -r ~/gtk+/gtk/theme/Adwaita/* .
Modify the _colors.scss file with the changes you need. In my case changing blue to red color ("4a90d9" to "f43030") and default dark color for text to grey (I usually have dark desktop backgrounds and I hate not seeing the file names in my desktop).
Run sass to recreate the css files with your new colors:
sass --update --sourcemap=none .
Finally modify the gtk.css to point to the local files instead of the gresource bundle:
@import url("gtk-contained.css");
The same with gtk-dark.css:
@import url("gtk-contained-dark.css");
Use gnome-tweak-tool to select AdwaitaRed as the GTK+ theme.
Here I present some samples of my desktop (it is almost the same than the one presented in the previous gnome entry).
This entry explains the procedure to change gnome-shell and gtk themes (my change is almost nothing, I just want to change the blue color that by default is used for selected items for a red color). As several times in this blog the entry is mainly to remember what I did. But I am not sure about it, next time everything can be again absolutely different and this information will be useless (came on gnome guys, take it easy please).
Every time I upgrade gnome I think why I am still using it.
Comments