import { makeStyles } from '@material-ui/core' import React, { useState } from 'react'; import { styled } from '@mui/material/styles'; import Avatar from '@mui/material/Avatar'; import Menu from '@mui/material/Menu'; import MenuItem from '@mui/material/MenuItem'; import ChatIcon from '@mui/icons-material/Chat'; import PermContactCalendarIcon from '@mui/icons-material/PermContactCalendar'; import ModeEditOutlineOutlinedIcon from '@mui/icons-material/ModeEditOutlineOutlined'; import CloseIcon from '@mui/icons-material/Close'; import PersonAddAltIcon from '@mui/icons-material/PersonAddAlt'; const StyledMenu = styled((props:any) => (
))(({ theme }:any) => ({ '& .MuiPaper-root': { borderRadius: 10, marginTop: theme.spacing(-2), minWidth: 220, color: theme.palette.mode === 'light' ? 'rgb(55, 65, 81)' : theme.palette.grey[500], boxShadow: 'rgb(255, 255, 255) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px', '& .MuiMenu-list': { padding: '8px 8px', }, '& .MuiMenuItem-root': { marginBottom: theme.spacing(1), '& .MuiSvgIcon-root': { fontSize: 21, color: theme.palette.text.secondary, marginRight: theme.spacing(4), } }, }, })); const useStyles = makeStyles({ container: { position: 'absolute', maxWidth: '100%', top: '92vh', right: 20, zIndex: 10, cursor:'pointer' }, }) interface ISmallMenuBar { handleSelectedMenu:(i:number) => void, setIsMenuSm:React.Dispatch