src/layouts/page-layout/page.layout.tsx

import styles from "./page-layout.module.css";

import Head from "@layouts/head/head";

import { Group, Title } from "@mantine/core";

import type { PropsWithChildren } from "react";

export type PageLayoutProps = PropsWithChildren<{
  title: string;
}>;

const PageLayout = ({ children, title }: PageLayoutProps): JSX.Element => {
  return (
    <>
      <Head title={title} />
      <Group
        direction="column"
        spacing="xl"
        grow
        className={styles.group}
      >
        <Title>{title}</Title>
        <div style={{ minWidth: `100%` }}>{children}</div>
      </Group>
    </>
  );
};

export default PageLayout;