Merge branch 'dev' into 'staging'

добавлена кнопка подробнее на карточку наши продукты и ссылка на услуги в лендинге

See merge request frontend/marketplace!116

src/components/templCardPhoneLight.tsx

@@ -5,9 +5,10 @@ interface Props {
 	name?: string;
 	desc?: string;
 	image?: string;
+	href?: string;
 }
 
-export default function TemplCardPhoneLight({name="PenaDoc", desc="Самый удобный сервис для автоматизации документооборота и заполнения однотипных документов", image = card1Image }: Props) {
+export default function TemplCardPhoneLight({name="PenaDoc", desc="Самый удобный сервис для автоматизации документооборота и заполнения однотипных документов", image = card1Image, href = "#" }: Props) {
 	const theme = useTheme()
 	const upMd = useMediaQuery(theme.breakpoints.up("md"))
 	const isMobile = useMediaQuery(theme.breakpoints.down(600))
@@ -54,7 +55,11 @@ export default function TemplCardPhoneLight({name="PenaDoc", desc="Самый у
 					{desc}
 				</Typography>
 
-				<Button variant="pena-contained-light">Подробнее</Button>
+				<Button
+					variant="pena-contained-light"
+					target={"_blank"}
+					href={href}>
+				Подробнее</Button>
 			</Box>
 		</Box>
 	)

src/components/wideTemplCard.tsx

@@ -9,9 +9,10 @@ interface Props {
   name?: string;
   desc?: string;
   image?: string;
+  href?: string;
 }
 
-export default function WideTemplCard({ light = true, sx, name="PenaDoc", desc="Самый удобный сервис для автоматизации документооборота и заполнения однотипных документов", image = cardImageBig }: Props) {
+export default function WideTemplCard({ light = true, sx, name="PenaDoc", desc="Самый удобный сервис для автоматизации документооборота и заполнения однотипных документов", image = cardImageBig, href="#" }: Props) {
 	const theme = useTheme()
 	const isTablet = useMediaQuery(theme.breakpoints.down(1000))
 
@@ -21,8 +22,7 @@ export default function WideTemplCard({ light = true, sx, name="PenaDoc", desc="
 				position: "relative",
 				display: "flex",
 				justifyContent: "space-between",
-				py: "40px",
-				px: "20px",
+				p: "40px 20px 20px 20px",
 				backgroundColor: light ? "#E6E6EB" : "#434657",
 				borderRadius: "12px",
 				...sx,
@@ -33,12 +33,19 @@ export default function WideTemplCard({ light = true, sx, name="PenaDoc", desc="
 					display: "flex",
 					flexDirection: "column",
 					alignItems: "start",
+					justifyContent: "space-between"
 				}}
 			>
 				<Typography variant="h5">{name}</Typography>
-				<Typography sx={{ marginTop: isTablet ? "10px" : "20px" }} maxWidth="552px">
+				<Typography maxWidth="552px">
 					{desc}
 				</Typography>
+				<Button sx={{ width: "180px", height: "44px", p: 0 }}
+						variant="pena-contained-light"
+						target={"_blank"}
+						href={href}>
+					Подробнее
+				</Button>
 			</Box>
 			<img
 				src={image}

src/pages/Landing/Section5.tsx

@@ -47,7 +47,10 @@ export default function Section5() {
 						gap: upMd ? "24px" : "20px",
 					}}
 				>
-					<Button sx={{ width: "180px", height: "44px", p: 0 }} variant="pena-contained-light">
+					<Button sx={{ width: "180px", height: "44px", p: 0 }}
+							variant="pena-contained-light"
+							target={"_blank"}
+							href={"https://pena.digital/"}>
             Наши услуги
 					</Button>
 				</Box>

src/pages/Tariffs/Tariffs.tsx

@@ -85,7 +85,22 @@ export default function Tariffs() {
 			</Typography>
 
 			{/*{upMd ? <WideTemplCard sx={{ marginTop: "55px" }} /> : <TemplCardPhoneLight />}*/}
-			{upMd ? <WideTemplCard sx={{ marginTop: "55px" }} name={"PenaQuiz"} desc={"Конструктор quiz опросов, для любых видов исследований и quiz маркетинга, арбитража трафика"} image={CardImage2}/> : <TemplCardPhoneLight name={"PenaQuiz"} desc={"Конструктор quiz опросов, для любых видов исследований и quiz маркетинга, арбитража трафика"} image={CardImage2}/>}
+			{upMd ?
+				<WideTemplCard
+					sx={{ marginTop: "55px" }}
+					name={"PenaQuiz"}
+					desc={"Конструктор quiz опросов, для любых видов исследований и quiz маркетинга, арбитража трафика"}
+					image={CardImage2}
+					href={"https://quiz.pena.digital"}
+				/>
+				:
+				<TemplCardPhoneLight
+					name={"PenaQuiz"}
+					desc={"Конструктор quiz опросов, для любых видов исследований и quiz маркетинга, арбитража трафика"}
+					image={CardImage2}
+					href={"https://quiz.pena.digital"}
+				/>
+			}
 		</SectionWrapper>
 	)
 }