import { IconButton, useTheme } from "@mui/material";
import SectionWrapper from "../SectionWrapper";
import MenuIcon from "@mui/icons-material/Menu";
import PenaLogo from "@ui_kit/PenaLogo";


interface Props {
    isLoggedIn: boolean;
}

export default function NavbarCollapsed({ isLoggedIn }: Props) {
    const theme = useTheme();

    return (
        <SectionWrapper
            component="nav"
            maxWidth="lg"
            outerContainerSx={{
                backgroundColor: theme.palette.navbarbg.main,
                position: "sticky",
                top: 0,
                zIndex: 1,
                // borderBottom: "1px solid #E3E3E3",
            }}
            sx={{
                height: "51px",
                py: "6px",
                display: "flex",
                justifyContent: "space-between",
                alignItems: "center",
            }}
        >
            <PenaLogo width={100} />
            <IconButton sx={{ p: 0, height: "30px", width: "30px", color: theme.palette.primary.main }}>
                <MenuIcon sx={{ height: "30px", width: "30px" }} />
            </IconButton>
        </SectionWrapper>
    );
}