Merge pull request #10806 from eth3lbert/indicator-color

Adjust loading spinner color

Author: Turbo87

app/components/follow-button.hbs

@@ -11,7 +11,7 @@
   {{on "click" (perform this.toggleFollowTask)}}
 >
   {{#if (or this.followStateTask.isRunning this.toggleFollowTask.isRunning)}}
-    <LoadingSpinner data-test-spinner />
+    <LoadingSpinner @theme="light" data-test-spinner />
   {{else}}
     {{#if this.following}}
       Unfollow

app/components/loading-spinner.hbs

@@ -1,5 +1,5 @@
 <div
-  local-class="spinner"
+  local-class="spinner {{if (eq @theme 'light') 'light'}}"
   ...attributes
 >
   <span local-class="message">Loading…</span>

app/components/loading-spinner.module.css

@@ -1,12 +1,16 @@
 .spinner {
-    --spinner-color: black;
-    --spinner-bg-color: rgba(0, 0, 0, .2);
+    --spinner-color: currentcolor;
+    --spinner-bg-color: var(--gray-border);
     --spinner-size: 16px;
 
     display: inline-block;
     height: var(--spinner-size);
     width: var(--spinner-size);
 
+    &.light {
+        --spinner-bg-color: rgba(0, 0, 0, .2);
+    }
+
     &:after {
         content: " ";
         display: block;

app/templates/index.hbs

@@ -51,7 +51,7 @@
   >
     Try Again
     {{#if this.dataTask.isRunning}}
-      <LoadingSpinner local-class="spinner" data-test-spinner />
+      <LoadingSpinner @theme="light" local-class="spinner" data-test-spinner />
     {{/if}}
   </button>
 {{else}}

app/templates/settings/tokens/new.hbs

@@ -182,7 +182,7 @@
       Generate Token
 
       {{#if this.saveTokenTask.isRunning}}
-        <LoadingSpinner local-class="spinner" data-test-spinner />
+        <LoadingSpinner @theme="light" local-class="spinner" data-test-spinner />
       {{/if}}
     </button>