RomanNum3ral
/
vert
mirror of https://github.com/VERT-sh/VERT.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: show check icon and toast when copied

This commit is contained in:
JovannMC 2025-02-20 20:45:16 +03:00
parent 10c7b035a2
commit 90ca53c2a5
No known key found for this signature in database
1 changed files with 33 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/lib/sections/about/Vertd.svelte
View File

@ -1,14 +1,22 @@
<script lang="ts"> <script lang="ts">
import Panel from "$lib/components/visual/Panel.svelte"; 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 HotMilk from "$lib/assets/hotmilk.svg?component";
import { DISCORD_URL } from "$lib/consts"; import { DISCORD_URL } from "$lib/consts";
import { error } from "$lib/logger"; import { error } from "$lib/logger";
import { addToast } from "$lib/store/ToastProvider";
let copied = false;
let timeoutId: number | undefined;
function copyToClipboard() { function copyToClipboard() {
try { try {
navigator.clipboard.writeText("hello@vert.sh"); 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) { } catch (err) {
error(`Failed to copy email: ${err}`); error(`Failed to copy email: ${err}`);
} }
@ -34,27 +42,30 @@
<HotMilk class="w-full h-16" /> <HotMilk class="w-full h-16" />
</a> </a>
</div> </div>
<div>
<p class="text-muted"> <p class="text-muted">
Want to support us? Contact a developer in the <a Want to support us? Contact a developer in the <a
href={DISCORD_URL} href={DISCORD_URL}
target="_blank">Discord</a target="_blank">Discord</a
> >
server, or send an email to server, or send an email to
<span class="inline-block mx-[2px] relative top-[2px]" <span class="inline-block mx-[2px] relative top-[2px]">
><button <button
id="email" id="email"
class="flex items-center gap-2 cursor-pointer" class="flex items-center gap-[6px] cursor-pointer"
onclick={copyToClipboard} onclick={copyToClipboard}
aria-label="Copy email to clipboard" aria-label="Copy email to clipboard"
> >
<CopyIcon size="14"></CopyIcon> hello@vert.sh {#if copied}
</button></span <CheckIcon size="14"></CheckIcon>
>! {:else}
<CopyIcon size="14"></CopyIcon>
{/if}
hello@vert.sh
</button>
</span>!
</p> </p>
</div> </div>
</div></Panel </Panel>
>
<style> <style>
#email { #email {