diff --git a/src/components/board-nav/board-nav.module.css b/src/components/board-nav/board-nav.module.css index 45a90f9c..e45c0333 100644 --- a/src/components/board-nav/board-nav.module.css +++ b/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) { diff --git a/src/components/board-nav/board-nav.tsx b/src/components/board-nav/board-nav.tsx index 74e6516a..1f96c36c 100644 --- a/src/components/board-nav/board-nav.tsx +++ b/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 = ( + + ); + return (
Board - + {boardSelect} +
+
+ Settings + Home + {/* App TODO: consider adding apk download link */}
-
); }; diff --git a/src/themes.css b/src/themes.css index 254e021b..f171bbb1 100644 --- a/src/themes.css +++ b/src/themes.css @@ -6,7 +6,7 @@ --boardnav-separator-color: #b86; --boardnav-mobile-background-color: #f0e0d6; --boardnav-mobile-border-bottom: 2px solid #d9c5b7; - --boardnav-mobile-font-size: 11pt; + --boardnav-mobile-font-size: 10px; --body-font-color: maroon; --body-font-family: arial, helvetica, sans-serif; --body-font-size: 10pt; @@ -36,7 +36,7 @@ --boardnav-separator-color: #89a; --boardnav-mobile-background-color: #d6daf0; --boardnav-mobile-border-bottom: 2px solid #b7c5d9; - --boardnav-mobile-font-size: 11pt; + --boardnav-mobile-font-size: 10px; --body-font-color: #000; --body-font-family: arial, helvetica, sans-serif; --body-font-size: 10pt; @@ -127,7 +127,7 @@ --boardnav-separator-color: #c5c8c6; --boardnav-mobile-background-color: #1d1f21; --boardnav-mobile-border-bottom: 2px solid #282a2e; - --boardnav-mobile-font-size: 11pt; + --boardnav-mobile-font-size: 10px; --body-font-color: #c5c8c6; --body-font-family: arial, helvetica, sans-serif; --body-font-size: 10pt; @@ -150,7 +150,7 @@ --boardnav-separator-color: #333; --boardnav-mobile-background-color: #ddd; --boardnav-mobile-border-bottom: 2px solid #ccc; - --boardnav-mobile-font-size: 11pt; + --boardnav-mobile-font-size: 10px; --body-font-color: #333; --body-font-family: arial, helvetica, sans-serif; --body-font-size: 10pt;