Add Button hover style

arran-nz · Oct 1, 2020 · 8e66aa1 · 8e66aa1 · vercel · Oct 1, 2020
1 parent 230e940
commit 8e66aa1
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/src/ContactCard.svelte b/src/ContactCard.svelte
@@ -129,6 +129,10 @@
 		cursor: pointer;
 	}
 
+	button:hover{
+		background-color: #ff3e00;
+	}
+
 	button svg {
 		min-width: 15px;
 		max-width: 25px;
@@ -456,7 +460,7 @@
 	<div class="button-container">
 
 		{#if navigator.share}
-		<button on:click={ShareQCard} alt="Share this QCard's URL" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
+		<button on:click={ShareQCard} alt="Share this QCard's URL" class="share">
 			<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
 				<g data-name="Layer 2">
 					<g data-name="share">
@@ -468,7 +472,7 @@
 			</svg>
 		</button>
 		{:else}
-			<button on:click={CopySelfLink} alt="Copy the URL of this QCard">
+			<button on:click={CopySelfLink} alt="Copy the URL of this QCard" class="copy">
 				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g data-name="Layer 2"><g data-name="copy"><rect width="24" height="24" opacity="0"/><path d="M18 9h-3V5.67A2.68 2.68 0 0 0 12.33 3H5.67A2.68 2.68 0 0 0 3 5.67v6.66A2.68 2.68 0 0 0 5.67 15H9v3a3 3 0 0 0 3 3h6a3 3 0 0 0 3-3v-6a3 3 0 0 0-3-3zm-9 3v1H5.67a.67.67 0 0 1-.67-.67V5.67A.67.67 0 0 1 5.67 5h6.66a.67.67 0 0 1 .67.67V9h-1a3 3 0 0 0-3 3z"/></g></g></svg>
 			</button>
 		{/if}