Mobile optimisation (#33)

* Fix squished logo & button

* Hide terminal on mobile

* A misc set of fixes

* Newline in window.css
* Add extra_head block to base template
* Move script/CSS loading to extra_head block in error view
* Move terminal JS into window.onload
* Replace `var` with `let` and enable strict mode in 500.js
* Stop typewriter when the terminal is closed
* Move terminal onclick assignment to 500.js
* Move error page <style> contents into window.css
* Tidy up error page HTML and remove unmatched tags

2 files changed, 55 insertions, 38 deletions

diff --git a/static/css/window.css b/static/css/window.css
index 23d1efed..e3a3da6e 100644
--- a/static/css/window.css
+++ b/static/css/window.css
@@ -5,7 +5,7 @@
     -moz-box-shadow: 0 4px 12px rgba(0, 0, 0, .5);
     -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .5);
     box-shadow: 0 4px 12px rgba(0, 0, 0, .5);
-    width: 800px;
+    width: 100%;
     margin: auto;
     margin-top: 20px;
     border: 1px solid #C1C2C2;
@@ -263,4 +263,15 @@ pre {
 
 .uk-background-muted, .error-header {
     background-color: #e8e8e8 !important;
+}
+
+code, pre {
+    width: 100%;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+}
+
+#terminal {
+    background-color: black;
+    color: white;
 }
\ No newline at end of file
diff --git a/static/js/500.js b/static/js/500.js
index 9aa5521e..856c900f 100644
--- a/static/js/500.js
+++ b/static/js/500.js
@@ -1,41 +1,47 @@
-var app = document.getElementById('error');
+"use strict";
 
-var typewriter = new Typewriter(app, {
-    loop: false,
-    deleteSpeed: 40,
-    typingSpeed: "natural",
-    devMode: false
-});
+window.onload = function () {
+    let app = document.getElementById('error');
 
+    let typewriter = new Typewriter(app, {
+        loop: false,
+        deleteSpeed: 40,
+        typingSpeed: "natural",
+        devMode: false
+    });
 
-typewriter.appendText('Python 3.6.4 (default, Jan  5 2018, 02:35:40)\n')
-    .appendText('[GCC 7.2.1 20171224] on darwin\n')
-    .appendText('Type "help", "copyright", "credits" or "license" for more information.\n')
-    .appendText('>>> ')
-    .pauseFor(1000)
-    .typeString("impor requests")
-    .deleteChars(9)
-    .typeString("t requests\n")
-    .appendText(">>> ")
-    .pauseFor(750)
-    .changeSettings({typingSpeed: "natural"})
-    .typeString("response = requests." + window._RequestMethod + "('https://pythim")
-    .deleteChars(2)
-    .typeString("ondiscord.con/")
-    .deleteChars(2)
-    .typeString("m" + window._Path + "')\n")
-    .pauseFor(1000)
-    .appendText("<Response [" + window._Code + "]>\n>>> ")
-    .typeString("# hmmmm")
-    .pauseFor(1000)
-    .deleteChars(7)
-    .pauseFor(1000)
-    .typeString("response.text\n")
-    .appendText("" + window._ErrorMsg + "\n>>> ")
-    .start();
+    function closeWindow() {
+        let app = document.getElementById("win");
+        let current_class = app.getAttribute("class");
+        app.setAttribute("class", current_class + " uk-animation-scale-up uk-animation-reverse");
+        typewriter.stop();
+    }
 
-function closeWindow(){
-    var app = document.getElementById("win");
-    var current_class = app.getAttribute("class");
-    app.setAttribute("class", current_class + " uk-animation-scale-up uk-animation-reverse")
-}
\ No newline at end of file
+    document.getElementById("terminal-close").onclick = closeWindow;
+
+    typewriter.appendText('Python 3.6.4 (default, Jan  5 2018, 02:35:40)\n')
+        .appendText('[GCC 7.2.1 20171224] on darwin\n')
+        .appendText('Type "help", "copyright", "credits" or "license" for more information.\n')
+        .appendText('>>> ')
+        .pauseFor(1000)
+        .typeString("impor requests")
+        .deleteChars(9)
+        .typeString("t requests\n")
+        .appendText(">>> ")
+        .pauseFor(750)
+        .changeSettings({typingSpeed: "natural"})
+        .typeString("response = requests." + window._RequestMethod + "('https://pythim")
+        .deleteChars(2)
+        .typeString("ondiscord.con/")
+        .deleteChars(2)
+        .typeString("m" + window._Path + "')\n")
+        .pauseFor(1000)
+        .appendText("<Response [" + window._Code + "]>\n>>> ")
+        .typeString("# hmmmm")
+        .pauseFor(1000)
+        .deleteChars(7)
+        .pauseFor(1000)
+        .typeString("response.text\n")
+        .appendText("" + window._ErrorMsg + "\n>>> ")
+        .start();
+};