From 051d1b7513e38467ff304dc4b257b9f41b4a67bf Mon Sep 17 00:00:00 2001
From: Michael Kuperfish Steinberg
 <36902556+Michael-K-Stein@users.noreply.github.com>
Date: Thu, 5 Jan 2023 16:29:59 +0200
Subject: [PATCH] Add autoscroll toggle checkbox

---
 static/css/base.css  | 8 ++++----
 templates/index.html | 5 ++++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/static/css/base.css b/static/css/base.css
index fe61c0e..48500d7 100644
--- a/static/css/base.css
+++ b/static/css/base.css
@@ -100,7 +100,7 @@ form input[type="number"] {
     padding: 2px;
 }
 
-form input[type="checkbox"] {
+input[type="checkbox"] {
     -webkit-appearance: none;
     appearance: none;
     background-color: #fff;
@@ -119,7 +119,7 @@ form input[type="checkbox"] {
     place-content: center;
 }
 
-form input[type="checkbox"]::before {
+input[type="checkbox"]::before {
     content: "";
     width: 0.65em;
     height: 0.65em;
@@ -131,11 +131,11 @@ form input[type="checkbox"]::before {
     clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
 }
   
-form input[type="checkbox"]:checked::before {
+input[type="checkbox"]:checked::before {
     transform: scale(1);
 }
 
-form input[type="checkbox"]:hover {
+input[type="checkbox"]:hover {
     outline: max(2px, 0.15em) solid currentColor;
     outline-offset: max(2px, 0.15em);
 }
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 66fd3ba..07828ab 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -25,7 +25,9 @@
                 document.getElementById('console-output').appendChild(log_line);
             }
 
-            document.getElementById('console-output').scrollTop = 999999999999999999999999;
+            if (document.getElementById('autoscroll').checked) {
+                document.getElementById('console-output').scrollTop = 999999999999999999999999;
+            }
         }, 1000);
     </script>
 </head>
@@ -43,6 +45,7 @@
             </div></div>
         </form>
     </div>
+    <div style="display:inline-flex;align-items:baseline;"><label>Autoscroll: </label><input id="autoscroll" type="checkbox" checked></div>
     <div id="console-output" class="align-bottom scrollable">
     </div>