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>
|
|||
|
|
);
|
|||
|
|
};
|