From 64dd9cd6fb1bf04d5acc9dd1ef086cd11b5df5df Mon Sep 17 00:00:00 2001
From: Samuel Elliott <samuelthomas2774@users.noreply.github.com>
Date: Mon, 5 Feb 2018 01:13:11 +0000
Subject: [PATCH] Moved scrollbar styles to a mixin

---
 .../partials/generic/forms/dropdowns.scss     | 25 +-----------------
 .../styles/partials/generic/scrollable.scss   | 25 +-----------------
 client/src/styles/partials/index.scss         |  1 +
 client/src/styles/partials/mixins/index.scss  |  1 +
 .../src/styles/partials/mixins/scrollbar.scss | 26 +++++++++++++++++++
 5 files changed, 30 insertions(+), 48 deletions(-)
 create mode 100644 client/src/styles/partials/mixins/index.scss
 create mode 100644 client/src/styles/partials/mixins/scrollbar.scss

diff --git a/client/src/styles/partials/generic/forms/dropdowns.scss b/client/src/styles/partials/generic/forms/dropdowns.scss
index 709df8ce..e95f369e 100644
--- a/client/src/styles/partials/generic/forms/dropdowns.scss
+++ b/client/src/styles/partials/generic/forms/dropdowns.scss
@@ -78,29 +78,6 @@
             }
         }
 
-        &::-webkit-scrollbar {
-            width: 14px;
-        }
-
-        &::-webkit-scrollbar-thumb {
-            background-color: #1e2124;
-            border-color: #36393e;
-            border-color: transparent;
-        }
-
-        &::-webkit-scrollbar-thumb,
-        &::-webkit-scrollbar-track-piece {
-            background-clip: padding-box;
-            border-width: 3px;
-            border-style: solid;
-            border-radius: 7px;
-            border-color: transparent;
-        }
-
-        &::-webkit-scrollbar-track-piece {
-            background-color: #2f3136;
-            border-color: #36393e;
-            border-color: transparent;
-        }
+        @include scrollbar;
     }
 }
diff --git a/client/src/styles/partials/generic/scrollable.scss b/client/src/styles/partials/generic/scrollable.scss
index 5803d1a3..d5318514 100644
--- a/client/src/styles/partials/generic/scrollable.scss
+++ b/client/src/styles/partials/generic/scrollable.scss
@@ -11,30 +11,7 @@
         padding: 10px 10px 10px 0;
         margin: 10px 0;
 
-        &::-webkit-scrollbar {
-            width: 14px;
-        }
-
-        &::-webkit-scrollbar-thumb {
-            background-color: #1e2124;
-            border-color: #36393e;
-            border-color: transparent;
-        }
-
-        &::-webkit-scrollbar-thumb,
-        &::-webkit-scrollbar-track-piece {
-            background-clip: padding-box;
-            border-width: 3px;
-            border-style: solid;
-            border-radius: 7px;
-            border-color: transparent;
-        }
-
-        &::-webkit-scrollbar-track-piece {
-            background-color: #2f3136;
-            border-color: #36393e;
-            border-color: transparent;
-        }
+        @include scrollbar;
     }
 
     &.bd-dark {
diff --git a/client/src/styles/partials/index.scss b/client/src/styles/partials/index.scss
index b2d7157c..dc07738d 100644
--- a/client/src/styles/partials/index.scss
+++ b/client/src/styles/partials/index.scss
@@ -1,4 +1,5 @@
 @import './variables/index.scss';
+@import './mixins/index.scss';
 @import './animations.scss';
 @import './layouts.scss';
 
diff --git a/client/src/styles/partials/mixins/index.scss b/client/src/styles/partials/mixins/index.scss
new file mode 100644
index 00000000..e99a7812
--- /dev/null
+++ b/client/src/styles/partials/mixins/index.scss
@@ -0,0 +1 @@
+@import './scrollbar.scss';
diff --git a/client/src/styles/partials/mixins/scrollbar.scss b/client/src/styles/partials/mixins/scrollbar.scss
new file mode 100644
index 00000000..5ea45aa3
--- /dev/null
+++ b/client/src/styles/partials/mixins/scrollbar.scss
@@ -0,0 +1,26 @@
+@mixin scrollbar {
+    &::-webkit-scrollbar {
+        width: 14px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+        background-color: #1e2124;
+        border-color: #36393e;
+        border-color: transparent;
+    }
+
+    &::-webkit-scrollbar-thumb,
+    &::-webkit-scrollbar-track-piece {
+        background-clip: padding-box;
+        border-width: 3px;
+        border-style: solid;
+        border-radius: 7px;
+        border-color: transparent;
+    }
+
+    &::-webkit-scrollbar-track-piece {
+        background-color: #2f3136;
+        border-color: #36393e;
+        border-color: transparent;
+    }
+}