From 468444a454937575dd9277fb63799ec1f4f92dfa Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Sun, 28 Sep 2025 11:05:47 -0400
Subject: [PATCH] Relocate modal action icons

---
 components/video-modal.html | 145 ++++++++++++++++++------------------
 1 file changed, 71 insertions(+), 74 deletions(-)

diff --git a/components/video-modal.html b/components/video-modal.html
index 2dec4cab..17cb283c 100644
--- a/components/video-modal.html
+++ b/components/video-modal.html
@@ -31,56 +31,84 @@
               <path d="M15 18l-6-6 6-6" />
             </svg>
           </button>
-          <div
-            class="relative ml-auto overflow-visible"
-            data-more-menu-wrapper="true"
-          >
+          <div class="flex items-center ml-auto space-x-2">
+            <button id="copyMagnetBtn" class="icon-button">
+              <img
+                src="assets/svg/copy-magnet.svg"
+                alt="Copy Magnet"
+                class="icon-image"
+              />
+            </button>
             <button
-              id="modalMoreBtn"
+              id="modalZapBtn"
               type="button"
               class="icon-button"
-              aria-haspopup="true"
-              aria-expanded="false"
-              aria-label="More"
-              data-more-dropdown="modal"
+              aria-label="Send a zap"
             >
-              <img src="assets/svg/ellipsis.svg" alt="More" class="w-5 h-5" />
+              <img
+                src="assets/svg/lightning-bolt.svg"
+                alt="Zap"
+                class="icon-image"
+              />
+            </button>
+            <button id="shareBtn" class="icon-button">
+              <img
+                src="assets/svg/share-video.svg"
+                alt="Share Video"
+                class="icon-image"
+              />
             </button>
             <div
-              id="moreDropdown-modal"
-              class="hidden absolute right-0 top-14 w-44 rounded-md shadow-lg bg-gray-800 ring-1 ring-black ring-opacity-5 z-50"
-              role="menu"
-              data-more-menu="true"
+              class="relative overflow-visible"
+              data-more-menu-wrapper="true"
             >
-              <div class="py-1">
-                <button
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
-                  data-action="open-channel"
-                  data-context="modal"
-                >
-                  Open channel
-                </button>
-                <button
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
-                  data-action="copy-link"
-                  data-context="modal"
-                >
-                  Copy link
-                </button>
-                <button
-                  class="block w-full text-left px-4 py-2 text-sm text-red-400 hover:bg-red-700 hover:text-white"
-                  data-action="block-author"
-                  data-context="modal"
-                >
-                  Block creator
-                </button>
-                <button
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
-                  data-action="report"
-                  data-context="modal"
-                >
-                  Report
-                </button>
+              <button
+                id="modalMoreBtn"
+                type="button"
+                class="icon-button"
+                aria-haspopup="true"
+                aria-expanded="false"
+                aria-label="More"
+                data-more-dropdown="modal"
+              >
+                <img src="assets/svg/ellipsis.svg" alt="More" class="w-5 h-5" />
+              </button>
+              <div
+                id="moreDropdown-modal"
+                class="hidden absolute right-0 top-14 w-44 rounded-md shadow-lg bg-gray-800 ring-1 ring-black ring-opacity-5 z-50"
+                role="menu"
+                data-more-menu="true"
+              >
+                <div class="py-1">
+                  <button
+                    class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
+                    data-action="open-channel"
+                    data-context="modal"
+                  >
+                    Open channel
+                  </button>
+                  <button
+                    class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
+                    data-action="copy-link"
+                    data-context="modal"
+                  >
+                    Copy link
+                  </button>
+                  <button
+                    class="block w-full text-left px-4 py-2 text-sm text-red-400 hover:bg-red-700 hover:text-white"
+                    data-action="block-author"
+                    data-context="modal"
+                  >
+                    Block creator
+                  </button>
+                  <button
+                    class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
+                    data-action="report"
+                    data-context="modal"
+                  >
+                    Report
+                  </button>
+                </div>
               </div>
             </div>
           </div>
@@ -95,37 +123,6 @@
         <!-- Title and icons row -->
         <div class="flex items-center justify-between mb-2">
           <h2 id="videoTitle" class="text-2xl font-bold text-white"></h2>
-          <div class="flex items-center space-x-2">
-            <!-- Copy Magnet Button (circular) -->
-            <button id="copyMagnetBtn" class="icon-button">
-              <img
-                src="assets/svg/copy-magnet.svg"
-                alt="Copy Magnet"
-                class="icon-image"
-              />
-            </button>
-            <!-- Zap Button (circular) -->
-            <button
-              id="modalZapBtn"
-              type="button"
-              class="icon-button"
-              aria-label="Send a zap"
-            >
-              <img
-                src="assets/svg/lightning-bolt.svg"
-                alt="Zap"
-                class="icon-image"
-              />
-            </button>
-            <!-- Share Button (circular) -->
-            <button id="shareBtn" class="icon-button">
-              <img
-                src="assets/svg/share-video.svg"
-                alt="Share Video"
-                class="icon-image"
-              />
-            </button>
-          </div>
         </div>
 
         <!-- Video Timestamp -->