From 24de2dbcb3c851bf123f9df9a54e94dfc2f905e9 Mon Sep 17 00:00:00 2001
From: Adhityaa Chandrasekar <adtac@adtac.in>
Date: Tue, 12 Feb 2019 23:04:42 -0500
Subject: [PATCH] checkbox.scss: move checkbox element to separate file

---
 frontend/sass/checkbox.scss       | 77 +++++++++++++++++++++++++++++++
 frontend/sass/dashboard-main.scss | 52 +--------------------
 2 files changed, 78 insertions(+), 51 deletions(-)
 create mode 100644 frontend/sass/checkbox.scss

diff --git a/frontend/sass/checkbox.scss b/frontend/sass/checkbox.scss
new file mode 100644
index 0000000..2061045
--- /dev/null
+++ b/frontend/sass/checkbox.scss
@@ -0,0 +1,77 @@
+@import "colors-main.scss";
+
+.round-check {
+  input[type="checkbox"] {
+    display: none;
+  }
+
+  input[type="checkbox"] + label {
+    display: block;
+    position: relative;
+    padding-left: 35px;
+    margin-bottom: 5px;
+    cursor: pointer;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+  }
+
+  input[type="checkbox"] + label:last-child { margin-bottom: 0; }
+
+  input[type="checkbox"] + label:before {
+    content: '';
+    display: block;
+    width: 13px;
+    height: 13px;
+    margin-top: 2px;
+    background: $gray-0;
+    border: 1px solid $gray-3;
+    border-radius: 3px;
+    position: absolute;
+    left: 0;
+    top: 0;
+    transition: all .15s;
+  }
+
+  input[type="checkbox"]:disabled + label:before {
+    background: $gray-0;
+    border: 1px solid $gray-4;
+    opacity: 0.4;
+  }
+
+  input[type="checkbox"]:checked + label:before {
+    background: $blue-6;
+    border: 1px solid $blue-6;
+  }
+
+  input[type="checkbox"] + label:after {
+    position: absolute;
+    left: -7px;
+    top: 4px;
+    content: '';
+    display: inline-block;
+    width: 3px;
+    height: 7px;
+    transform: rotate(45deg);
+    margin-left: 12px;
+    margin-right: 12px;
+    border: solid transparent;
+    border-width: 0 2px 2px 0;
+  }
+
+  input[type="checkbox"]:disabled + label:after {
+    border: solid transparent;
+    border-width: 0 2px 2px 0;
+  }
+
+  input[type="checkbox"]:checked + label:after {
+    border: solid $gray-0;
+    border-width: 0 2px 2px 0;
+  }
+
+  .pitch {
+    font-size: 14px;
+    color: #a5a5a5;
+    line-height: 20px !important;
+  }
+}
diff --git a/frontend/sass/dashboard-main.scss b/frontend/sass/dashboard-main.scss
index 7278719..c1e1901 100644
--- a/frontend/sass/dashboard-main.scss
+++ b/frontend/sass/dashboard-main.scss
@@ -1,5 +1,6 @@
 @import "colors-main.scss";
 @import "common-main.scss";
+@import "checkbox.scss";
 
 .subscription-nag {
   position: absolute;
@@ -156,57 +157,6 @@ body {
   }
 }
 
-.round-check {
-  input[type="checkbox"] {
-    display: none;
-  }
-
-  input[type="checkbox"] + label {
-    display: block;
-    position: relative;
-    padding-left: 35px;
-    margin-bottom: 5px;
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-  }
-
-  input[type="checkbox"] + label:last-child { margin-bottom: 0; }
-
-  input[type="checkbox"] + label:before {
-    content: '';
-    display: block;
-    width: 13px;
-    height: 13px;
-    margin-top: 2px;
-    background: $gray-0;
-    border: 1px solid $gray-3;
-    border-radius: 3px;
-    position: absolute;
-    left: 0;
-    top: 0;
-    transition: all .15s;
-  }
-
-  input[type="checkbox"]:disabled + label:before {
-    background: $gray-0;
-    border: 1px solid $gray-4;
-    opacity: 0.4;
-  }
-
-  input[type="checkbox"]:checked + label:before {
-    background: $blue-6;
-    border: 1px solid $blue-6;
-  }
-
-  .pitch {
-    font-size: 14px;
-    color: #a5a5a5;
-    line-height: 20px !important;
-  }
-}
-
 .dashboard-container {
   position: relative;
   top: 72px;