new qr

3 files changed, 8 insertions, 5 deletions

diff --git a/src/routes/(app)/[username]/accepted/[text]/+page.svelte b/src/routes/(app)/[username]/accepted/[text]/+page.svelte
index 9770c937..090a873d 100644
--- a/src/routes/(app)/[username]/accepted/[text]/+page.svelte
+++ b/src/routes/(app)/[username]/accepted/[text]/+page.svelte
@@ -6,13 +6,12 @@
   let { nfc, text } = $derived(data);
   let { username } = $derived(data.subject);
   let url = `https://coinos.io/p/${username.toLowerCase()}`;
-
-  let icon;
-  if (nfc) icon = "nfc.png";
 </script>
 
 <div class="px-2">
-  <div class="border-8 border-black p-8 max-w-[580px] mx-auto mt-20 space-y-2 rounded-3xl">
+  <div
+    class="border-8 border-black p-8 max-w-[580px] mx-auto mt-20 space-y-2 rounded-3xl relative"
+  >
     <div class="flex gap-2 mx-auto justify-center">
       <!-- <img src="/images/bitcoin.png" class="w-16 h-16 my-auto" /> -->
       <img src="/images/bitcoin-logo.png" class="my-auto w-[400px]" />
@@ -20,7 +19,11 @@
       <!--   bitcoin -->
       <!-- </h3> -->
     </div>
-    <Qr {text} {icon} />
+    {#if nfc}
+      <img src="/images/tap.png" class="w-24 absolute top-40 left-4" />
+      <img src="/images/arrow.png" class="w-24 scale-x-[-1] rotate-[105deg] absolute top-52 left-32 w-16 h-52" />
+    {/if}
+    <Qr {text} />
     <div class="text-center text-4xl font-bold break-all">
       coinos.io/{username.toLowerCase()}
     </div>
diff --git a/static/images/arrow.png b/static/images/arrow.png
new file mode 100644
index 00000000..926cf9ea
--- /dev/null
+++ b/static/images/arrow.png
diff --git a/static/images/tap.png b/static/images/tap.png
index a6622111..21962b2f 100644
--- a/static/images/tap.png
+++ b/static/images/tap.png