2023-03-26 16:50:46 +02:00
|
|
|
import Head from 'next/head'
|
|
|
|
|
import { Header } from 'site/components/header/index.mjs'
|
|
|
|
|
import { Footer } from 'shared/components/footer/index.mjs'
|
|
|
|
|
import { Search } from 'site/components/search.mjs'
|
2022-05-25 18:35:20 +02:00
|
|
|
|
2023-03-26 16:50:46 +02:00
|
|
|
export const LayoutWrapper = ({ app, children = [], search, setSearch, noSearch = false }) => {
|
2022-05-25 18:35:20 +02:00
|
|
|
return (
|
2022-12-03 11:25:02 -06:00
|
|
|
<div
|
|
|
|
|
className={`
|
2022-05-25 18:35:20 +02:00
|
|
|
flex flex-col justify-between
|
|
|
|
|
min-h-screen
|
|
|
|
|
bg-base-100
|
2022-12-03 11:25:02 -06:00
|
|
|
`}
|
|
|
|
|
>
|
2023-03-26 16:50:46 +02:00
|
|
|
<Head>
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
|
|
|
</Head>
|
2022-05-25 18:35:20 +02:00
|
|
|
<Header app={app} setSearch={setSearch} />
|
|
|
|
|
<main className="grow">{children}</main>
|
|
|
|
|
{!noSearch && search && (
|
|
|
|
|
<>
|
2022-12-03 11:25:02 -06:00
|
|
|
<div
|
|
|
|
|
className={`
|
2022-05-25 18:35:20 +02:00
|
|
|
fixed w-full max-h-screen bg-base-100 top-0 z-30 pt-0 pb-16 px-8
|
|
|
|
|
md:rounded-lg md:top-24
|
|
|
|
|
md:max-w-xl md:m-auto md:inset-x-12
|
|
|
|
|
md:max-w-2xl
|
|
|
|
|
lg:max-w-4xl
|
2022-12-03 11:25:02 -06:00
|
|
|
`}
|
|
|
|
|
>
|
|
|
|
|
<Search app={app} search={search} setSearch={setSearch} />
|
|
|
|
|
</div>
|
|
|
|
|
<div className="fixed top-0 left-0 w-full min-h-screen bg-neutral z-20 bg-opacity-70"></div>
|
2022-05-25 18:35:20 +02:00
|
|
|
</>
|
|
|
|
|
)}
|
2023-03-26 16:50:46 +02:00
|
|
|
<Footer app={app} />
|
2022-05-25 18:35:20 +02:00
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
