From ba364fdf2b7e9e87e963752df9bafbb17a926b96 Mon Sep 17 00:00:00 2001
From: Blackwhitebear8 <blackwhitebear8@git@pixelhosting.nl>
Date: Fri, 31 Oct 2025 19:34:03 +0100
Subject: [PATCH] Update templates/interfaces.html

---
 templates/interfaces.html | 48 ++++++++++++++++++++-------------------
 1 file changed, 25 insertions(+), 23 deletions(-)

diff --git a/templates/interfaces.html b/templates/interfaces.html
index 6ddb403..4256431 100644
--- a/templates/interfaces.html
+++ b/templates/interfaces.html
@@ -17,28 +17,30 @@
             </button>
         </div>
         <p></p> <p>Codes: S - State, L - Link, u - Up, D - Down, A - Admin Down</p>
-        <table class="striped table table-bordered" id="interfaceTable">
-            <thead>
-                <tr>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 0, this)">Interface <span class="sort-arrow"></span></th>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 1, this)">IP Address <span class="sort-arrow"></span></th>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 2, this)">MAC Address <span class="sort-arrow"></span></th>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 3, this)">VRF <span class="sort-arrow"></span></th>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 4, this)">MTU <span class="sort-arrow"></span></th>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 5, this)">Status <span class="sort-arrow"></span></th>
-                    <th class="sortable" onclick="sortTable('interfaceTable', 6, this)">Description <span class="sort-arrow"></span></th>
-                </tr>
-            </thead>
-            <tbody id="interfaceTableBody">
-			    <tr id="interface-loading-row">
-				    <td colspan="7" class="text-center">
-					    <div class="spinner-border text-primary" role="status">
-						    <span class="visually-hidden">Loading...</span>
-						</div>
-					</td>
-                </tr>
-            </tbody>
-        </table>
-        <p><a href="/interfaces/json">JSON version</a></p>
+        
+        <div class="table-responsive">
+            <table class="striped table table-bordered" id="interfaceTable">
+                <thead>
+                    <tr>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 0, this)">Interface <span class="sort-arrow"></span></th>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 1, this)">IP Address <span class="sort-arrow"></span></th>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 2, this)">MAC Address <span class="sort-arrow"></span></th>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 3, this)">VRF <span class="sort-arrow"></span></th>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 4, this)">MTU <span class="sort-arrow"></span></th>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 5, this)">Status <span class="sort-arrow"></span></th>
+                        <th class="sortable" onclick="sortTable('interfaceTable', 6, this)">Description <span class="sort-arrow"></span></th>
+                    </tr>
+                </thead>
+                <tbody id="interfaceTableBody">
+                    <tr id="interface-loading-row">
+                        <td colspan="7" class="text-center">
+                            <div class="spinner-border text-primary" role="status">
+                                <span class="visually-hidden">Loading...</span>
+                            </div>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div> <p><a href="/interfaces/json">JSON version</a></p>
     </section>
 {% endblock %}
\ No newline at end of file