feat: game version switch buttons (#789)

reallyMilo · Dec 9, 2024 · 962b7d2 · 962b7d2
1 parent 6e8770d
commit 962b7d2
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 14 deletions.
diff --git a/public/anno117-icon.jpg b/public/anno117-icon.jpg
diff --git a/public/anno1800-icon.webp b/public/anno1800-icon.webp
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -13,6 +13,7 @@ import { auth } from '@/auth'
 import { MobileNavbar } from '@/components/layout/MobileNavbar'
 import { NotificationDropdownButton } from '@/components/layout/NotificationDropdownButton'
 import { UserDropdownButton } from '@/components/layout/UserDropdownButton'
+import { VersionButtons } from '@/components/layout/VersionButtons'
 import {
   Button,
   Container,
@@ -155,6 +156,9 @@ const Navbar = () => {
   return (
     <header>
       <Container className="py-0">
+        <div className="max-md:hidden">
+          <VersionButtons />
+        </div>
         <NavbarRoot>
           <MobileNavbar socials={<SocialIcons />}>
             {navigation.map((item) => (

diff --git a/src/components/layout/MobileNavbar.tsx b/src/components/layout/MobileNavbar.tsx
@@ -1,10 +1,8 @@
 'use client'
 
-import Image from 'next/image'
 import { useState } from 'react'
 
 import {
-  Link,
   MobileSidebar,
   NavbarItem,
   OpenMenuIcon,
@@ -15,7 +13,7 @@ import {
   SidebarSection,
 } from '@/components/ui'
 
-import logo from '../../../public/anno-stamps-logo.png'
+import { VersionButtons } from './VersionButtons'
 
 export const MobileNavbar = ({
   children,
@@ -34,17 +32,7 @@ export const MobileNavbar = ({
       <MobileSidebar close={() => setIsOpen(false)} open={isOpen}>
         <Sidebar>
           <SidebarHeader>
-            <Link href="/" id="header-logo">
-              <Image
-                alt="Anno Stamps"
-                src={logo}
-                style={{
-                  height: 'auto',
-                  maxWidth: '160px',
-                  width: '100%',
-                }}
-              />
-            </Link>
+            <VersionButtons />
           </SidebarHeader>
           <SidebarBody>
             <SidebarSection>{children}</SidebarSection>

diff --git a/src/components/layout/VersionButtons.tsx b/src/components/layout/VersionButtons.tsx
@@ -0,0 +1,27 @@
+'use client'
+
+import Image from 'next/image'
+
+import anno117 from '../../../public/anno117-icon.jpg'
+import anno1800 from '../../../public/anno1800-icon.webp'
+import { Button } from '../ui'
+
+export const VersionButtons = () => {
+  return (
+    <div className="29px py-1">
+      <Button disabled plain>
+        <Image alt="anno 117 logo icon" height={20} src={anno117} width={20} />
+        Soon
+      </Button>
+      <Button href="/" plain>
+        <Image
+          alt="anno 1800 logo icon"
+          height={20}
+          src={anno1800}
+          width={20}
+        />
+        1800
+      </Button>
+    </div>
+  )
+}