From 0449fc6baa63e3e27d844ebbdab61f435aec4283 Mon Sep 17 00:00:00 2001
From: YouHaveTrouble <youhavetrouble@youhavetrouble.me>
Date: Sat, 26 Jul 2025 10:48:18 +0200
Subject: [PATCH] possibly fix popup issues on mobile safari

---
 src/components/ProjectsFeature.astro | 2 +-
 src/pages/index.astro                | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/ProjectsFeature.astro b/src/components/ProjectsFeature.astro
index d0814cb..f4edcf8 100644
--- a/src/components/ProjectsFeature.astro
+++ b/src/components/ProjectsFeature.astro
@@ -26,7 +26,7 @@ projects.sort((a, b) => a.data.name.localeCompare(b.data.name));
             </button>
             <div popover id={`project-${[index]}`} class="window popup" aria-label={`Details about ${project.data.name}`} data-title={project.data.name}>
               <div class="buttons">
-                <button popovertarget={`project-${[index]}`} popovertargetaction="hide" aria-label="Close project details">
+                <button popovertarget={`project-${[index]}`} popovertargetaction="hide" tabindex="0" aria-label="Close project details">
                   <span class="icon">❌</span>
                 </button>
               </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 4252b34..fbf08d6 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -38,13 +38,13 @@ const permalink = Astro?.site?.href ?? '/';
     <div class="window-row">
       <div class="window" data-title="Projects" id="projects" aria-label="Projects">
         <div class="buttons">
-          <button popovertarget="projects-info" popovertargetaction="show" aria-label="Projects info">
+          <button popovertarget="projects-info" popovertargetaction="show" tabindex="0" aria-label="Projects info">
             <span class="icon">ℹ️</span>
           </button>
         </div>
         <div popover="auto" id="projects-info" class="window">
           <div class="buttons">
-            <button popovertarget="projects-info" popovertargetaction="hide" aria-label="Close projects info">
+            <button popovertarget="projects-info" popovertargetaction="hide" tabindex="0" aria-label="Close projects info">
               <span class="icon">❌</span>
             </button>
           </div>