From 7e2a6b11bf0897b4177ce539ee2db817863ac251 Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Wed, 13 Oct 2021 22:04:20 -0400
Subject: [PATCH] Reduce flickering by removing the spinning card icon and
 increasing background opacity

---
 client/src/components/Tool/ToolCard.vue | 6 ++----
 client/src/style/scss/ui.scss           | 3 +--
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/client/src/components/Tool/ToolCard.vue b/client/src/components/Tool/ToolCard.vue
index c39cbb66a55..fe675d9eab7 100644
--- a/client/src/components/Tool/ToolCard.vue
+++ b/client/src/components/Tool/ToolCard.vue
@@ -80,8 +80,7 @@
                     </b-button>
                 </div>
                 <div class="portlet-title">
-                    <font-awesome-icon v-if="disabled" icon="spinner" class="portlet-title-icon fa-fw mr-1" spin />
-                    <font-awesome-icon v-else icon="wrench" class="portlet-title-icon fa-fw mr-1" />
+                    <font-awesome-icon icon="wrench" class="portlet-title-icon fa-fw mr-1" />
                     <span class="portlet-title-text">
                         <b itemprop="name">{{ title }}</b> <span itemprop="description">{{ description }}</span> (Galaxy
                         Version {{ version }})
@@ -119,9 +118,8 @@ import Webhooks from "mvc/webhooks";
 import { addFavorite, removeFavorite } from "components/Tool/services";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { library } from "@fortawesome/fontawesome-svg-core";
-import { faSpinner, faWrench } from "@fortawesome/free-solid-svg-icons";
+import { faWrench } from "@fortawesome/free-solid-svg-icons";
 
-library.add(faSpinner);
 library.add(faWrench);
 
 export default {
diff --git a/client/src/style/scss/ui.scss b/client/src/style/scss/ui.scss
index 6118d7ae713..7d30380ccab 100644
--- a/client/src/style/scss/ui.scss
+++ b/client/src/style/scss/ui.scss
@@ -228,11 +228,10 @@ $ui-margin-horizontal-large: $margin-v * 2;
         display: none;
         z-index: 10;
         position: absolute;
+        opacity: 0;
         top: 0px;
         width: 100%;
         height: 100%;
-        opacity: 0.15;
-        background: $white;
         cursor: wait;
     }
 }