Move group navbar to top (#895)

This commit is contained in:
FRC 2022-09-19 17:29:17 +01:00 committed by GitHub
parent 5d65bb5bb1
commit 6aa45a2d12
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 9 deletions

View File

@ -32,7 +32,7 @@ export function GroupNavBar(props: {
const user = useUser()
return (
<nav className="fixed inset-x-0 bottom-0 z-20 flex justify-between border-t-2 bg-white text-xs text-gray-700 lg:hidden">
<nav className="z-20 flex justify-between border-t-2 bg-white text-xs text-gray-700 lg:hidden">
{mobileGroupNavigation.map((item) => (
<NavBarItem
key={item.name}

View File

@ -262,7 +262,11 @@ export default function GroupPage(props: {
return (
<>
<TopGroupNavBar group={group} />
<TopGroupNavBar
group={group}
currentPage={sidebarPages[sidebarIndex].key}
onClick={onSidebarClick}
/>
<div>
<div
className={
@ -287,19 +291,19 @@ export default function GroupPage(props: {
{pageContent}
</main>
</div>
<GroupNavBar
currentPage={sidebarPages[sidebarIndex].key}
onClick={onSidebarClick}
/>
</div>
</>
)
}
export function TopGroupNavBar(props: { group: Group }) {
export function TopGroupNavBar(props: {
group: Group
currentPage: string
onClick: (key: string) => void
}) {
return (
<header className="sticky top-0 z-50 w-full pb-2 md:hidden lg:col-span-12">
<div className="flex items-center border-b border-gray-200 bg-white px-4">
<header className="sticky top-0 z-50 w-full border-b border-gray-200 md:hidden lg:col-span-12">
<div className="flex items-center bg-white px-4">
<div className="flex-shrink-0">
<Link href="/">
<a className="text-indigo-700 hover:text-gray-500 ">
@ -313,6 +317,7 @@ export function TopGroupNavBar(props: { group: Group }) {
</h1>
</div>
</div>
<GroupNavBar currentPage={props.currentPage} onClick={props.onClick} />
</header>
)
}