V2.0.2 (#25)

* lazy load bg

* css: fixed black vertical lines

Author: eromatiya

css/body-background.css

@@ -3,7 +3,7 @@
 	height: 100%;
 	top: 0;
 	left: 0;
-	position: fixed;
+	position: absolute;
 	margin: 0;
 	padding: 0;
 	z-index: 0;

css/screens.css

@@ -3,7 +3,7 @@
 	height: 100%;
 	top: 0;
 	left: 0;
-	position: fixed;
+	position: absolute;
 	margin: 0;
 	padding: 0;
 	z-index: 20;
@@ -20,7 +20,7 @@
 	left: 0;
 	margin: 0;
 	padding: 0;
-	position: fixed;
+	position: absolute;
 	background-color: #252525;
 	background-size: cover;
 	background-repeat: no-repeat;
@@ -87,8 +87,9 @@
 }
 
 /* Greeter Screen */
-#screen-greeter {
+#screen-greeter.screen {
 	top: 0;
+	position: fixed;
 	pointer-events: unset;
 	transform: translateZ();
 	transition:

js/backgrounds.js

@@ -58,8 +58,13 @@ class Backgrounds {
 	}
 
 	_updateBackgroundImages() {
-		for (let background of this._backgrounds) {
-			background.style.backgroundImage = `url('${this._backgroundCurrentPath}')`;
+		let dummyImg = document.createElement('img');
+		dummyImg.src = this._backgroundCurrentPath;
+		dummyImg.onload = () => {
+			const src = `url('${dummyImg.src}')`;
+			for (let background of this._backgrounds) {
+				background.style.backgroundImage = src;
+			}
 		}
 	}