fix: make refresh button disabled

istudyatuni · Apr 21, 2022 · c966911 · c966911
1 parent 7c171b1
commit c966911
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/src/components/Settings.svelte b/src/components/Settings.svelte
@@ -18,9 +18,9 @@
 	{#if show}
 		<div class="flex justify-between mb-3">
 			<Button on:click={toggleShow} class="mr-2">Hide</Button>
-			<div class:hidden={$refresh === false}>
-				<Button on:click={() => window.location.reload()}>Refresh</Button>
-			</div>
+			<Button on:click={() => window.location.reload()} disabled={!$refresh}>
+				Refresh
+			</Button>
 		</div>
 
 		<div class="flex mb-2">

diff --git a/src/components/atoms/Button.svelte b/src/components/atoms/Button.svelte
@@ -1,10 +1,12 @@
 <script>
-	export let danger = false
+	export let danger = false,
+		disabled = false
 </script>
 
 <button
-	class="rounded px-3 py-2 bg-gray-300 {$$props.class}"
+	class="rounded px-3 py-2 bg-gray-300 disabled:opacity-50 {$$props.class}"
 	on:click
-	class:text-red-500={danger}>
+	class:text-red-500={danger}
+	{disabled}>
 	<slot />
 </button>