From 0167afdd314d3c47e3b9161375e2456af12950df Mon Sep 17 00:00:00 2001
From: Michael Reber <michael.reber@rlinfp02.swissmakers.corp>
Date: Sat, 1 Feb 2025 08:51:16 +0100
Subject: [PATCH] Improve table responsive

---
 pkg/web/templates/index.html | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/pkg/web/templates/index.html b/pkg/web/templates/index.html
index ac51a0f..94ff162 100644
--- a/pkg/web/templates/index.html
+++ b/pkg/web/templates/index.html
@@ -47,6 +47,17 @@
     #reloadBanner {
       display: none;
     }
+    
+    /* Improve table readability on small screens */
+    @media (max-width: 575px) {
+      .table th, .table td {
+        font-size: 0.8rem;
+        padding: 5px;
+      }
+      .table thead {
+        font-size: 1rem;
+      }
+    }
   </style>
 </head>
 
@@ -399,6 +410,7 @@ function renderDashboard(data) {
   } else {
     html += ''
       + '<h2><span data-bs-toggle="tooltip" data-bs-placement="top" title="The Overview displays the currently enabled jails that you have added to your jail.local configuration.">Overview</span></h2>'
+      + '<div class="table-responsive">'
       + '<table class="table table-striped" id="jailsTable">'
       + '  <thead>'
       + '    <tr>'
@@ -425,7 +437,7 @@ function renderDashboard(data) {
         + '</tr>';
     });
 
-    html += '</tbody></table>';
+    html += '</tbody></table></div>';
   }
 
   // Last 5 bans
@@ -434,6 +446,7 @@ function renderDashboard(data) {
     html += '<p>No recent bans found.</p>';
   } else {
     html += ''
+      + '<div class="table-responsive">'
       + '<table class="table table-bordered">'
       + '  <thead>'
       + '    <tr>'
@@ -443,7 +456,7 @@ function renderDashboard(data) {
       + '      <th>Log Line</th>'
       + '    </tr>'
       + '  </thead>'
-      + '  <tbody>';
+      + '  <tbody></div>';
 
     data.lastBans.forEach(function(e) {
       html += ''