stacker.news/components/layout.js

63 lines
1.6 KiB
JavaScript

import Header, { HeaderStatic } from './header'
import Container from 'react-bootstrap/Container'
import Footer from './footer'
import Seo, { SeoSearch } from './seo'
import Search from './search'
import styles from './layout.module.css'
export default function Layout ({
sub, contain = true, footer = true, footerLinks = true,
containClassName = '', seo = true, item, user, children
}) {
return (
<>
{seo && <Seo sub={sub} item={item} user={user} />}
<Header sub={sub} />
{contain
? (
<Container as='main' className={`px-sm-0 ${containClassName}`}>
{children}
</Container>
)
: children}
{footer && <Footer links={footerLinks} />}
</>
)
}
export function SearchLayout ({ sub, children, ...props }) {
return (
<Layout sub={sub} seo={false} contain={false} {...props}>
<SeoSearch sub={sub} />
<Search sub={sub} />
<Container as='main' className='pt-3 pb-4 px-sm-0'>
{children}
</Container>
</Layout>
)
}
export function StaticLayout ({ children, footer = true, footerLinks, ...props }) {
return (
<div className={styles.page}>
<HeaderStatic />
<main className={`${styles.content} pt-5`}>
{children}
</main>
{footer && <Footer links={footerLinks} />}
</div>
)
}
export function CenterLayout ({ children, ...props }) {
return (
<div className={styles.page}>
<Layout contain={false} {...props}>
<main className={styles.content}>
{children}
</main>
</Layout>
</div>
)
}