🔧 Add layout to PageAlerts

code/frontend/src/routes/PageAlerts.js

@@ -1,12 +1,18 @@
 import React from "react"
 import Style from "./PageAlerts.module.css"
 import classNames from "classnames"
+import BoxWithHeader from "../components/BoxWithHeader"
 
 
 export default function PageAlerts({ children, className, ...props }) {
     return (
         <div className={classNames(Style.PageAlerts, className)} {...props}>
-            {children}
+            <BoxWithHeader header={"Your alerts"} className={Style.YourAlerts}>
+                a
+            </BoxWithHeader>
+            <BoxWithHeader header={"Create new alert"} className={Style.CreateAlert}>
+                b
+            </BoxWithHeader>
         </div>
     )
 }

code/frontend/src/routes/PageAlerts.module.css

@@ -1,3 +1,21 @@
 .PageAlerts {
+    display: grid;
 
+    grid-template-areas:
+        "a"
+        "b"
+    ;
+
+    grid-gap: 10px;
+
+    width: 100%;
+    height: 100%;
+}
+
+.YourAlerts {
+    grid-area: a;
+}
+
+.CreateAlert {
+    grid-area: b;
 }