From dfda5c683da8fae6e90c22d002019489f64bd2c5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net>
Date: Mon, 26 Feb 2018 14:04:00 +0100
Subject: [PATCH] Use SCSS for previewing images as well
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
 apps/theming/css/theming.scss | 45 ++++++++++++++++++++++++++++++-----
 1 file changed, 39 insertions(+), 6 deletions(-)

diff --git a/apps/theming/css/theming.scss b/apps/theming/css/theming.scss
index 3bb26a14814..88d3e7cf0fc 100644
--- a/apps/theming/css/theming.scss
+++ b/apps/theming/css/theming.scss
@@ -92,20 +92,53 @@
 
 /* override styles for login screen in guest.css */
 @if variable_exists('theming-logo-mime') and $theming-logo-mime != '' {
-	#header .logo {
+    #theming-preview-logo,
+    #header .logo {
 		background-image: url(#{$image-logo});
 		background-size: contain;
 	}
 	#body-login #header .logo {
 		margin-bottom: 22px;
 	}
+} @else {
+  #theming-preview-logo {
+    background-image: url(#{$image-logo});
+  }
 }
 
-#body-login,
-#firstrunwizard .firstrunwizard-header,
-#theming-preview {
-	background-image: url(#{$image-login-background});
-	background-color: $color-primary;
+@if variable_exists('theming-background-mime') and $theming-background-mime != ''  {
+	#body-login,
+	#firstrunwizard .firstrunwizard-header,
+	#theming-preview {
+		background-image: url(#{$image-login-background});
+		background-color: $color-primary;
+	}
+} @else {
+	  #theming-preview {
+		  background-image: url(#{$image-login-background});
+		  background-color: $color-primary;
+	  }
+}
+
+@if variable_exists('theming-logoheader-mime') and $theming-logoheader-mime != '' {
+	#theming .advanced-option-logoheader .image-preview,
+	body:not(#body-login) #header .logo {
+		background-image: url(#{$image-logoheader});
+	}
+} @else {
+	#theming .advanced-option-favicon .image-preview {
+		background-image: none;
+	}
+}
+
+@if variable_exists('theming-favicon-mime') and $theming-favicon-mime != '' {
+	#theming .advanced-option-favicon .image-preview {
+		background-image: url(#{$image-favicon});
+	}
+} @else {
+	#theming .advanced-option-favicon .image-preview {
+		background-image: none;
+	}
 }
 
 input.primary,