import { FC } from "react"
import Head from "next/head"
import { Flex, Paper } from "@mantine/core"
import Header from "./ui/Header"

interface MainLayoutProps {
  children: React.ReactNode
}

const MainLayout: FC<MainLayoutProps> = ({ children }) => {
  return (
    <div>
      <Head>
        <title>Мегафон — фронт-офис · лендинги</title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
      </Head>
      <Flex direction="column" h="100vh" mih={0} style={{ overflow: "hidden" }}>
        <Paper withBorder p="xs" radius={0}>
          <Header title="Мегафон — фронт-офис" />
        </Paper>
        {children}
      </Flex>
    </div>
  )
}

export default MainLayout
