fix(ui): fixes for mobile UI, settings and sessions pages (#451)

Co-authored-by: trashtemp <96388163+trashtemp@users.noreply.github.com>

src/pages/settings/panes/Native.tsx

@@ -1,7 +1,12 @@
+import { Refresh } from "@styled-icons/boxicons-regular";
+
 import { useEffect, useState } from "preact/hooks";
 
 import Button from "../../../components/ui/Button";
 import Checkbox from "../../../components/ui/Checkbox";
+import Tip from "../../../components/ui/Tip";
+import CategoryButton from "../../../components/ui/fluent/CategoryButton";
+import RLogo from "../assets/revolt_r.svg";
 
 export function Native() {
     if (typeof window.native === "undefined") return null;
@@ -20,9 +25,9 @@ export function Native() {
     }, []);
 
     return (
-        <div>
+        <div style={{ marginTop: "10px" }}>
+            <Tip hideSeparator>Some options might require a restart.</Tip>
             <h3>App Behavior</h3>
-            <h5>Some options might require a restart.</h5>
             <Checkbox
                 checked={autoStart ?? false}
                 disabled={typeof autoStart === "undefined"}
@@ -175,6 +180,13 @@ export function Native() {
                     </p>
                 </>
             )}
+            <hr />
+            <CategoryButton
+                icon={<img src={RLogo} draggable={false} />}
+                description={<span>version {window.nativeVersion}</span>}
+                action={<Refresh size={24} />}>
+                Revolt for Desktop
+            </CategoryButton>
         </div>
     );
 }