95 lines
3.5 KiB
TypeScript
95 lines
3.5 KiB
TypeScript
import { Box, Typography, useMediaQuery, useTheme } from "@mui/material";
|
||
import WideTemplCard from "@components/wideTemplCard";
|
||
import TemplCardPhonePink from "@components/templCardPhonePink";
|
||
import SectionWrapper from "@components/SectionWrapper";
|
||
import { PenaLink } from "@frontend/kitui";
|
||
import { Link as RouterLink } from "react-router-dom";
|
||
|
||
export default function Section2() {
|
||
const theme = useTheme();
|
||
const upMd = useMediaQuery(theme.breakpoints.up("md"));
|
||
|
||
return (
|
||
<SectionWrapper
|
||
component="section"
|
||
maxWidth="lg"
|
||
outerContainerSx={{
|
||
backgroundColor: theme.palette.bg.dark,
|
||
mb: "-90px",
|
||
}}
|
||
sx={{
|
||
pt: upMd ? "90px" : "50px",
|
||
pb: "20px",
|
||
}}
|
||
>
|
||
<Box
|
||
sx={{
|
||
display: "flex",
|
||
flexDirection: upMd ? "row" : "column",
|
||
gap: "3.5%",
|
||
}}
|
||
>
|
||
<Typography
|
||
variant="h4"
|
||
sx={{
|
||
flexGrow: 1,
|
||
flexBasis: "31%",
|
||
maxWidth: "50%",
|
||
}}
|
||
>
|
||
Интеграции, избавляющие от рутины
|
||
</Typography>
|
||
<Box
|
||
sx={{
|
||
display: "flex",
|
||
flexDirection: "column",
|
||
gap: "30px",
|
||
alignItems: "start",
|
||
flexGrow: 1,
|
||
flexBasis: "65.5%",
|
||
mt: upMd ? "10px" : "30px",
|
||
}}
|
||
>
|
||
<Typography maxWidth="560px">
|
||
Сервисы помогают предпринимателям, маркетологам и агентствам сделать интернет-маркетинг прозрачным и
|
||
эффективным. С нами не придется тратить рекламный бюджет впустую и терять клиентов на сайте.
|
||
</Typography>
|
||
<PenaLink component={RouterLink} to="/">
|
||
Подробнее
|
||
</PenaLink>
|
||
</Box>
|
||
</Box>
|
||
{upMd ? <WideTemplCard light={false} sx={{ marginTop: "76px" }} /> : <TemplCardPhonePink />}
|
||
|
||
{/*<Box sx={{*/}
|
||
{/* mt: upMd ? "93px" : "55px",*/}
|
||
{/* display: "flex",*/}
|
||
{/* flexWrap: "wrap",*/}
|
||
{/* justifyContent: "space-evenly",*/}
|
||
{/* columnGap: "40px",*/}
|
||
{/* rowGap: "50px",*/}
|
||
{/*}}>*/}
|
||
{/* <CardWithLink*/}
|
||
{/* headerText="Шаблонизатор"*/}
|
||
{/* text="Текст- это текст, который имеет некоторые характеристики реального письменного текс"*/}
|
||
{/* linkHref="#"*/}
|
||
{/* image={card1Image}*/}
|
||
{/* isHighlighted={!upMd}*/}
|
||
{/* />*/}
|
||
{/* <CardWithLink*/}
|
||
{/* headerText="Опросник"*/}
|
||
{/* text="Текст- это текст, который имеет некоторые характеристики реального письменного текс"*/}
|
||
{/* linkHref="#"*/}
|
||
{/* image={card2Image}*/}
|
||
{/* />*/}
|
||
{/* <CardWithLink*/}
|
||
{/* headerText="Сокращатель ссылок"*/}
|
||
{/* text="Текст- это текст, который имеет некоторые характеристики реального письменного текс"*/}
|
||
{/* linkHref="#"*/}
|
||
{/* image={card3Image}*/}
|
||
{/* />*/}
|
||
{/*</Box>*/}
|
||
</SectionWrapper>
|
||
);
|
||
}
|