mirror of
https://github.com/bubblecup-12/VogelSocialMedia.git
synced 2025-07-06 15:18:48 +00:00
remove old menu
This commit is contained in:
parent
ff141a8f7e
commit
e1bd6d3146
1 changed files with 2 additions and 33 deletions
|
@ -5,6 +5,7 @@ import Box from '@mui/material/Box';
|
||||||
import InboxIcon from "@mui/icons-material/Inbox";
|
import InboxIcon from "@mui/icons-material/Inbox";
|
||||||
import MailIcon from '@mui/icons-material/Mail';
|
import MailIcon from '@mui/icons-material/Mail';
|
||||||
import MenuIcon from '@mui/icons-material/Menu';
|
import MenuIcon from '@mui/icons-material/Menu';
|
||||||
|
import { Height } from "@mui/icons-material";
|
||||||
|
|
||||||
// TODO: Dinge so umstrukturieren, dass der State für das offene menü in Header ist und das Menü auch in Header, sodass es mit width 100% die volle breite einnehmen kann
|
// TODO: Dinge so umstrukturieren, dass der State für das offene menü in Header ist und das Menü auch in Header, sodass es mit width 100% die volle breite einnehmen kann
|
||||||
|
|
||||||
|
@ -24,7 +25,7 @@ function Header() {
|
||||||
<ListItem key={text} disablePadding>
|
<ListItem key={text} disablePadding>
|
||||||
<ListItemButton>
|
<ListItemButton>
|
||||||
<ListItemIcon>
|
<ListItemIcon>
|
||||||
{index % 2 === 0 ? <InboxIcon /> : <MailIcon />}
|
{React.createElement(iconList[index])}
|
||||||
</ListItemIcon>
|
</ListItemIcon>
|
||||||
<ListItemText primary={text} />
|
<ListItemText primary={text} />
|
||||||
</ListItemButton>
|
</ListItemButton>
|
||||||
|
@ -69,38 +70,6 @@ function Header() {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function Menu1({isOpen, toggleMenu, setIsOpen, iconRef}: any) {
|
|
||||||
const menuRef = useRef<HTMLDivElement>(null);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
function handleClickOutside(event: MouseEvent) {
|
|
||||||
if (menuRef.current && !menuRef.current.contains(event.target as Node) && !iconRef.current.contains(event.target as Node)) {
|
|
||||||
setIsOpen(false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
document.addEventListener("mousedown", handleClickOutside);
|
|
||||||
return () => {
|
|
||||||
document.removeEventListener("mousedown", handleClickOutside);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="menu-container">
|
|
||||||
<Menu
|
|
||||||
|
|
||||||
open={isOpen}
|
|
||||||
onClose={toggleMenu}
|
|
||||||
>
|
|
||||||
<MenuItem onClick={toggleMenu}>Option 1</MenuItem>
|
|
||||||
<MenuItem onClick={toggleMenu}>Option 2</MenuItem>
|
|
||||||
<MenuItem onClick={toggleMenu}>Option 3</MenuItem>
|
|
||||||
</Menu>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// EXPORT VARIABLES
|
// EXPORT VARIABLES
|
||||||
export default Header;
|
export default Header;
|
Loading…
Add table
Add a link
Reference in a new issue