mirror of https://github.com/VERT-sh/VERT.git
feat: show check icon and toast when copied
This commit is contained in:
parent
10c7b035a2
commit
90ca53c2a5
|
@ -1,14 +1,22 @@
|
|||
<script lang="ts">
|
||||
import Panel from "$lib/components/visual/Panel.svelte";
|
||||
import { PiggyBankIcon, CopyIcon } from "lucide-svelte";
|
||||
import { PiggyBankIcon, CopyIcon, CheckIcon } from "lucide-svelte";
|
||||
import HotMilk from "$lib/assets/hotmilk.svg?component";
|
||||
import { DISCORD_URL } from "$lib/consts";
|
||||
import { error } from "$lib/logger";
|
||||
import { addToast } from "$lib/store/ToastProvider";
|
||||
|
||||
let copied = false;
|
||||
let timeoutId: number | undefined;
|
||||
|
||||
function copyToClipboard() {
|
||||
try {
|
||||
navigator.clipboard.writeText("hello@vert.sh");
|
||||
alert("Email copied to clipboard!");
|
||||
copied = true;
|
||||
addToast("success", "Email copied to clipboard!");
|
||||
|
||||
if (timeoutId) clearTimeout(timeoutId);
|
||||
timeoutId = setTimeout(() => (copied = false), 2000);
|
||||
} catch (err) {
|
||||
error(`Failed to copy email: ${err}`);
|
||||
}
|
||||
|
@ -34,27 +42,30 @@
|
|||
<HotMilk class="w-full h-16" />
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-muted">
|
||||
Want to support us? Contact a developer in the <a
|
||||
href={DISCORD_URL}
|
||||
target="_blank">Discord</a
|
||||
<p class="text-muted">
|
||||
Want to support us? Contact a developer in the <a
|
||||
href={DISCORD_URL}
|
||||
target="_blank">Discord</a
|
||||
>
|
||||
server, or send an email to
|
||||
<span class="inline-block mx-[2px] relative top-[2px]">
|
||||
<button
|
||||
id="email"
|
||||
class="flex items-center gap-[6px] cursor-pointer"
|
||||
onclick={copyToClipboard}
|
||||
aria-label="Copy email to clipboard"
|
||||
>
|
||||
server, or send an email to
|
||||
<span class="inline-block mx-[2px] relative top-[2px]"
|
||||
><button
|
||||
id="email"
|
||||
class="flex items-center gap-2 cursor-pointer"
|
||||
onclick={copyToClipboard}
|
||||
aria-label="Copy email to clipboard"
|
||||
>
|
||||
<CopyIcon size="14"></CopyIcon> hello@vert.sh
|
||||
</button></span
|
||||
>!
|
||||
</p>
|
||||
</div>
|
||||
</div></Panel
|
||||
>
|
||||
{#if copied}
|
||||
<CheckIcon size="14"></CheckIcon>
|
||||
{:else}
|
||||
<CopyIcon size="14"></CopyIcon>
|
||||
{/if}
|
||||
hello@vert.sh
|
||||
</button>
|
||||
</span>!
|
||||
</p>
|
||||
</div>
|
||||
</Panel>
|
||||
|
||||
<style>
|
||||
#email {
|
||||
|
|
Loading…
Reference in New Issue