2023-02-06 12:19:39 +03:00

41 lines
954 B
JavaScript

/* eslint-disable react/forbid-component-props */
import styles from './Logo.module.css';
import { min } from '@/styles/mq';
import Image from 'next/image';
import logo from 'public/assets/images/logo-primary.svg';
import styled from 'styled-components';
import { Flex } from 'ui';
const ImageWrapper = styled.div`
width: 100px;
${min('laptop')} {
width: 135px;
}
`;
const LogoText = styled.h3`
margin: 0;
text-transform: uppercase;
color: #fff;
font-size: 0.85rem;
font-family: 'Montserrat';
font-weight: 500;
${min('laptop')} {
font-size: 1.2rem;
}
`;
function Logo() {
return (
<Flex flexDirection="column" alignItems="flex-start" justifyContent="space-between">
<ImageWrapper>
<Image priority className={styles.logo} alt="logo" src={logo} layout="responsive" />
</ImageWrapper>
<LogoText>Лизинговый Калькулятор</LogoText>
</Flex>
);
}
export default Logo;