From 7d16b673b1569fdc31472ea785195860af0d6dff Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Mon, 18 Jul 2022 02:08:52 +0400
Subject: [PATCH] Use Single Column Layout for Small Screens on Web Interface

---
 src/interface/web/index.html | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/src/interface/web/index.html b/src/interface/web/index.html
index aa62f3e1..8a1574b3 100644
--- a/src/interface/web/index.html
+++ b/src/interface/web/index.html
@@ -95,6 +95,18 @@
             padding: 10px;
             margin: 10px;
         }
+
+        /* Switch to 1 Column for Mobile Displays */
+        @media only screen and (max-width: 600px) {
+            body {
+                display: grid;
+                grid-template-columns: 1fr;
+            }
+            body > * {
+                grid-column: 1;
+            }
+        }
+
         h1 {
             font-weight: 200;
             color: #888;