52 lines
1.2 KiB
TypeScript
52 lines
1.2 KiB
TypeScript
import { Button, Typography, useMediaQuery, useTheme } from "@mui/material";
|
||
import AmoLogo from "../../assets/icons/Amologo.png";
|
||
import { FC } from "react";
|
||
|
||
type AmoButtonProps = {
|
||
onClick?: () => void;
|
||
};
|
||
|
||
export const AmoButton: FC<AmoButtonProps> = ({ onClick }) => {
|
||
const theme = useTheme();
|
||
const isMobile = useMediaQuery(theme.breakpoints.down(600));
|
||
return (
|
||
<Button
|
||
style={{
|
||
backgroundColor: "#329dc9",
|
||
width: isMobile ? "270px" : "310px",
|
||
height: "47px",
|
||
display: "inline-flex",
|
||
justifyContent: "start",
|
||
border: "#316a88 1px solid",
|
||
color: "white",
|
||
textDecoration: "none",
|
||
cursor: "pointer",
|
||
}}
|
||
onClick={onClick}
|
||
>
|
||
<img
|
||
src={AmoLogo}
|
||
style={{
|
||
height: "100%",
|
||
maxWidth: "339px",
|
||
objectFit: "scale-down",
|
||
userSelect: "none",
|
||
pointerEvents: "none",
|
||
}}
|
||
alt={"AmoCRM"}
|
||
/>
|
||
<Typography
|
||
sx={{
|
||
margin: "auto",
|
||
letterSpacing: "1px",
|
||
fontSize: "14px",
|
||
fontWeight: 600,
|
||
textTransform: "uppercase",
|
||
}}
|
||
>
|
||
Подключить
|
||
</Typography>
|
||
</Button>
|
||
);
|
||
};
|