From 99fffde0a2a099f81e5afea58042f4ccac1f3f8d Mon Sep 17 00:00:00 2001
From: Violet Rose <VioletRose@users.noreply.github.com>
Date: Sun, 6 Sep 2020 18:19:08 -0700
Subject: [PATCH] Tidied up stylesheet structure.

---
 .../ft-toggle-switch/ft-toggle-switch.sass       | 16 ++++++----------
 .../ft-toggle-switch/ft-toggle-switch.vue        |  7 ++++---
 2 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
index 8a64f5c7..333f0bb4 100644
--- a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
+++ b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
@@ -1,12 +1,16 @@
 /* Thanks to Guus Lieben for the Material Design Switch */
 
 .switch-ctn
+  margin: 20px 16px
   position: relative
 
+  &.compact
+    margin: 0
+
 .switch-input
   appearance: none
   height: 20px
-  left: 13px
+  left: -3px
   position: absolute
   top: calc(50% - 3px)
   -ms-transform: translate(0, (-50%))
@@ -14,9 +18,6 @@
   transform: translate(0, -50%)
   width: 34px
 
-  &.compact
-    left: -3px
-
 .switch-label
   position: relative
   display: inline-block
@@ -24,12 +25,7 @@
   cursor: pointer
   font-weight: 500
   text-align: left
-  margin: 16px
-  padding: 16px 0 16px 44px
-
-  &.compact
-    margin: 0px
-    padding: 12px 0 12px 44px
+  padding: 12px 0 12px 44px
 
   &:before, &:after
     content: ""
diff --git a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue
index 58456cec..56bdb321 100644
--- a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue
+++ b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue
@@ -1,19 +1,20 @@
 <template>
-  <div class="switch-ctn">
+  <div
+    class="switch-ctn"
+    :class="{compact}"
+  >
     <input
       :id="id"
       v-model="currentValue"
       type="checkbox"
       name="set-name"
       class="switch-input"
-      :class="{compact}"
       :checked="currentValue"
       @change="$emit('change', currentValue)"
     >
     <label
       :for="id"
       class="switch-label"
-      :class="{compact}"
     >
       {{ label }}
     </label>