update board-nav

src/components/board-nav/board-nav.module.css

@@ -21,7 +21,7 @@
   border-bottom: var(--boardnav-mobile-border-bottom);
   position: fixed;
   width: 100%;
-  font-size: 10px;
+  font-size: var(--boardnav-mobile-font-size);
 }
 
 .boardNavMobile strong {
@@ -29,7 +29,25 @@
 }
 
 .boardNavMobile select {
-  font-size: 10px;
+  font-size: var(--boardnav-mobile-font-size);
+}
+
+.boardSelect {
+  float: left;
+}
+
+.pageJump {
+  float: right;
+  padding: 3px 5px 0 0;
+}
+
+.pageJump span, .pageJump a {
+  padding-right: 5px;
+}
+
+.pageJump a {
+  color: var(--internal-link-text-color);
+  text-decoration: var(--internal-link-text-decoration);
 }
 
 @media (max-width: 640px) {

src/components/board-nav/board-nav.tsx

@@ -28,21 +28,29 @@ const BoardNavDesktop = ({ subplebbits }: BoardNavProps) => {
 const BoardNavMobile = ({ subplebbits, currentSubplebbit }: BoardNavProps) => {
   const navigate = useNavigate();
 
+  const boardSelect = (
+    <select value={currentSubplebbit} onChange={(e) => navigate(`/p/${e.target.value}`)}>
+      <option value='all'>All</option>
+      <option value='subscriptions'>Subscriptions</option>
+      {subplebbits.map((subplebbit: any, index: number) => (
+        <option key={index} value={subplebbit.address}>
+          {subplebbit.address.includes('.') ? subplebbit.address : subplebbit.title || subplebbit.address.slice(0, 10).concat('...')}
+        </option>
+      ))}
+    </select>
+  );
+
   return (
     <div className={styles.boardNavMobile}>
       <div className={styles.boardSelect}>
         <strong>Board</strong>
-        <select value={currentSubplebbit} onChange={(e) => navigate(`/p/${e.target.value}`)}>
-          <option value='all'>All</option>
-          <option value='subscriptions'>Subscriptions</option>
-          {subplebbits.map((subplebbit: any, index: number) => (
-            <option key={index} value={subplebbit.address}>
-              {subplebbit.address.includes('.') ? subplebbit.address : subplebbit.title || subplebbit.address.slice(0, 10).concat('...')}
-            </option>
-          ))}
-        </select>
+        {boardSelect}
+      </div>
+      <div className={styles.pageJump}>
+        <Link to='settings'>Settings</Link>
+        <Link to='/'>Home</Link>
+        {/* <span>App</span> TODO: consider adding apk download link */}
       </div>
-      <div className={styles.pageJump}></div>
     </div>
   );
 };