From d3792e78e01efc052f1b890907025befd7abbc87 Mon Sep 17 00:00:00 2001
From: spinline <bilal.karatatr.@gmail.com>
Date: Sun, 8 Feb 2026 21:49:00 +0300
Subject: [PATCH] fix: ios safari mobile dropdown and click bubbling issues
 resolved with global closer and native details

---
 frontend/index.html                         | 13 ++++++++++++-
 frontend/src/components/layout/statusbar.rs |  6 +-----
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 399b8fa..0103a8b 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -4,7 +4,7 @@
         <meta charset="utf-8" />
         <meta
             name="viewport"
-            content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover"
+            content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
         />
         <title>VibeTorrent</title>
 
@@ -187,6 +187,17 @@
         
         <!-- Service Worker Registration & PWA Setup -->
         <script>
+            // Global Dropdown Closer for iOS/Mobile
+            document.addEventListener('click', function(event) {
+                const details = document.querySelectorAll('details[open]');
+                details.forEach(detail => {
+                    // Eğer tıklanan yer bu details'in içinde değilse kapat
+                    if (!detail.contains(event.target)) {
+                        detail.removeAttribute('open');
+                    }
+                });
+            }, true); // Use capture phase for better mobile support
+
             if ("serviceWorker" in navigator) {
                 window.addEventListener("load", () => {
                     navigator.serviceWorker
diff --git a/frontend/src/components/layout/statusbar.rs b/frontend/src/components/layout/statusbar.rs
index 0873201..8fc3323 100644
--- a/frontend/src/components/layout/statusbar.rs
+++ b/frontend/src/components/layout/statusbar.rs
@@ -97,7 +97,7 @@ pub fn StatusBar() -> impl IntoView {
         });
     };
 
-        // Refs for click outside detection
+        // Refs for click outside detection (Handled globally via JS in index.html for better iOS support)
         let down_details_ref = create_node_ref::<html::Details>();
         let up_details_ref = create_node_ref::<html::Details>();
         let theme_details_ref = create_node_ref::<html::Details>();
@@ -109,10 +109,6 @@ pub fn StatusBar() -> impl IntoView {
             }
         };
 
-        let _ = on_click_outside(down_details_ref, move |_| close_details(down_details_ref));
-        let _ = on_click_outside(up_details_ref, move |_| close_details(up_details_ref));
-        let _ = on_click_outside(theme_details_ref, move |_| close_details(theme_details_ref));
-
         view! {
             <div class="fixed bottom-0 left-0 right-0 h-8 min-h-8 bg-base-200 border-t border-base-300 flex items-center px-4 text-xs gap-4 text-base-content/70 z-[99] cursor-pointer">