From b13db6f3e5c65870062919959c7f14abc4669d67 Mon Sep 17 00:00:00 2001
From: Mononaut <github@monospace.live>
Date: Fri, 29 Apr 2022 17:12:17 -0600
Subject: [PATCH] Fix donation amount slider on touch devices

---
 client/src/components/BlockInfo.svelte             | 6 ++++++
 client/src/components/TxViz.svelte                 | 2 +-
 client/src/components/sponsor/SatoshiSlider.svelte | 3 ++-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/client/src/components/BlockInfo.svelte b/client/src/components/BlockInfo.svelte
index efe2de3..9625d98 100644
--- a/client/src/components/BlockInfo.svelte
+++ b/client/src/components/BlockInfo.svelte
@@ -282,6 +282,12 @@
     }
   }
 
+  @media screen and (max-height: 760px) {
+    .explore-button {
+      bottom: -1em;
+    }
+  }
+
   .block-info.landscape {
     bottom: unset;
     left: unset;
diff --git a/client/src/components/TxViz.svelte b/client/src/components/TxViz.svelte
index 5b29891..636fc45 100644
--- a/client/src/components/TxViz.svelte
+++ b/client/src/components/TxViz.svelte
@@ -575,7 +575,7 @@
   {/if}
 
   {#if $loading}
-    <div class="loading-overlay" in:fade={{ delay: 100, duration: 500 }} out:fade={{ duration: 200 }}>
+    <div class="loading-overlay" in:fade={{ delay: 500, duration: 500 }} out:fade={{ duration: 200 }}>
       <div class="loading-wrapper">
         <LoadingAnimation />
         <p class="loading-msg">loading</p>
diff --git a/client/src/components/sponsor/SatoshiSlider.svelte b/client/src/components/sponsor/SatoshiSlider.svelte
index 1e50075..e378de5 100644
--- a/client/src/components/sponsor/SatoshiSlider.svelte
+++ b/client/src/components/sponsor/SatoshiSlider.svelte
@@ -110,7 +110,7 @@ function cancelDrag (e) {
         </div>
       {/each}
     </div>
-    <span class="handle" style={handleStyle} on:pointerdown={startDrag}/>
+    <span class="handle" style={handleStyle} on:pointerdown={startDrag} draggable={false}/>
   </div>
 </div>
 
@@ -118,6 +118,7 @@ function cancelDrag (e) {
   .satoshi-slider {
     width: 100%;
     position: relative;
+    touch-action: none;
 
     .track {
       position: relative;