105 lines
3.1 KiB
TypeScript
105 lines
3.1 KiB
TypeScript
|
import React from 'react';
|
|||
|
|
import Box from '@mui/material/Box';
|
|||
|
|
import {Typography} from "@mui/material";
|
|||
|
|
import SectionStyled from './SectionStyled';
|
|||
|
|
import {styled} from "@mui/material/styles";
|
|||
|
|
|
|||
|
|
const BoxCardBlog = styled('div')(({ theme }) => ({
|
|||
|
|
[theme.breakpoints.down('md')]: {
|
|||
|
|
width: '100%',
|
|||
|
|
maxWidth: 'none',
|
|||
|
|
},
|
|||
|
|
}));
|
|||
|
|
|
|||
|
|
function CardBlog () {
|
|||
|
|
return(
|
|||
|
|
<BoxCardBlog
|
|||
|
|
sx={{
|
|||
|
|
width: '360px',
|
|||
|
|
height: '292px',
|
|||
|
|
display: 'flex',
|
|||
|
|
flexDirection: 'column',
|
|||
|
|
backgroundColor: '#ffffff',
|
|||
|
|
borderRadius: '12px',
|
|||
|
|
marginBottom: '10px',
|
|||
|
|
|
|||
|
|
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
<Box
|
|||
|
|
sx={{
|
|||
|
|
width: '100%',
|
|||
|
|
height: '62%',
|
|||
|
|
backgroundColor: '#C8DADE',
|
|||
|
|
borderTopLeftRadius: '12px',
|
|||
|
|
borderTopRightRadius: '12px',
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</Box>
|
|||
|
|
<Box
|
|||
|
|
sx={{
|
|||
|
|
padding: '16px 20px',
|
|||
|
|
maxWidth: '100%',
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
<Typography color={"#4D4D4D"} fontSize={"16px"}>01.09.2022</Typography>
|
|||
|
|
<Typography variant='h6' fontSize='18px' color={"#4D4D4D"} maxWidth={"300px"}>Как продвигать квиз за 10 000 ₽ в месяц</Typography>
|
|||
|
|
</Box>
|
|||
|
|
</BoxCardBlog>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default function Component() {
|
|||
|
|
return(
|
|||
|
|
<SectionStyled tag={'section'} bg={'#f2f3f7'} mwidth={'1160px'}
|
|||
|
|
sxsect={{
|
|||
|
|
minHeight: '596px',
|
|||
|
|
}}
|
|||
|
|
sxcont={{
|
|||
|
|
display: 'flex',
|
|||
|
|
flexDirection: 'column',
|
|||
|
|
justifyContent: 'center',
|
|||
|
|
alignItems: 'center',
|
|||
|
|
padding: '10px',
|
|||
|
|
}}>
|
|||
|
|
<Box
|
|||
|
|
sx={{
|
|||
|
|
display: 'flex',
|
|||
|
|
alignItems: 'flex-start',
|
|||
|
|
width: '100%',
|
|||
|
|
flexDirection: 'column',
|
|||
|
|
|
|||
|
|
}}
|
|||
|
|
|
|||
|
|
>
|
|||
|
|
<Typography variant='h4' fontWeight={'500'}>Блог</Typography>
|
|||
|
|
<Box
|
|||
|
|
sx={{
|
|||
|
|
maxWidth: '361px',
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
<Typography
|
|||
|
|
sx={{fontSize: '18px',}}
|
|||
|
|
>
|
|||
|
|
Кейсы, дайджесты и отборные рекомендации
|
|||
|
|
</Typography>
|
|||
|
|
</Box>
|
|||
|
|
</Box>
|
|||
|
|
<Box
|
|||
|
|
sx={{
|
|||
|
|
display: "flex",
|
|||
|
|
justifyContent: 'space-between',
|
|||
|
|
alignItems: 'center',
|
|||
|
|
flexWrap: 'wrap',
|
|||
|
|
width: '100%',
|
|||
|
|
marginTop: '40px',
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
<CardBlog/>
|
|||
|
|
<CardBlog/>
|
|||
|
|
<CardBlog/>
|
|||
|
|
</Box>
|
|||
|
|
</SectionStyled>
|
|||
|
|
)
|
|||
|
|
}
|