a bunch of aesthetics and also create user http requests

db_app/src/components/Menus.js

@@ -1,43 +1,50 @@
 import React,{useState} from 'react';
 import {Routes, Route, useNavigate} from 'react-router-dom';
 import './Login.css';
+import Button from "@mui/material/Button";
+import Card from "@mui/material/Card";
+import TextField from "@mui/material/TextField";
+import FormControlLabel from "@mui/material/FormControlLabel";
+import Checkbox from "@mui/material/Checkbox";
+import Link from "@mui/material/Link";
+import Grid from "@mui/material/Grid";
+import Box from "@mui/material/Box";
+import Typography from "@mui/material/Typography";
+import Container from "@mui/material/Container";
+import AppBar from '@mui/material/AppBar';
+import Toolbar from '@mui/material/Toolbar';
+import IconButton from '@mui/material/IconButton';
+import Avatar from '@mui/material/Avatar';
+import Tooltip from '@mui/material/Tooltip';
+import Menu from '@mui/material/Menu';
+import MenuIcon from '@mui/material/Menu'
+import MenuItem from '@mui/material/MenuItem';
+import {red, green, lightBlue, lightGreen} from '@mui/material/colors';
+import { ThemeProvider, createTheme } from '@mui/material/styles';
+
+const theme = createTheme({
+    palette: {
+      primary: {
+        main: lightGreen[700],
+      },
+    },
+  });
 
 function Menus() {
-
-    const navigate = useNavigate();
-
-	const navigateLogin = () => {
-		 navigate('/');
-	}
-
-  const [data,setData] = useState({
-    username:"",
-    password:"",
-    email:"",
-  })
-  
-  const {username,password,email} = data;
-  
-  const changeHandler = e => {
-    setData({...data,[e.target.name]:[e.target.value]});
-  }
-  
-  const submitHandler = e => {
-    e.preventDefault();
-    console.log(data);
-  }
  
+
+  return (
+
+    <ThemeProvider theme={theme}>
+    <AppBar position="static">
+  <Toolbar variant="dense">
+    <Button variant="h6" color="inherit" component="div">
+      Photos
+    </Button>
+  </Toolbar>
+</AppBar>
+</ThemeProvider>
   
-    return (
-      <div>
-        <center>
-          <h1>Menus</h1>
-        
-    
-        </center>
-      </div>
-  
-    );
-  }
-  
-  export default Menus;
+  );
+}
+export default Menus;