diff --git a/src/client/src/components/Appbar.js b/src/client/src/components/Appbar.js
deleted file mode 100644
index b6f439f..0000000
--- a/src/client/src/components/Appbar.js
+++ /dev/null
@@ -1,68 +0,0 @@
-import * as React from "react";
-import { BrowserRouter as Router, Link, Route, Routes, History } from "react-router-dom";
-import { AppBar, Typography, Toolbar, CssBaseline, Box, Button, IconButton, Grid, Menu, MenuItem } from "@mui/material"
-import MenuIcon from '@mui/icons-material/Menu';
-import logo from "./../Asura2222.png";
-
-export default function Appbar(props) {
-  const [auth, setAuth] = React.useState(true);
-  const [anchorEl, setAnchorEl] = React.useState(null);
-
-  const handleMenu = (event) => {
-    setAnchorEl(event.currentTarget);
-  };
-
-  const handleClose = () => {
-    setAnchorEl(null);
-  };
-
-    return (
-    <>
-    <CssBaseline />
-      <AppBar position="static" color="primary">
-        <Toolbar>
-          <Box sx={{ flexGrow: 1 }}>
-            <Grid container spacing={2} justifyContent="space-between" alignItems="center" align="center">
-              <Grid item xs={2}>
-                  <Link to="/">
-                    <img sx={{width: "10%"}} src={logo} alt="Tournament logo" className="mainIcon"></img>
-                  </Link>
-                  
-                  <Typography variant="h6" component="div">
-                    <Link to="/" style={{ color:'white'}}>
-                      Home
-                    </Link>
-                  </Typography>
-              </Grid>
-              <Grid item xs={8}>
-                <Typography component="div"><h2>{props.pageTitle || ""}</h2></Typography>
-              </Grid>
-              <Grid item xs={2}>
-                <IconButton size="large" edge="start" color="inherit" aria-label="menu" sx={{ width: "5%", padding: "5% 10%" }} onClick={handleMenu}>
-                  <MenuIcon />
-                </IconButton>
-                <Menu anchorEl={anchorEl} anchorOrigin={{vertical: 'bottom',horizontal: 'right',}} keepMounted transformOrigin={{vertical: 'top',horizontal: 'right',}} open={Boolean(anchorEl)} onClose={handleClose}>
-                  <MenuItem onClick={handleClose}>
-                    <Link to="/">
-                      Logout
-                    </Link>
-                  </MenuItem>
-                  <MenuItem onClick={handleClose}>
-                    <Link to="/create">
-                      Account
-                    </Link>
-                  </MenuItem>
-                  <MenuItem onClick={handleClose}>
-                    <Link to="/history">
-                      History
-                    </Link>
-                  </MenuItem>
-                </Menu>
-              </Grid>
-            </Grid>
-          </Box>
-        </Toolbar>
-      </AppBar>
-    </>
-    );
-}
\ No newline at end of file
diff --git a/src/client/src/components/AsuraBar.js b/src/client/src/components/AsuraBar.js
new file mode 100644
index 0000000..d1678b9
--- /dev/null
+++ b/src/client/src/components/AsuraBar.js
@@ -0,0 +1,81 @@
+import * as React from "react";
+import { BrowserRouter as Router, Link, Route, Routes, History } from "react-router-dom";
+import { AppBar, Typography, Toolbar, CssBaseline, Box, Button, IconButton, Grid, Menu, MenuItem, Container } from "@mui/material"
+import MenuIcon from '@mui/icons-material/Menu';
+import AccountCircleIcon from '@mui/icons-material/AccountCircle';
+import HistoryIcon from '@mui/icons-material/History';
+import LogoutIcon from '@mui/icons-material/Logout';
+import logo from "./../Asura2222.png";
+
+function loggedInMenu() {
+  const [anchorEl, setAnchorEl] = React.useState(null);
+  const open = Boolean(anchorEl);
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+  };
+  const handleClose = () => {
+    setAnchorEl(null);
+  };
+  return (
+    <>
+      <IconButton size="large" edge="start" color="inherit" aria-label="menu"  onClick={handleClick}>
+        <MenuIcon />
+        </IconButton>
+        <Menu anchorEl={anchorEl} open={open} onClose={handleClose} MenuListProps={{'aria-labelledby': 'basic-button',}} sx={{position:"absolute"}}>
+          <Link to="/" style={{color:"black"}}><MenuItem onClick={handleClose}><Button endIcon={<AccountCircleIcon />}>Profile</Button></MenuItem></Link>
+          <Link to="/history" style={{color:"black"}}><MenuItem onClick={handleClose}><Button endIcon={<HistoryIcon />}>History</Button></MenuItem></Link>
+          <Link to="/logout" style={{color:"black"}}><MenuItem onClick={handleClose}><Button endIcon={<LogoutIcon />}>Logout</Button></MenuItem></Link>
+      </Menu> 
+    </> 
+  );  
+}
+
+function notLoggedInButton() {
+  return (
+    <>
+    <Link to="/create" style={{color:"white"}}>
+      <Button sx={{color:"white"}}>
+        Login
+        </Button>
+      </Link>
+    </>
+  );
+}
+
+export default function Appbar(props) {
+  const isLoggedIn = true;
+
+    return (
+    <>
+    <CssBaseline />
+      <AppBar position="static" color="primary">
+        <Toolbar>
+          <Box sx={{ flexGrow: 1 }}>
+            <Grid container spacing={2} justifyContent="space-between" alignItems="center" align="center">
+              <Grid item xs={2}>
+              <Box sx={{ width:"100%", height: "100%", justifyContent:"left", align: "center", alignItems:"center", margin: "none", padding: "none", color: "white" ,display: "flex", flexFlow: "row"}}>
+                <Link to="/">
+                  <img sx={{width: "10%"}} src={logo} alt="Tournament logo" className="mainIcon"></img>
+                </Link>
+                  { props.pageTitle !== "Asura Tournaments" &&
+                  <Link to="/" style={{color:"white"}}>
+                    <Typography component="div" align="center">
+                          Home
+                    </Typography>
+                  </Link>
+                  }
+              </Box>
+              </Grid>    
+              <Grid item xs={8}>
+                <Typography component="div"><h2>{props.pageTitle || ""}</h2></Typography>
+              </Grid>
+              <Grid item xs={2}>
+                  { isLoggedIn ? <loggedInMenu /> : <notLoggedInButton /> } 
+              </Grid>
+            </Grid>
+          </Box>
+        </Toolbar>
+      </AppBar>
+    </>
+    );
+}
\ No newline at end of file