From 240b4eb8eabfb32cab67cd3c196078876b383633 Mon Sep 17 00:00:00 2001
From: Suraj Shetty <surajshetty3416@gmail.com>
Date: Wed, 9 Dec 2020 11:46:16 +0530
Subject: [PATCH] refactor: Move flex styles to .scss file

---
 frappe/public/less/flex.less        | 82 ---------------------------
 frappe/public/scss/common/flex.scss | 86 +++++++++++++++++++++++++++++
 frappe/public/scss/desk/index.scss  |  1 +
 3 files changed, 87 insertions(+), 82 deletions(-)
 delete mode 100644 frappe/public/less/flex.less
 create mode 100644 frappe/public/scss/common/flex.scss

diff --git a/frappe/public/less/flex.less b/frappe/public/less/flex.less
deleted file mode 100644
index 12797241ce..0000000000
--- a/frappe/public/less/flex.less
+++ /dev/null
@@ -1,82 +0,0 @@
-.flex {
-    display: flex;
-}
-
-.flex-column {
-    .flex;
-    flex-direction: column;
-}
-
-.justify-center {
-    justify-content: center;
-}
-
-.align-center {
-    align-items: center;
-}
-
-.align-flex-end {
-    align-items: flex-end;
-}
-
-.justify-between {
-    justify-content: space-between
-}
-
-.justify-flex-end {
-    justify-content: flex-end;
-}
-
-.justify-flex-start {
-    justify-content: flex-start;
-}
-
-.flex-wrap {
-	flex-wrap: wrap;
-}
-
-.flush-top {
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-end;
-}
-
-.level {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
-
-.level-left, .level-right {
-    display: flex;
-    flex-basis: auto;
-    flex-grow: 0;
-    flex-shrink: 0;
-    align-items: center;
-
-    &.is-flexible {
-        flex-grow: initial;
-        flex-shrink: initial;
-    }
-}
-
-.level-left {
-    justify-content: flex-start;
-}
-
-.level-right {
-    justify-content: flex-end;
-}
-
-.level-item {
-    align-items: center;
-    display: flex;
-    flex-basis: auto;
-    flex-grow: 0;
-    flex-shrink: 0;
-    justify-content: center;
-}
-
-.fill-width {
-    flex: 1
-}
diff --git a/frappe/public/scss/common/flex.scss b/frappe/public/scss/common/flex.scss
new file mode 100644
index 0000000000..11b0635fc0
--- /dev/null
+++ b/frappe/public/scss/common/flex.scss
@@ -0,0 +1,86 @@
+.flex {
+	display: flex;
+}
+
+.flex-column {
+	@extend .flex;
+	flex-direction: column;
+}
+
+.justify-center {
+	justify-content: center;
+}
+
+.align-center {
+	align-items: center;
+}
+
+.align-flex-start {
+	align-items: flex-start;
+}
+
+.align-flex-end {
+	align-items: flex-end;
+}
+
+.justify-between {
+	justify-content: space-between
+}
+
+.justify-flex-end {
+	justify-content: flex-end;
+}
+
+.justify-flex-start {
+	justify-content: flex-start;
+}
+
+.flex-wrap {
+	flex-wrap: wrap;
+}
+
+.flush-top {
+	display: flex;
+	justify-content: space-between;
+	align-items: flex-end;
+}
+
+.level {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+
+.level-left, .level-right {
+	display: flex;
+	flex-basis: auto;
+	flex-grow: 0;
+	flex-shrink: 0;
+	align-items: center;
+
+	&.is-flexible {
+		flex-grow: initial;
+		flex-shrink: initial;
+	}
+}
+
+.level-left {
+	justify-content: flex-start;
+}
+
+.level-right {
+	justify-content: flex-end;
+}
+
+.level-item {
+	align-items: center;
+	display: flex;
+	flex-basis: auto;
+	flex-grow: 0;
+	flex-shrink: 0;
+	justify-content: center;
+}
+
+.fill-width {
+	flex: 1
+}
diff --git a/frappe/public/scss/desk/index.scss b/frappe/public/scss/desk/index.scss
index 66c04c9f4b..0c0555ffca 100644
--- a/frappe/public/scss/desk/index.scss
+++ b/frappe/public/scss/desk/index.scss
@@ -41,3 +41,4 @@
 @import "theme_switcher";
 @import "quill";
 @import "plyr";
+@import "../common/flex"