From df881791d37809058b42f0cfc0b25a2864eecb27 Mon Sep 17 00:00:00 2001
From: Steven Evans <kopelli@gmail.com>
Date: Mon, 16 Jul 2018 11:28:09 -0400
Subject: [PATCH] [refactor] Added 'box-shadow' mixin

---
 css/_mixins.scss             |  6 ++++++
 css/interactivetutorial.scss |  4 +---
 css/menupages.scss           | 28 +++++++---------------------
 css/popupboxes.scss          | 10 ++++------
 css/styles.scss              | 12 +++---------
 css/workinprogress.scss      |  5 ++---
 6 files changed, 23 insertions(+), 42 deletions(-)

diff --git a/css/_mixins.scss b/css/_mixins.scss
index 21ca5fce4..43eb5762a 100644
--- a/css/_mixins.scss
+++ b/css/_mixins.scss
@@ -3,3 +3,9 @@
     -moz-border-radius: $property;
     border-radius: $property;
 }
+
+@mixin boxShadow($value) {
+    -webkit-box-shadow: $value;
+    -moz-box-shadow: $value;
+    box-shadow: $value;
+}
diff --git a/css/interactivetutorial.scss b/css/interactivetutorial.scss
index 0e4bd8456..5bf8fc363 100644
--- a/css/interactivetutorial.scss
+++ b/css/interactivetutorial.scss
@@ -34,13 +34,11 @@
 #interactive-tutorial-next,
 #interactive-tutorial-back {
     @include borderRadius(12px);
+    @include boxShadow(1px 1px 3px #000);
 
     color: #aaa;
     font-size: 20px;
     font-weight: bold;
-    -moz-box-shadow: 1px 1px 3px #000;
-    -webkit-box-shadow: 1px 1px 3px #000;
-    box-shadow: 1px 1px 3px #000;
     background-color: #000;
 }
 
diff --git a/css/menupages.scss b/css/menupages.scss
index fd9aea545..5afd990dd 100644
--- a/css/menupages.scss
+++ b/css/menupages.scss
@@ -90,6 +90,9 @@
 }
 
 #script-editor-filename {
+    $boxShadowArgs: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1);
+    @include boxShadow($boxShadowArgs);
+
     background-color: #555;
     display: inline-block;
     float: center;
@@ -100,15 +103,6 @@
     padding: 2px;
 
     border: 2px solid var(--my-highlight-color);
-    -webkit-box-shadow:
-        inset 0 0 8px rgba(0, 0, 0, 0.1),
-        0 0 16px rgba(0, 0, 0, 0.1);
-    -moz-box-shadow:
-        inset 0 0 8px rgba(0, 0, 0, 0.1),
-        0 0 16px rgba(0, 0, 0, 0.1);
-    box-shadow:
-        inset 0 0 8px rgba(0, 0, 0, 0.1),
-        0 0 16px rgba(0, 0, 0, 0.1);
 }
 
 #script-editor-status {
@@ -262,13 +256,11 @@
 
 .active-scripts-button {
     @include borderRadius(12px);
+    @include boxShadow(1px 1px 3px #000);
 
     color: #aaa;
     font-size: 16px;
     font-weight: bold;
-    -moz-box-shadow: 1px 1px 3px #000;
-    -webkit-box-shadow: 1px 1px 3px #000;
-    box-shadow: 1px 1px 3px #000;
     margin: 4px;
     padding: 4px;
     background-color: #000;
@@ -323,19 +315,13 @@
 }
 
 .hacknet-node {
+    $boxShadowArgs: inset 0 0 8px rgba(0, 0, 0, 0.1), 0 0 16px rgba(0, 0, 0, 0.1);
+    @include boxShadow($boxShadowArgs);
+
     margin: 6px;
     padding: 6px;
     width: 34vw;
     border: 2px solid var(--my-highlight-color);
-    -webkit-box-shadow:
-        inset 0 0 8px  rgba(0, 0, 0, 0.1),
-        0 0 16px rgba(0, 0, 0, 0.1);
-    -moz-box-shadow:
-        inset 0 0 8px  rgba(0, 0, 0, 0.1),
-        0 0 16px rgba(0, 0, 0, 0.1);
-    box-shadow:
-        inset 0 0 8px  rgba(0, 0, 0, 0.1),
-        0 0 16px rgba(0, 0, 0, 0.1);
 }
 
 .hacknet-node-container {
diff --git a/css/popupboxes.scss b/css/popupboxes.scss
index 86e293dc2..1ce9acf69 100644
--- a/css/popupboxes.scss
+++ b/css/popupboxes.scss
@@ -76,13 +76,12 @@
 
 .dialog-box-close-button {
     @include borderRadius(12px);
+    @include boxShadow(1px 1px 3px #000);
+
     float: right;
     color: #aaa;
     font-size: 20px;
     font-weight: bold;
-    -moz-box-shadow: 1px 1px 3px #000;
-    -webkit-box-shadow: 1px 1px 3px #000;
-    box-shadow: 1px 1px 3px #000;
 }
 
 #log-box-close {
@@ -155,15 +154,14 @@
 
 #game-options-close-button {
     @include borderRadius(12px);
+    @include boxShadow(1px 1px 3px #000);
+
     color: #aaa;
     float: right;
     margin: 4px;
     padding: 4px;
     font-size: 20px;
     font-weight: bold;
-    -moz-box-shadow: 1px 1px 3px #000;
-    -webkit-box-shadow: 1px 1px 3px #000;
-    box-shadow: 1px 1px 3px #000;
 }
 
 #game-options-close-button:hover,
diff --git a/css/styles.scss b/css/styles.scss
index aed204eae..3977bd179 100644
--- a/css/styles.scss
+++ b/css/styles.scss
@@ -151,9 +151,7 @@ a:link, a:visited {
 }
 
 .a-link-button:active {
-    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
-    -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
-    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
+    @include boxShadow(inset 0 1px 4px rgba(0, 0, 0, 0.6));
 }
 
 /* Make anchor tags ("a" elements) inactive (not clickable) */
@@ -309,9 +307,7 @@ a:link, a:visited {
 }
 
 .help-tip:active {
-    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
-    -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
-    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
+    @include boxShadow(inset 0 1px 4px rgba(0, 0, 0, 0.6));
 }
 
 /* Flashing button (Red) */
@@ -448,13 +444,11 @@ a:link, a:visited {
 #character-overview-save-button,
 #character-overview-options-button {
     @include borderRadius(12px);
+    @include boxShadow(1px 1px 3px #000);
 
     color: #aaa;
     font-size: 14px;
     font-weight: bold;
-    -moz-box-shadow: 1px 1px 3px #000;
-    -webkit-box-shadow: 1px 1px 3px #000;
-    box-shadow: 1px 1px 3px #000;
     height: 22px;
     background-color: #000;
 }
diff --git a/css/workinprogress.scss b/css/workinprogress.scss
index 0917ff915..2ba988ad4 100644
--- a/css/workinprogress.scss
+++ b/css/workinprogress.scss
@@ -18,6 +18,8 @@
 
 #work-in-progress-cancel-button {
     @include borderRadius(12px);
+    @include boxShadow(1px 1px 3px #000);
+
     color: #aaa;
     float: left;
     font-size: 20px;
@@ -25,9 +27,6 @@
     margin: 10px;
     padding: 5px;
     border: 3px solid #fff;
-    -moz-box-shadow: 1px 1px 3px #000;
-    -webkit-box-shadow: 1px 1px 3px #000;
-    box-shadow: 1px 1px 3px #000;
 }
 
 #work-in-progress-cancel-button:hover,