How To: set up custom lock screen and app-grid for Phosh based systems

[AwHereWeGoAgain]

So I just wanted to make this information more readily available to those who are new or want a custom lock screen for their pine phone.  I love the Phosh based OS's but I wanted a little more glam like PlasMo had.

I just want everyone to know that I didn't come up with any of this information.  It was all posted originally by Lowkeylone on Reddit.

https://www.reddit.com/r/pinephone/comme...to_phoshs/

Basically you need to create a new file. It will be located in this folder ----> ~/.config/gtk-3.0   and it will be called "gtk.css"   
(I did this on my laptop with the SD card inserted so I could use mouse and keyboard to save me a little hassle.)

Copy and paste this data into your new file:

Code:

/*
* Set a background for the lockscreen.
*/
phosh-lockscreen, .phosh-lockshield {
  background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
                    url('file:///home/lowkey/Pictures/background.jpg');
  background-size: cover;
  background-position: center;
}

/*
* Set a background for the app grid.
*/
phosh-app-grid {
  background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
                    url('file:///home/lowkey/Pictures/background.jpg');
  background-size: cover;
  background-position: center;
}

Make sure you change the file paths to match the image file you want to use.

For best results it was suggested that the file be resized to 720X1440.  I simply used gimp to crop/resize the image.  

It went well for me.  I just had to make it my wallpaper as well for it to seem seamless while loading apps and stuff.

This should work on other OS's that run Phosh as well. 

 Good luck!