Change navigation to add FAQ, and bundle Your bets and Your markets as options under menu.
This commit is contained in:
parent
6efdf46bb3
commit
80ffed9460
|
@ -11,24 +11,32 @@ import { MenuButton } from './menu'
|
||||||
const hoverClasses =
|
const hoverClasses =
|
||||||
'hover:underline hover:decoration-indigo-400 hover:decoration-2'
|
'hover:underline hover:decoration-indigo-400 hover:decoration-2'
|
||||||
|
|
||||||
const mobileNavigation = [
|
function getNavigationOptions(user: User, options: { mobile: boolean }) {
|
||||||
|
const { mobile } = options
|
||||||
|
return [
|
||||||
{
|
{
|
||||||
name: 'Home',
|
name: 'Home',
|
||||||
href: '/',
|
href: '/',
|
||||||
},
|
},
|
||||||
{
|
...(mobile
|
||||||
name: 'Account',
|
? [
|
||||||
href: '/account',
|
{ name: 'FAQ', href: '/about' },
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Your bets',
|
|
||||||
href: '/bets',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: 'Create a market',
|
name: 'Create a market',
|
||||||
href: '/create',
|
href: '/create',
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
: []),
|
||||||
|
{
|
||||||
|
name: 'Your bets',
|
||||||
|
href: '/bets',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Your markets',
|
||||||
|
href: `/${user.username}`,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
function ProfileSummary(props: { user: User }) {
|
function ProfileSummary(props: { user: User }) {
|
||||||
const { user } = props
|
const { user } = props
|
||||||
|
@ -50,6 +58,17 @@ function SignedInHeaders(props: { user: User; themeClasses?: string }) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
<Link href="/about">
|
||||||
|
<a
|
||||||
|
className={clsx(
|
||||||
|
'text-base hidden md:block whitespace-nowrap',
|
||||||
|
themeClasses
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
FAQ
|
||||||
|
</a>
|
||||||
|
</Link>
|
||||||
|
|
||||||
<Link href="/create">
|
<Link href="/create">
|
||||||
<a
|
<a
|
||||||
className={clsx(
|
className={clsx(
|
||||||
|
@ -61,30 +80,15 @@ function SignedInHeaders(props: { user: User; themeClasses?: string }) {
|
||||||
</a>
|
</a>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<Link href="/bets">
|
<MenuButton
|
||||||
<a
|
className="hidden md:block"
|
||||||
className={clsx(
|
menuItems={getNavigationOptions(user, { mobile: false })}
|
||||||
'text-base hidden md:block whitespace-nowrap',
|
buttonContent={<ProfileSummary user={user} />}
|
||||||
themeClasses
|
/>
|
||||||
)}
|
|
||||||
>
|
|
||||||
Your bets
|
|
||||||
</a>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<Link href="/account">
|
|
||||||
<a
|
|
||||||
className={clsx(
|
|
||||||
'text-base hidden md:block hover:underline hover:decoration-2 hover:decoration-indigo-700'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<ProfileSummary user={user} />
|
|
||||||
</a>
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
<MenuButton
|
<MenuButton
|
||||||
className="md:hidden"
|
className="md:hidden"
|
||||||
menuItems={mobileNavigation}
|
menuItems={getNavigationOptions(user, { mobile: true })}
|
||||||
buttonContent={<ProfileSummary user={user} />}
|
buttonContent={<ProfileSummary user={user} />}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
|
@ -138,7 +142,7 @@ export function Header(props: {
|
||||||
/>
|
/>
|
||||||
<div
|
<div
|
||||||
className={clsx(
|
className={clsx(
|
||||||
'font-major-mono lowercase mt-1 sm:text-2xl',
|
'font-major-mono lowercase mt-1 sm:text-2xl md:whitespace-nowrap',
|
||||||
darkBackground && 'text-white'
|
darkBackground && 'text-white'
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user