add menu bar on mobile

dist/index.js

@@ -811,6 +811,9 @@
   }
 
   // src/index.tsx
+  document.body.prepend(
+    /* @__PURE__ */ createElement("menu", { class: "mobile-only" }, /* @__PURE__ */ createElement("a", { class: "tab-link", href: "#settings-tab", active: true }, /* @__PURE__ */ createElement("span", { class: "icon" }, "settings"), translation.settings), /* @__PURE__ */ createElement("a", { class: "tab-link", href: "#message-tab" }, /* @__PURE__ */ createElement("span", { class: "icon" }, "forum"), translation.messages))
+  );
   document.querySelector("main").append(SettingsTab(), MessageTab());
   document.querySelector("main").classList.add("split");
 })();

src/index.tsx

@@ -1,7 +1,22 @@
 import "./styles.css";
 
+import * as React from "bloatless-react";
+
 import { MessageTab } from "./Tabs/messageTab";
 import { SettingsTab } from "./Tabs/settingsTab";
+import { translation } from "./translations";
 
+document.body.prepend(
+  <menu class="mobile-only">
+    <a class="tab-link" href="#settings-tab" active>
+        <span class="icon">settings</span>
+        {translation.settings}
+    </a>
+    <a class="tab-link" href="#message-tab">
+        <span class="icon">forum</span>
+        {translation.messages}
+    </a>
+  </menu>
+);
 document.querySelector("main")!.append(SettingsTab(), MessageTab());
 document.querySelector("main")!.classList.add("split");