Create the base for the AddMenu page.

src/views/css/addMenu.css

@@ -0,0 +1,6 @@
+.AddMenu{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}

src/views/css/home.css

@@ -0,0 +1,5 @@
+.buttonBox{
+    position: absolute;
+    top: 15px;
+    right: 15px;
+}

src/views/css/index.css

@@ -1,3 +1,5 @@
+@import "./home.css";
+
 :root {
     --primary:     #6E4B3A;
     --secondary:   #3A5A85;
@@ -36,6 +38,7 @@ body{
     align-items: center;
     height: 100%;
     width: 100%;
+    position: relative;
 }
 
 .standardForm{
@@ -75,7 +78,13 @@ body{
 }
 
 .button.circle{
+    display: flex;
+    justify-content: center;
+    align-items: center;
     border-radius: 50%;
+    height: 50px;
+    width: 50px;
+    font-size: 35px;
 }
 
 .link, .standardForm .link{

src/views/js/index.js

@@ -4,6 +4,7 @@ import User from "./data/User.js";
 import Login from "./pages/Login.js";
 import Register from "./pages/Register.js";
 import Home from "./pages/Home.js";
+import AddMenu from "./pages/AddMenu.js";
 
 const pages = document.querySelector(".page");
 let currentPage;
@@ -16,6 +17,7 @@ window.changePage = (page, data)=>{
         case "login": currentPage = new Login(); break;
         case "register": currentPage = new Register(); break;
         case "home": currentPage = new Home(); break;
+        case "addMenu": currentPage = new AddMenu(); break;
     }
     console.timeEnd("change page");
 }
@@ -42,4 +44,4 @@ fetch("/api/user", {
     })
     .catch((err)=>{
         currentPage = new Login();
-    })
+    });

src/views/js/pages/AddMenu.js

@@ -0,0 +1,17 @@
+import Page from "./Page.js";
+import Elem from "../Elem.js";
+
+export default class AddMenu extends Page{
+    constructor(){
+        super("AddMenu");
+
+        this.render();
+    }
+
+    render(){
+        new Elem("button")
+            .text("New Account")
+            .onclick(()=>{changePage("createAccount")})
+            .appendTo(this.container);
+    }
+}

src/views/js/pages/Home.js

@@ -14,6 +14,7 @@ export default class Home extends Page{
             .append(new Elem("button")
                 .text("+")
                 .addClass("button", "circle")
+                .onclick(()=>{changePage("addMenu")})
             )
             .appendTo(this.container);
     }