Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Enable grayscale loading indicator
Sebastian Martinez committed 2 years ago
commit 7d63f9ec55130584060a94d0504dbf97c7599908
parent 2d3fbe79e939d63162a24fb3f74dece01c895345
1 file changed +9 -9
modified src/components/Loading.svelte
@@ -1,6 +1,7 @@
<script lang="ts">

  import debounce from "lodash/debounce";
+ 
  export let grayscale = false;

  export let small = false;

  export let center = false;

  export let fadeIn = false;
@@ -50,6 +51,10 @@
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;

  }
+ 
  .spinner.grayscale > div {
+ 
    background-color: var(--color-fill-ghost);
+ 
  }
+ 


  .spinner.condensed > div {

    -webkit-animation: sk-bouncedelay-condensed 0.7s infinite linear both;

    animation: sk-bouncedelay-condensed 0.7s infinite linear both;
@@ -151,19 +156,14 @@
      class="spinner"

      class:fade-in={fadeIn}

      class:small
+ 
      class:grayscale

      class:center

      class:margins

      class:condensed>
- 
      <div
- 
        class="bounce1"
- 
        style="background-color: var(--color-fill-secondary)" />
+ 
      <div class="bounce1" style="" />

      {#if !condensed}
- 
        <div
- 
          class="bounce2"
- 
          style="background-color: var(--color-fill-secondary)" />
- 
        <div
- 
          class="bounce3"
- 
          style="background-color: var(--color-fill-secondary)" />
+ 
        <div class="bounce2" />
+ 
        <div class="bounce3" />

      {/if}

    </div>

  </div>