2 files changed, 48 insertions, 0 deletions

diff --git a/src/web/components/app/App.css b/src/web/components/app/App.css
new file mode 100644
index 0000000..e211974
--- /dev/null
+++ b/src/web/components/app/App.css
@@ -0,0 +1,19 @@
+
+.content {
+    /* sticky footer */
+    flex-grow: 1;
+    flex-shrink: 0;
+
+    display: flex;
+    flex-direction: column;
+    align-items: left;
+
+    padding: 0;
+    background-color: var(--black-10);
+}
+
+@media (min-width: 40em) {
+    .content {
+        padding: 0em 0em 0em var(--menu-width);
+    }
+}
\ No newline at end of file
diff --git a/src/web/components/app/App.jsx b/src/web/components/app/App.jsx
new file mode 100644
index 0000000..ffd2cc7
--- /dev/null
+++ b/src/web/components/app/App.jsx
@@ -0,0 +1,29 @@
+import React from "react";
+import {Route, Routes} from "react-router-dom";
+
+import NavBar from "components/nav_bar/NavBar.jsx";
+import Forum from "components/forum/Forum.jsx";
+import NotFound from "components/not_found/NotFound.jsx";
+import Settings from "components/settings/Settings.jsx";
+import {UserContextProvider} from "contexts/UserContext.jsx";
+import {StateContextProvider} from "contexts/StateContext.jsx";
+
+import styles from "./App.css";
+
+export default function App() {
+    return (
+        <UserContextProvider>
+        <StateContextProvider>
+            <NavBar />
+            <main className={styles.content}>
+                <Routes>
+                    <Route path="/*" element={<Forum />} />
+                    <Route path="/settings/*" element={<Settings />} />
+
+                    <Route path="*" element={<NotFound />} />
+                </Routes>
+            </main>
+        </StateContextProvider>
+        </UserContextProvider>
+    );
+}