From b763ecd99f09373c69770717025e84e739a8df3b Mon Sep 17 00:00:00 2001
From: Silberengel <silberengel7@protonmail.com>
Date: Sat, 5 Apr 2025 11:47:23 +0200
Subject: [PATCH] Refactored a bit. Changed a tags to buttons that look like
 hyperlinks, to preserve normal button functionality.

---
 src/lib/components/Login.svelte                |  2 +-
 src/lib/components/util/CardActions.svelte     | 18 +++++++++---------
 src/lib/components/util/CopyToClipboard.svelte |  4 ++--
 src/lib/components/util/Profile.svelte         | 10 +++++-----
 4 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/lib/components/Login.svelte b/src/lib/components/Login.svelte
index 2d77763..1456149 100644
--- a/src/lib/components/Login.svelte
+++ b/src/lib/components/Login.svelte
@@ -50,7 +50,7 @@
     <Popover
       class='popover-leather w-fit'
       placement='bottom'
-      target='avatar'
+      triggeredBy='#avatar'
     >
       <div class='w-full flex space-x-2'>
         <Button
diff --git a/src/lib/components/util/CardActions.svelte b/src/lib/components/util/CardActions.svelte
index 41f0c1c..32476a1 100644
--- a/src/lib/components/util/CardActions.svelte
+++ b/src/lib/components/util/CardActions.svelte
@@ -114,32 +114,32 @@
       <div class='flex flex-col text-nowrap'>
         <ul class="space-y-2">
           <li>
-            <a href="" role="button" class='btn-leather' onclick={viewDetails}>
+            <button type="button" class='btn-leather' onclick={viewDetails}>
               <EyeOutline class="inline mr-2"  /> View details
-            </a>
+            </button>
           </li>
           <li>
-            <a role="button" class='btn-leather' onclick={shareNjump}>
+            <button type="button" class='btn-leather' onclick={shareNjump}>
               {#if shareLinkCopied}
                 <ClipboardCheckOutline class="inline mr-2" /> Copied!
               {:else}
                 <ShareNodesOutline class="inline mr-2" /> Share via NJump
               {/if}
-            </a>
+            </button>
           </li>
           <li>
-            <a role="button" class='btn-leather' onclick={copyEventId}>
+            <button type="button" class='btn-leather' onclick={copyEventId}>
               {#if eventIdCopied}
                 <ClipboardCheckOutline class="inline mr-2" /> Copied!
               {:else}
                 <ClipboardCleanOutline class="inline mr-2" /> Copy event ID
               {/if}
-            </a>
+            </button>
           </li>
           <li>
-            <a href="" role="button" class='btn-leather' onclick={viewJson}>
+            <button type="button" class='btn-leather' onclick={viewJson}>
               <CodeOutline class="inline mr-2"  /> View JSON
-            </a>
+            </button>
           </li>
         </ul>
       </div>
@@ -157,7 +157,7 @@
     <div class="flex flex-row space-x-4">
       {#if image}
       <div class="flex col">
-        <img class="max-w-48" src={image} />
+        <img class="max-w-48" src={image} alt="Publication cover image for {title}" />
       </div>
       {/if}
       <div class="flex flex-col col space-y-5  justify-center  align-middle">
diff --git a/src/lib/components/util/CopyToClipboard.svelte b/src/lib/components/util/CopyToClipboard.svelte
index 9e72c79..63f1aa7 100644
--- a/src/lib/components/util/CopyToClipboard.svelte
+++ b/src/lib/components/util/CopyToClipboard.svelte
@@ -18,10 +18,10 @@
   }
 </script>
 
-<a role="button" class='btn-leather text-nowrap' onclick={copyToClipboard}>
+<button type="button" class='btn-leather text-nowrap' onclick={copyToClipboard}>
   {#if copied}
     <ClipboardCheckOutline class="!fill-none dark:!fill-none inline mr-1" /> Copied!
   {:else}
     <ClipboardCleanOutline class="!fill-none dark:!fill-none inline mr-1" /> {displayText}
   {/if}
-</a>
\ No newline at end of file
+</button>
diff --git a/src/lib/components/util/Profile.svelte b/src/lib/components/util/Profile.svelte
index fd23c9f..a44cba1 100644
--- a/src/lib/components/util/Profile.svelte
+++ b/src/lib/components/util/Profile.svelte
@@ -46,10 +46,12 @@ function shortenNpub(long: string|undefined) {
       class='h-6 w-6 cursor-pointer'
       src={pfp}
       alt={username}
+      id="profile-avatar"
     />
     {#key username || tag}
       <Popover
-        target="avatar"
+        placement="bottom"
+        triggeredBy="#profile-avatar"
         class='popover-leather w-[180px]'
         trigger='hover'
       >
@@ -70,15 +72,13 @@ function shortenNpub(long: string|undefined) {
               </li>
               {#if isNav}
                 <li>
-                  <a
-                    href=""
+                  <button
                     id='sign-out-button'
                     class='btn-leather text-nowrap mt-3 flex self-stretch align-middle hover:text-primary-400 dark:hover:text-primary-500'
                     onclick={handleSignOutClick}
-                    role="button"
                   >
                     <ArrowRightToBracketOutline class='mr-1 !h-6 !w-6 inline !fill-none dark:!fill-none' /> Sign out
-                  </a>
+                  </button>
                 </li>
               {:else}
                 <!-- li>