From dcd445b4fd3f69bc2f8325a8784905b6bdb4ea27 Mon Sep 17 00:00:00 2001
From: prssanna <prssud@gmail.com>
Date: Fri, 22 Jan 2021 15:33:24 +0530
Subject: [PATCH] fix: reorganize styles

---
 frappe/public/scss/common/global.scss         | 22 +++++++++++++++
 frappe/public/scss/desk/controls.scss         | 22 ---------------
 frappe/public/scss/website/website_image.scss | 27 ++++++++++++++-----
 3 files changed, 43 insertions(+), 28 deletions(-)

diff --git a/frappe/public/scss/common/global.scss b/frappe/public/scss/common/global.scss
index 23e2fba48b..cdd35704c9 100644
--- a/frappe/public/scss/common/global.scss
+++ b/frappe/public/scss/common/global.scss
@@ -82,3 +82,25 @@ html.firefox, html.safari {
 .frappe-card {
 	@include card();
 }
+
+.frappe-control[data-fieldtype="Select"] .control-input {
+	position: relative;
+
+	select {
+		/* for Firefox */
+		-moz-appearance: none;
+		/* for Chrome */
+		-webkit-appearance: none;
+	}
+
+	.icon {
+		position: absolute;
+		top: 8px;
+		height: 15px;
+		right: 12px;
+		pointer-events: none;
+		use {
+			stroke: var(--text-muted);
+		}
+	}
+}
\ No newline at end of file
diff --git a/frappe/public/scss/desk/controls.scss b/frappe/public/scss/desk/controls.scss
index 54ad71dce1..8069374553 100644
--- a/frappe/public/scss/desk/controls.scss
+++ b/frappe/public/scss/desk/controls.scss
@@ -124,28 +124,6 @@
 	}
 }
 
-.frappe-control[data-fieldtype="Select"] .control-input {
-	position: relative;
-
-	select {
-		/* for Firefox */
-		-moz-appearance: none;
-		/* for Chrome */
-		-webkit-appearance: none;
-	}
-
-	.icon {
-		position: absolute;
-		top: 8px;
-		height: 15px;
-		right: 12px;
-		pointer-events: none;
-		use {
-			stroke: var(--text-muted);
-		}
-	}
-}
-
 .ace_editor {
 	background-color: var(--control-bg);
 	color: var(--text-color);
diff --git a/frappe/public/scss/website/website_image.scss b/frappe/public/scss/website/website_image.scss
index 8e97ccf8fb..a08f3a4ba7 100644
--- a/frappe/public/scss/website/website_image.scss
+++ b/frappe/public/scss/website/website_image.scss
@@ -5,19 +5,34 @@ img {
 }
 
 // fallback for broken images
+// img:after {
+// 	content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='lightgrey' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-image'><rect x='3' y='3' width='18' height='18' rx='2' ry='2'/><circle cx='8.5' cy='8.5' r='1.5'/><polyline points='21 15 16 10 5 21'/></svg>");
+// 	display: flex;
+// 	justify-content: center;
+// 	align-items: center;
+// 	position: absolute;
+// 	z-index: 1;
+// 	top: 0;
+// 	left: 0;
+// 	width: 100%;
+// 	height: 100%;
+// 	background-color: $light;
+// 	padding: 50% 0;
+// }
+
 img:after {
 	content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='lightgrey' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-image'><rect x='3' y='3' width='18' height='18' rx='2' ry='2'/><circle cx='8.5' cy='8.5' r='1.5'/><polyline points='21 15 16 10 5 21'/></svg>");
-	display: flex;
-	justify-content: center;
-	align-items: center;
+}
+
+img[alt]:after {
+	height: 175px;
+	@include flex();
 	position: absolute;
 	z-index: 1;
 	top: 0;
 	left: 0;
 	width: 100%;
-	height: 100%;
-	background-color: $light;
-	padding: 50% 0;
+	background-color: var(--bg-color);
 }
 
 .website-image-placeholder {