2023-10-04 22:21:17 +00:00
|
|
|
|
import React from 'react';
|
|
|
|
|
import Box from '@mui/material/Box';
|
|
|
|
|
import Button from '@mui/material/Button';
|
|
|
|
|
import SectionStyled from './SectionStyled';
|
|
|
|
|
import PenaLogo from "../../ui_kit/PenaLogo";
|
|
|
|
|
import NavMenuItem from "@ui_kit/Header/NavMenuItem";
|
|
|
|
|
|
|
|
|
|
const buttonMenu = ['Меню 1', 'Меню 2', 'Меню 3', 'Меню 4', 'Меню 5', 'Меню 1', 'Меню 2']
|
|
|
|
|
|
|
|
|
|
export default function Component() {
|
|
|
|
|
const [select, setSelect] = React.useState(0)
|
|
|
|
|
return (
|
|
|
|
|
<SectionStyled tag={'header'} bg={'#F2F3F7'} mwidth={'1160px'}
|
|
|
|
|
sxsect={{
|
|
|
|
|
minHeight: '80px',
|
|
|
|
|
borderBottom: '1px solid #E3E3E3',
|
|
|
|
|
position: "relative",
|
|
|
|
|
zIndex: 3
|
|
|
|
|
}}
|
|
|
|
|
sxcont={{
|
|
|
|
|
display: 'flex',
|
|
|
|
|
justifyContent: 'space-between',
|
|
|
|
|
alignItems: 'center',
|
|
|
|
|
padding: '0 10px'
|
|
|
|
|
}}>
|
|
|
|
|
<PenaLogo width={150} />
|
|
|
|
|
<Box
|
|
|
|
|
sx={{
|
|
|
|
|
maxWidth: '595px',
|
|
|
|
|
width: '100%',
|
|
|
|
|
display: 'flex',
|
|
|
|
|
justifyContent: 'space-between',
|
|
|
|
|
flexWrap: 'wrap',
|
|
|
|
|
marginRight: "138px",
|
|
|
|
|
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
{buttonMenu.map( (element, index) => (
|
|
|
|
|
<NavMenuItem
|
|
|
|
|
text={element}
|
|
|
|
|
// component={Link}
|
|
|
|
|
// to={url}
|
|
|
|
|
key={index}
|
|
|
|
|
onClick={() => {
|
|
|
|
|
setSelect(index);
|
|
|
|
|
}}
|
|
|
|
|
isActive={select === index}
|
|
|
|
|
/>
|
|
|
|
|
))}
|
|
|
|
|
</Box>
|
|
|
|
|
<Button variant="outlined"
|
|
|
|
|
sx={{
|
|
|
|
|
color: 'black',
|
|
|
|
|
border: '1px solid black',
|
|
|
|
|
textTransform: 'none',
|
|
|
|
|
fontWeight: '400',
|
|
|
|
|
fontSize: '18px',
|
|
|
|
|
lineHeight: '24px',
|
|
|
|
|
borderRadius: '8px',
|
|
|
|
|
padding: '8px 17px',
|
|
|
|
|
}}
|
2023-10-07 07:09:00 +00:00
|
|
|
|
>Предрегистрация</Button>
|
2023-10-04 22:21:17 +00:00
|
|
|
|
</SectionStyled>
|
|
|
|
|
)
|
|
|
|
|
}
|