initial commit

services/myblog/frontend/layout_auth/Layout.module.css

@@ -0,0 +1,10 @@
+.container {
+    display: grid;
+    grid-template-columns: 1fr auto 1fr;
+    grid-template-rows: 100px 1fr 100px;
+
+    min-height: 100vh;
+    grid-template-areas:
+		". . ."
+		". form .";
+}

services/myblog/frontend/layout_auth/Layout.props.ts

@@ -0,0 +1,5 @@
+import {DataHTMLAttributes, DetailedHTMLProps, HTMLAttributes, ReactNode} from "react";
+
+export interface LayoutProps {
+    children: ReactNode;
+}

services/myblog/frontend/layout_auth/Layout.tsx

@@ -0,0 +1,21 @@
+import {LayoutProps} from "./Layout.props";
+import styles from "./Layout.module.css"
+import cn from "classnames";
+import {Component, FunctionComponent} from "react";
+const Layout = ({ children }: LayoutProps): JSX.Element => {
+    return(
+        <div className={styles.container} >
+            {children}
+        </div>
+    );
+};
+
+export const withLayout = <T extends Record<string, unknown>>(Component: FunctionComponent<T>) => {
+    return function withLayoutComponent(props: T): JSX.Element {
+        return(
+            <Layout>
+                <Component {...props} />
+            </Layout>
+        );
+    };
+};