Add full width toggle

3 files changed, 11 insertions, 1 deletions

diff --git a/public/index.php b/public/index.php
index c6a5ad7..9de0c7d 100644
--- a/public/index.php
+++ b/public/index.php
@@ -181,7 +181,8 @@ $csrf = csrf_token();
     <div id="output" style="display: none;"></div>
     <div id="footer">
         &copy; <?= date("Y") ?> <a href="https://jkohl.link/" target="_blank">Jonas Kohl</a>.
-        <a href="https://git.jkohl.link/online-java-compiler.git" target="_blank">Source code</a>
+        <a href="https://git.jkohl.link/online-java-compiler.git" target="_blank">Source code</a>.
+        <a href="javascript:;" id="toggleFullWidth">Toggle full width</a>
     </div>
 </body>
 </html>
diff --git a/public/site.css b/public/site.css
index fb82456..61c6986 100644
--- a/public/site.css
+++ b/public/site.css
@@ -8,6 +8,10 @@ body {
             box-sizing: border-box;
     font: 12pt Tahoma, Helvetica, sans-serif;
 }
+body.full-width {
+    max-width: none;
+    margin: 0;
+}
 a {
     color: blue;
 }
diff --git a/public/site.js b/public/site.js
index e19d6ef..1155126 100644
--- a/public/site.js
+++ b/public/site.js
@@ -49,6 +49,11 @@ $(function() {
         });
     });
 
+    $("#toggleFullWidth").on("click", function(e) {
+        e.preventDefault();
+        $("body").toggleClass("full-width");
+    });
+
     $("form").on("submit", function(e) {
         e.preventDefault();