layout.tsx46 lines · main
1import Image from 'next/image'
2import { PropsWithChildren, ReactNode } from 'react'
3import { cn, Separator } from 'ui'
4
5import { UserDropdown } from '@/components/interfaces/UserDropdown'
6import { FeedbackDropdown } from '@/components/layouts/Navigation/LayoutHeader/FeedbackDropdown/FeedbackDropdown'
7import { BASE_PATH } from '@/lib/constants'
8
9export const ProjectClaimLayout = ({
10 children,
11 title,
12 className,
13}: PropsWithChildren<{
14 title: ReactNode
15 className?: string
16}>) => {
17 return (
18 <>
19 <div className="flex flex-row justify-between mx-auto w-full h-[52px] items-center px-4">
20 <div className="flex items-center gap-2">
21 <span className="sr-only">Briven</span>
22 <Image
23 src={`${BASE_PATH}/img/briven-logo.svg`}
24 alt="Briven Logo"
25 height={20}
26 width={20}
27 />
28 <span className="truncate">{title}</span>
29 </div>
30 <div className="flex items-center gap-x-2">
31 <FeedbackDropdown className="hidden xs:flex" />
32 <UserDropdown />
33 </div>
34 </div>
35 <Separator />
36 <div
37 className={cn(
38 'overflow-y-auto max-h-[calc(100vh-70px)] flex justify-center grow',
39 className
40 )}
41 >
42 <div className="w-full h-full max-w-md">{children}</div>
43 </div>
44 </>
45 )
46}