From 96dd8d511ed2daabe4eb436b3a6f7a499a11c831 Mon Sep 17 00:00:00 2001
From: Fabian Homborg <FHomborg@gmail.com>
Date: Thu, 3 Dec 2020 17:30:41 +0100
Subject: [PATCH] Webconfig: Let it work better on small screens

This allows it to basically work down to quite small widths.
---
 share/tools/web_config/fishconfig.css | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/share/tools/web_config/fishconfig.css b/share/tools/web_config/fishconfig.css
index cff183809..ec0d35512 100644
--- a/share/tools/web_config/fishconfig.css
+++ b/share/tools/web_config/fishconfig.css
@@ -17,6 +17,14 @@ code {
     overflow: hidden;
 }
 
+@media screen and (max-width: 700px) {
+    /* On small screens remove the margins to leave more for the actual content */
+    #ancestor {
+        width: 100%;
+        margin-left: none;
+        margin-right: none;
+    }
+}
 #parent {
     width: 100%;
     min-height: 480px;
@@ -27,6 +35,7 @@ code {
     display: table;
     width: 100%;
     height: 50px;
+    overflow-wrap: anywhere;
 }
 
 .tab {
@@ -70,6 +79,7 @@ code {
 	padding-top: 20px;
 	padding-bottom: 20px;
 	width: 100%;
+    min-height: 80vh;
 	background-color: #eeeefa;
 	border-bottom-left-radius: 8px;
 	border-bottom-right-radius: 8px;