From e44c2bfb712fc06bdd0333cd92773dfca3d90d75 Mon Sep 17 00:00:00 2001
From: Suraj Shetty <surajshetty3416@gmail.com>
Date: Tue, 28 Jul 2020 17:29:52 +0530
Subject: [PATCH] refactor: Move dark theme style to separate file

---
 frappe/public/scss/dark.scss      | 36 +++++++++++++++++++++++++++++
 frappe/public/scss/variables.scss | 38 +------------------------------
 2 files changed, 37 insertions(+), 37 deletions(-)
 create mode 100644 frappe/public/scss/dark.scss

diff --git a/frappe/public/scss/dark.scss b/frappe/public/scss/dark.scss
new file mode 100644
index 0000000000..fae5d39204
--- /dev/null
+++ b/frappe/public/scss/dark.scss
@@ -0,0 +1,36 @@
+[data-theme="dark"] {
+	--gray-50: #{$gray-50};
+	--gray-100: #F7FAFC;
+	--gray-200: #EDF2F7;
+	--gray-300: #E2E8F0;
+	--gray-400: #CBD5E0;
+	--gray-500: #A0AEC0;
+	--gray-600: #718096;
+	--gray-700: #4A5568;
+	--gray-800: #2D3748;
+	--gray-900: #1A202C;
+
+	// Type Colors
+	--text-muted: var(--gray-300);
+	--text-light: var(--gray-400);
+	--text-color: var(--gray-50);
+	--heading-color: var(--gray-50);
+
+	// SVG Colors
+	--icon-fill: transparent;
+	--icon-stroke: var(--gray-500);
+
+	// Layout Colors
+	--bg-color: var(--gray-900);
+	--fg-color: var(--gray-800);
+	--card-bg: var(--gray-800);
+	--control-bg: var(--gray-700);
+	--modal-bg: var(--gray-700);
+	--toast-bg: var(--modal-bg);
+	--popover-bg: var(--bg-color);
+
+	--sidebar-select-color: var(--gray-800);
+
+	--shadow-inset: var(--fg-color);
+	--border-color: var(--gray-600);
+}
\ No newline at end of file
diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss
index 1fab78ca39..2e79422a0e 100644
--- a/frappe/public/scss/variables.scss
+++ b/frappe/public/scss/variables.scss
@@ -232,43 +232,6 @@ $dropdown-border-radius: 0.375rem !default;
 $dropdown-item-padding-y: 0.5rem !default;
 $dropdown-item-padding-x: 0.5rem !default;
 
-[data-theme="dark"] {
-	--gray-50: #{$gray-50};
-	--gray-100: #F7FAFC;
-	--gray-200: #EDF2F7;
-	--gray-300: #E2E8F0;
-	--gray-400: #CBD5E0;
-	--gray-500: #A0AEC0;
-	--gray-600: #718096;
-	--gray-700: #4A5568;
-	--gray-800: #2D3748;
-	--gray-900: #1A202C;
-
-	// Type Colors
-	--text-muted: var(--gray-300);
-	--text-light: var(--gray-400);
-	--text-color: var(--gray-50);
-	--heading-color: var(--gray-50);
-
-	// SVG Colors
-	--icon-fill: transparent;
-	--icon-stroke: var(--gray-500);
-
-	// Layout Colors
-	--bg-color: var(--gray-900);
-	--fg-color: var(--gray-800);
-	--card-bg: var(--gray-800);
-	--control-bg: var(--gray-700);
-	--modal-bg: var(--gray-700);
-	--toast-bg: var(--modal-bg);
-	--popover-bg: var(--bg-color);
-
-	--sidebar-select-color: var(--gray-800);
-
-	--shadow-inset: var(--fg-color);
-	--border-color: var(--gray-600);
-}
-
 $spacer: 14px;
 $grid-breakpoints: (
   xs: 0,
@@ -279,6 +242,7 @@ $grid-breakpoints: (
   2xl: 1440px
 ) !default;
 
+@import 'dark';
 @import 'typography';
 @import '~bootstrap/scss/functions';
 @import '~bootstrap/scss/variables';