Remove inline styles

package.json

@@ -1,6 +1,6 @@
 {
     "name": "interlanguage-checker",
-    "version": "1.11.0",
+    "version": "1.11.1",
     "description": "Check the consistency of MediaWiki interlanguage links in a simple overview.",
     "author": "Felix W. Dekker",
     "browser": "dist/bundle.js",

src/main/index.html

@@ -22,13 +22,13 @@
 <noscript>
     <img src="https://stats.fwdekker.com/count?p=/tools/interlanguage-checker/" alt="Counting pixel" />
 
-    <p style="color: red; font-weight: bold;">
+    <p>
         This website does not function if JavaScript is disabled.
         Please check the <a href="https://www.enable-javascript.com/">
         instructions on how to enable JavaScript in your web browser</a>.
     </p>
 </noscript>
-<main style="display: none;">
+<main class="hidden">
     <div id="nav"></div>
     <div id="contents">
         <div id="header"></div>

src/main/js/DOM.js

@@ -105,7 +105,7 @@ export class MessageHandler {
      */
     constructor(parent, id) {
         this._mainDiv = document.createElement("div");
-        this._mainDiv.style.display = "none";
+        this._mainDiv.classList.add("hidden");
         this._mainDiv.classList.add("messageInner");
         parent.appendChild(this._mainDiv);
 
@@ -179,8 +179,7 @@ export class MessageHandler {
         if (level === this._currentLevel) return;
         this._currentLevel = level;
 
-        this._mainDiv.style.display = null;
-        this._mainDiv.classList.remove("success", "warning", "error");
+        this._mainDiv.classList.remove("hidden", "success", "warning", "error");
 
         switch (level) {
             case "complete":
@@ -202,7 +201,7 @@ export class MessageHandler {
                 this._toggleLoadingIcon(false);
                 break;
             default:
-                this._mainDiv.style.display = "none";
+                this._mainDiv.classList.remove("hidden");
                 return this; // No further handling necessary
         }
     }
@@ -215,8 +214,13 @@ export class MessageHandler {
      * @private
      */
     _toggleLoadingIcon(state) {
-        this._loadingIcon.style.display = state ? null : "none";
-        this._spacing.style.display = state ? null : "none";
+        if (state) {
+            this._loadingIcon.classList.remove("hidden");
+            this._spacing.classList.remove("hidden");
+        } else {
+            this._loadingIcon.classList.add("hidden");
+            this._spacing.classList.add("hidden");
+        }
 
         return this;
     }