How to make a Black “Dark mode”

After finally succeeding to get the dark mode working,
I want to ask if anybody has made a black background?
For the background I downloaded a vantablack picture, that is a true black.
Thank you.

See: https://source.puri.sm/Librem5/community-wiki/-/wikis/Tips%20&%20Tricks#setting-a-custom-background-in-phosh

(…if I understand what you’re wanting to do…)

2 Likes

That’s a mouthful!
This is what I intended yes!
Thank you very much for your input! Highly appreciate the effort.

1 Like

In practice:

1 Like

Already stuck on the first try.
I made a new folder in the files app instead of a file.
It will not let me delete it in any way.
Tried to mark it and delete with the keyboard,
How do I do delete?
Thank you.

Try renaming it to something without “.css” in the name, then try deleting it. Also, check the folder’s properties to see if “purism” user has read/write permission.

In any case, you can create the gtk.css FILE and proceed with setting the background while you figure out the stubborn FOLDER issue.

In the terminal, create the gtk.css (if it doesn’t already exist) USING ANY INSTALLED TEXT EDITER:
please explain that part. The terminal is an editer right?

You forgot the space after nano. You call the program nano and then the options in this case a file route, so nano will open it

1 Like

Thank you.

nano is a text editing program that is called up by the terminal so that you can edit a file that is stored somewhere in your system files. Another text editor is vim, and there are several others. Which of them one uses is entirely by choice; nano is usually installed already, so it’s a default choice.

Terminal is not a text editor itself. It allows you to enter and execute changes, such as installing or removing software, or changing configurations, including the contents of any file…which you first have to open using a text editor like nano.

In the case of the gtk.css file, it doesn’t exist by default (because it wasn’t needed by any GTK-based application yet), which is why you see “No such file or directory” as output above. So first you have to manually create it before you can edit it in the terminal. By the way css stands for Cascading Style Sheets; it is simply a way for the user to make GTK applications look and behave as desired instead of preset defaults.

So, in the terminal, to open any file with nano so that you can edit the contents, the command would take this format:

sudo nano NameOfDirectory/NameOfFile&Extension
[EDIT: Disregard sudo; it’s not required in this command. Should be nano NameOfDirectory/NameOfFile&Extension instead. See comments below.]

sudo - i.e. “super user do” - elevates your user privileges to admin level (required for making system changes)

nano - use the program nano to edit the file that follows

“NameOfDirectory” - the name of the directory (folder) where the file is located

“NameOfFile&Extension” - the name of the file you want to edit, e.g. “gtk.css” or “abc.txt” or whatever

By the way, here’s a simple guide to basic terminal commands: https://ubuntu.com/tutorials/command-line-for-beginners#1-overview

So, in short, here’s what you are trying to accomplish with the custom background creation:

  1. Create (if it doesn’t exist already) the gtk-3.0 FOLDER inside the .config FOLDER in the file system home folder. (TIP: a “.” before a folder or file name makes it hidden; you can’t see it in the files navigator unless you select “Show Hidden” from the menu. This is to prevent accidents.)

  2. Open the gtk-3.0 FOLDER and create a FILE named gtk.css.

  3. Inside gtk.css, paste the script as indicated in the tutorial. Change the path to your saved background to correspond to the name and location of your background (mine is file:///home/purism/Pictures/mybackground.png), and also set your desired transparency level. Save and close the file.

(Steps 1, 2, and 3 can be done either in the terminal as described above, or simply in the file navigator, using the menus, right-click, etc.)

  1. Restart phosh (the user interface of the Librem 5). You can do this with a terminal command (sudo systemctl restart phosh) or by restarting the phone.

Hope that helps. :wink:

2 Likes

Save and close the file did not work for me.
How to save and close?
I am sorry, it is difficult to get back on the horse🤨

Are you doing it in the terminal or in the file navigator?

In nano, as instructed.
Your last return was very instructive.
I picked up a lot and already saw the mistake I made with the picture… the rest was lost not included in the initial frame.
Thank you very much, appreciate it.

1 Like

No problem…
So using nano in the terminal, once you copy and paste the script in, look at the bottom of the screen for options. One is Cntrl X, which means close. Once you type that, you will get the option to save changes or discard. You should be able to save it and close it, then exit the terminal.

And actually…I think sudo is not required for this operation. Sorry.

1 Like

In that case, if the file has already been created, it would be best to check output of

ls -l ~/.config/gtk-3.0/gtk.css

in order to make sure that it didn’t pick up any unusual ownership or permissions.

2 Likes

1 tiny issue left to explain please,
I found the the folder gtk-3 inside the .config folder.
So far so good!
How do I create a file inside a folder being in the app “files” on the Librem 5 phone not a desktop.
I checked the shortcut section.
Thank you.

This should do, within the terminal:
cd ~/.config/gtk-3.0/
touch gtk.css
ls -la

EDIT: @dav69, you’ll need instructions from this important post: Terminal to clipboard, although Ctrl+c and Ctrl+v will work on Librem 5 keyboard very well.

One way is to rename your background picture to mybackground.jpg and put/paste it in here: /home/purism/Pictures/ or just “Change the path to point to your chosen image”.

This the result,

1 Like

Each raw is separate command/step:

  1. cd ~/.config/gtk-3.0/

  2. ls -la −− you’ll see that this folder is empty

  3. touch gtk.css

  4. ls -la −− you’ll see that above, third one, command created needed gtk.css file

Above linked text (code) to be put into gtk.css file you’ll select as a whole and touch Ctrl and letter c to copy it. Than switch to with nano opened gtk.css file and touch v to paste. Touch/press again Ctrl to disable this button and use keyboard as usual to save and close this gtk.css file.

This got me when I was new, but in nano after pressing Ctrl x press y and then press enter to finish saving.

1 Like