From 151e729b234d052569de1ff6f6b3999191be9f8d Mon Sep 17 00:00:00 2001
From: Will Budicm <vilijanac@gmail.com>
Date: Thu, 24 Dec 2020 17:02:11 +1100
Subject: [PATCH] Log entries need be with fixed with that is scrolled on
 resizing.

---
 htdocs/cgi-bin/main.cgi            |  2 +-
 htdocs/cgi-bin/wsrc/main.css       | 24 ++++++++++++++++++++++--
 htdocs/cgi-bin/wsrc/main.js        |  1 +
 htdocs/cgi-bin/wsrc/main_earth.css | 24 +++++++++++++++++++++++-
 htdocs/cgi-bin/wsrc/main_moon.css  | 24 +++++++++++++++++++++++-
 htdocs/cgi-bin/wsrc/main_sun.css   | 23 ++++++++++++++++++++++-
 6 files changed, 92 insertions(+), 6 deletions(-)

diff --git a/htdocs/cgi-bin/main.cgi b/htdocs/cgi-bin/main.cgi
index 24193e4..9e8eed5 100755
--- a/htdocs/cgi-bin/main.cgi
+++ b/htdocs/cgi-bin/main.cgi
@@ -652,7 +652,7 @@ sub buildLog {
         $log_output .= qq(<tr class="r$ssid">
 		<td width="15%">$dtf<input id="y$id" type="hidden" value="$dty"/></td>
 		<td id="t$id" width="10%" class="tbl">$dth</td>
-		<td id="v$id" class="log" width="40%">$log</td>
+		<td id="v$id"><div class="log">$log</div></td>
 		<td id="a$id" width="10%" class="tbl">$am</td>
 		<td id="c$id" width="10%" class="tbl">$ct</td>
         );
diff --git a/htdocs/cgi-bin/wsrc/main.css b/htdocs/cgi-bin/wsrc/main.css
index 9259587..75f1d43 100644
--- a/htdocs/cgi-bin/wsrc/main.css
+++ b/htdocs/cgi-bin/wsrc/main.css
@@ -20,7 +20,7 @@ div {
 }
 
 #div_log {
-    font-weight: bold;
+    font-weight: bold; 
 }
 #div_srh {
     text-align: center;
@@ -142,12 +142,32 @@ th,
 }
 
 .log {
+    max-width:550px;
     text-align: left;
     word-wrap: break-word;
-    padding-left: 5px;
+    white-space: normal;
+    padding-left: 5px;            
+    overflow-y:hidden;
 }
 
 
+.log::-webkit-scrollbar {
+    -webkit-appearance: none;
+}
+
+.log::-webkit-scrollbar:vertical {
+    width: 12px;
+}
+
+.log::-webkit-scrollbar:horizontal {
+    height: 12px;
+}
+
+.log::-webkit-scrollbar-thumb {
+    border-radius: 8px;
+    border: 2px solid white; /* should match background, can't be transparent */
+    background-color: rgba(0, 0, 0, .5);
+}
 
 div#rz {
     border: 1px solid black;
diff --git a/htdocs/cgi-bin/wsrc/main.js b/htdocs/cgi-bin/wsrc/main.js
index a88852e..910e8c3 100644
--- a/htdocs/cgi-bin/wsrc/main.js
+++ b/htdocs/cgi-bin/wsrc/main.js
@@ -1129,6 +1129,7 @@ function RGBToHex(rgb) {
 
 function fetchBackup() {
     window.location = "config.cgi?bck=1";
+    setTimeout("location.reload(true);", 1000);
 }
 function deleteBackup() {
     $('<div></div>').dialog({
diff --git a/htdocs/cgi-bin/wsrc/main_earth.css b/htdocs/cgi-bin/wsrc/main_earth.css
index 9ea2cd7..f4637c0 100644
--- a/htdocs/cgi-bin/wsrc/main_earth.css
+++ b/htdocs/cgi-bin/wsrc/main_earth.css
@@ -113,9 +113,31 @@ th,
 }
 
 .log {
+    max-width:550px;
     text-align: left;
     word-wrap: break-word;
-    padding-left: 5px;
+    white-space: normal;
+    padding-left: 5px;            
+    overflow-y:hidden;
+}
+
+
+.log::-webkit-scrollbar {
+    -webkit-appearance: none;
+}
+
+.log::-webkit-scrollbar:vertical {
+    width: 12px;
+}
+
+.log::-webkit-scrollbar:horizontal {
+    height: 12px;
+}
+
+.log::-webkit-scrollbar-thumb {
+    border-radius: 8px;
+    border: 2px solid white; /* should match background, can't be transparent */
+    background-color: rgba(0, 0, 0, .5);
 }
 
 div#rz {
diff --git a/htdocs/cgi-bin/wsrc/main_moon.css b/htdocs/cgi-bin/wsrc/main_moon.css
index a418c5e..34b4b29 100644
--- a/htdocs/cgi-bin/wsrc/main_moon.css
+++ b/htdocs/cgi-bin/wsrc/main_moon.css
@@ -131,9 +131,31 @@ div#rz {
 }
 
 .log {
+    max-width:550px;
     text-align: left;
     word-wrap: break-word;
-    padding-left: 5px;
+    white-space: normal;
+    padding-left: 5px;            
+    overflow-y:hidden;
+}
+
+
+.log::-webkit-scrollbar {
+    -webkit-appearance: none;
+}
+
+.log::-webkit-scrollbar:vertical {
+    width: 12px;
+}
+
+.log::-webkit-scrollbar:horizontal {
+    height: 12px;
+}
+
+.log::-webkit-scrollbar-thumb {
+    border-radius: 8px;
+    border: 2px solid white; /* should match background, can't be transparent */
+    background-color: rgba(0, 0, 0, .5);
 }
 
 #tag_FRM {
diff --git a/htdocs/cgi-bin/wsrc/main_sun.css b/htdocs/cgi-bin/wsrc/main_sun.css
index a3dfd47..c117cfe 100644
--- a/htdocs/cgi-bin/wsrc/main_sun.css
+++ b/htdocs/cgi-bin/wsrc/main_sun.css
@@ -114,12 +114,33 @@ th,
 }
 
 .log {
+    max-width:550px;
     text-align: left;
     word-wrap: break-word;
-    padding-left: 5px;
+    white-space: normal;
+    padding-left: 5px;            
+    overflow-y:hidden;
 }
 
 
+.log::-webkit-scrollbar {
+    -webkit-appearance: none;
+}
+
+.log::-webkit-scrollbar:vertical {
+    width: 12px;
+}
+
+.log::-webkit-scrollbar:horizontal {
+    height: 12px;
+}
+
+.log::-webkit-scrollbar-thumb {
+    border-radius: 8px;
+    border: 2px solid white; /* should match background, can't be transparent */
+    background-color: rgba(0, 0, 0, .5);
+}
+
 
 div#rz {
     border: 1px solid black;
-- 
2.34.1