diff --git a/src/app/App.js b/src/app/App.js
index 618c37c..19dac47 100644
--- a/src/app/App.js
+++ b/src/app/App.js
@@ -55,7 +55,7 @@ function App() {
-
+
diff --git a/src/app/PageLayout.js b/src/app/PageLayout.js
index 9e62219..0d67ad2 100644
--- a/src/app/PageLayout.js
+++ b/src/app/PageLayout.js
@@ -1,16 +1,25 @@
import React from "react";
-import { Box, Button, IconButton, useColorMode } from "@chakra-ui/core";
+import { Box, Button, HStack, IconButton, useColorMode } from "@chakra-ui/core";
import { Link } from "react-router-dom";
import { useAuth0 } from "@auth0/auth0-react";
-import { MoonIcon, SunIcon } from "@chakra-ui/icons";
+import { ChevronLeftIcon, MoonIcon, SunIcon } from "@chakra-ui/icons";
import useCurrentUser from "./components/useCurrentUser";
-function PageLayout({ children }) {
+// TODO: Replace with lower-res version
+import HomepageSplashImg from "../images/homepage-splash.png";
+
+function PageLayout({ children, hideHomeLink }) {
return (
-
-
+
+ {!hideHomeLink && }
@@ -19,6 +28,47 @@ function PageLayout({ children }) {
);
}
+function HomeLink() {
+ return (
+
+
+
+
+
+
+
+ );
+}
+
function UserLoginLogout() {
const { isLoading, isAuthenticated, loginWithRedirect, logout } = useAuth0();
const { id, username } = useCurrentUser();
@@ -29,15 +79,15 @@ function UserLoginLogout() {
if (isAuthenticated) {
return (
-
+
{username && Hi, {username}!}
+
{id && (
@@ -46,17 +96,19 @@ function UserLoginLogout() {
size="sm"
variant="outline"
onClick={() => logout({ returnTo: window.location.origin })}
- marginLeft="2"
>
Log out
-
+
);
} else {
return (
-
+
+
+
+
);
}
}
@@ -71,7 +123,8 @@ function ColorModeToggleButton() {
}
icon={colorMode === "light" ? : }
onClick={toggleColorMode}
- variant="ghost"
+ variant="outline"
+ size="sm"
/>
);
}