Merge pull request #913 from Safelite/loader-color-fixes

Fix some issues caused by previous loader color changes

src/digital-components/button-question/button-question.vue

@@ -123,14 +123,6 @@ export default {
             default: 'text-center'
         },
         selectingInitiatesLoad: Boolean,
-        loaderColor: {
-            type: String,
-            default: 'blue'
-        },
-        loaderPosition: {
-            type: String,
-            default: 'right'
-        },
         isRequired: Boolean,
         isOverflowScrollable: Boolean,
         isWide: Boolean,

src/digital-components/modal/modal.vue

@@ -40,7 +40,6 @@
                         ref="modalButtonMain"
                         isPrimary
                         class="w-100"
-                        loaderColor="white"
                         :buttonText="footerButtonText"
                         :class="[
                             (isButtonDisabled || isFooterButtonDisabled) &&

src/layouts/tpa-submit/tpa-submit.vue

@@ -41,7 +41,6 @@
                         ref="buttonMainOne"
                         isPrimary
                         :buttonText="forwardButtonText"
-                        loaderColor="white"
                         class="w-100 mb-5"
                         @clickEvent="forwardButtonAction" />
                     <hr class="mb-0" />

src/ux-components/loader/loader.vue

@@ -21,6 +21,10 @@ export default {
             type: Boolean,
             default: false
         },
+        /* Color options: red, green, blue, white, black */
+        loaderColor: {
+            type: String
+        },
         /* Position options: center, right, left (OPTIONAL, do NOT use on btn-* classes) */
         loaderPosition: {
             type: String
@@ -110,5 +114,20 @@ export default {
   &:after {
       background-color: var(--iss-loader-color);
   }
+  &.red:after {
+      background-color: $red;
+  }
+  &.green:after {
+      background-color: $green;
+  }
+  &.blue:after {
+      background-color: $blue;
+  }
+  &.white:after {
+      background-color: $white;
+  }
+  &.black:after {
+      background-color: $black;
+  }
 }
 </style>