Remove all inline styles

Gruntfile.js

@@ -16,6 +16,9 @@ module.exports = grunt => {
             images: {
                 files: [{expand: true, cwd: "src/main/", src: ["**/*.{ico,png,svg}"], dest: "dist/", flatten: true}]
             },
+            js: {
+                files: [{expand: true, cwd: "src/main/", src: ["**/plain.js"], dest: "dist/", flatten: true}]
+            },
             pwa: {
                 files: [{expand: true, cwd: "src/main/", src: ["manifest.json", "sw.js"], dest: "dist/", flatten: true}]
             },
@@ -56,6 +59,10 @@ module.exports = grunt => {
                 files: ["src/main/**/*.html"],
                 tasks: ["copy:html"],
             },
+            js: {
+                files: ["src/main/**/*.js"],
+                tasks: ["copy:js"],
+            },
             ts: {
                 files: ["src/main/**/*.ts"],
                 tasks: ["webpack:dev", "replace:dev"],
@@ -105,6 +112,7 @@ module.exports = grunt => {
         "copy:css",
         "copy:html",
         "copy:images",
+        "copy:js",
         "copy:pwa",
         // Compile
         "webpack:dev",
@@ -119,6 +127,7 @@ module.exports = grunt => {
         "copy:css",
         "copy:html",
         "copy:images",
+        "copy:js",
         "copy:pwa",
         // Compile JS
         "webpack:deploy",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "fwdekker.com",
-    "version": "0.40.5",
+    "version": "0.40.6",
     "description": "The source code of [my personal website](https://fwdekker.com/).",
     "author": "Felix W. Dekker",
     "browser": "dist/bundle.js",

src/main/index.html

@@ -40,7 +40,7 @@
             -->Please check the <a href="https://www.enable-javascript.com/"><!--
             -->instructions how to enable JavaScript in your web browser</a>.<!--
         --></noscript><!--
-        --><div id="ie-warning" style="display:none;"><!--
+        --><div id="ie-warning" class="hidden"><!--
             -->This website does not function with Internet Explorer. <!--
             -->Please install a newer browser such as <!--
             --><a href="https://www.microsoft.com/en-us/windows/microsoft-edge">Microsoft Edge</a>.<!--
@@ -55,19 +55,8 @@
     --></div>
 </main>
 
-<script>
+<!--suppress HtmlUnknownTarget -->
-    if (/MSIE|Trident/.test(window.navigator.userAgent)) {
+<script src="plain.js?v=%%VERSION_NUMBER%%"></script>
-        window.onload = function() {
-            document.getElementById("ie-warning").style.display = "block";
-        };
-    }
-
-    if ("serviceWorker" in navigator) {
-        window.addEventListener("load", function() {
-            return navigator.serviceWorker.register("sw.js?v=%%VERSION_NUMBER%%");
-        });
-    }
-</script>
 <script src="https://static.fwdekker.com/lib/template/2.x.x/template.js"></script>
 <!--suppress HtmlUnknownTarget -->
 <script type="module" src="bundle.js?v=%%VERSION_NUMBER%%"></script>

src/main/js/Main.ts

@@ -39,8 +39,8 @@ doAfterLoad(() => {
 
     if (Persistence.getWasUpdated()) {
         $("#terminalOutput").innerHTML = "" +
-            "<span style=\"color:red\">The terminal application has been updated. To prevent unexpected errors, all " +
+            "<span class=\"errorMessage\">The terminal application has been updated. To prevent unexpected errors, " +
-            "previous user changes have been reset.</span>\n\n";
+            "all previous user changes have been reset.</span>\n\n";
         Persistence.setWasUpdated(false);
     }
 

src/main/js/plain.js

@@ -0,0 +1,11 @@
+if (/MSIE|Trident/.test(window.navigator.userAgent)) {
+    window.onload = function() {
+        document.getElementById("ie-warning").className = "";
+    };
+}
+
+if ("serviceWorker" in navigator) {
+    window.addEventListener("load", function() {
+        return navigator.serviceWorker.register("sw.js?v=%%VERSION_NUMBER%%");
+    });
+}

src/main/sw.js

@@ -1,16 +1,19 @@
 const CACHE_NAME = "fwdekker-%%VERSION_NUMBER%%";
 const CACHE_FILES = [
     "bundle.js",
+    "favicon.ico",
     "favicon.png",
-    "index.html",
+    "favicon.svg",
-    "manifest.json",
-    "main.css",
     "icon_128x128.png",
     "icon_144x144.png",
     "icon_152x152.png",
     "icon_192x192.png",
     "icon_512x512.png",
-    "icon_ios.png"
+    "icon_ios.png",
+    "index.html",
+    "main.css",
+    "manifest.json",
+    "plain.js",
 ];
 
 self.addEventListener("install", event =>