[K8sBroadcaster] Fix buttons on mobile phone

l7mp · Jan 23, 2025 · f9f6174 · f9f6174
1 parent 143b9ad
commit f9f6174
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/k8s_broadcaster/assets/js/home.js b/k8s_broadcaster/assets/js/home.js
@@ -765,6 +765,10 @@ export const Home = {
     view.button2 = document.getElementById("button-2");
     view.button3 = document.getElementById("button-3");
     view.buttonAuto = document.getElementById("button-auto");
+    view.button1Mb = document.getElementById("button-1-mb");
+    view.button2Mb = document.getElementById("button-2-mb");
+    view.button3Mb = document.getElementById("button-3-mb");
+    view.buttonAutoMb = document.getElementById("button-auto-mb");
     view.recordBtn = document.getElementById("record-btn");
     view.statisticsTab = document.getElementById("statistics-tab");
     view.compareTab = document.getElementById("compare-tab");
@@ -855,6 +859,10 @@ export const Home = {
     view.button2.onclick = (ev) => buttonOnClick(view, ev.srcElement);
     view.button3.onclick = (ev) => buttonOnClick(view, ev.srcElement);
     view.buttonAuto.onclick = (ev) => buttonOnClick(view, ev.srcElement);
+    view.button1Mb.onclick = (ev) => buttonOnClick(view, ev.srcElement);
+    view.button2Mb.onclick = (ev) => buttonOnClick(view, ev.srcElement);
+    view.button3Mb.onclick = (ev) => buttonOnClick(view, ev.srcElement);
+    view.buttonAutoMb.onclick = (ev) => buttonOnClick(view, ev.srcElement);
 
     view.compareBtn.onclick = () => compare(view);
 

diff --git a/k8s_broadcaster/lib/k8s_broadcaster_web/controllers/page_html/home.html.heex b/k8s_broadcaster/lib/k8s_broadcaster_web/controllers/page_html/home.html.heex
@@ -191,29 +191,29 @@
         <div id="cluster-buttons" class="lg:hidden flex flex-col gap-5">
           <div class="flex flex-row gap-5">
             <button
-              id="button-1"
+              id="button-1-mb"
               value={K8sBroadcaster.Application.cluster(:c1).url || assigns[:current_url]}
               class="flex-1 p-2 bg-[#675AF1] rounded-lg font-dmsans non-italic font-medium text-[16px] leading-[140%] text-center text-white"
             >
               Connect {K8sBroadcaster.Application.cluster(:c1).reg || "LOC"}
             </button>
             <button
-              id="button-2"
+              id="button-2-mb"
               value={K8sBroadcaster.Application.cluster(:c2).url || assigns[:current_url]}
               class="flex-1 p-2 bg-[#675AF1] rounded-lg font-dmsans non-italic font-medium text-[16px] leading-[140%] text-center text-white"
             >
               Connect {K8sBroadcaster.Application.cluster(:c2).reg || "LOC"}
             </button>
             <button
-              id="button-3"
+              id="button-3-mb"
               value={K8sBroadcaster.Application.cluster(:c3).url || assigns[:current_url]}
               class="flex-1 p-2 bg-[#675AF1] rounded-lg font-dmsans non-italic font-medium text-[16px] leading-[140%] text-center text-white"
             >
               Connect {K8sBroadcaster.Application.cluster(:c3).reg || "LOC"}
             </button>
           </div>
           <button
-            id="button-auto"
+            id="button-auto-mb"
             value={K8sBroadcaster.Application.cluster(:c0).url || assigns[:current_url]}
             class="flex-1 p-2 bg-[#675AF1] rounded-lg font-dmsans non-italic font-medium text-[16px] leading-[140%] text-center text-white"
           >