feat: add license section
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import Main from './main/main';
|
import Main from './main/main';
|
||||||
import Offer from './offer/offer';
|
import Offer from './offer/offer';
|
||||||
import Result from './result/result';
|
import Result from './result/result';
|
||||||
// import License from './license/license';
|
import License from './license/license';
|
||||||
// import Contacts from './contacts/contacts';
|
// import Contacts from './contacts/contacts';
|
||||||
// import Footer from './footer/footer';
|
// import Footer from './footer/footer';
|
||||||
|
|
||||||
@@ -11,7 +11,7 @@ export default function HomePage() {
|
|||||||
<Main />
|
<Main />
|
||||||
<Offer />
|
<Offer />
|
||||||
<Result />
|
<Result />
|
||||||
{/*<License />*/}
|
<License />
|
||||||
{/*<Contacts />*/}
|
{/*<Contacts />*/}
|
||||||
{/*<Footer />*/}
|
{/*<Footer />*/}
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -1,2 +1,82 @@
|
|||||||
.License {
|
.License {
|
||||||
|
padding: 160px;
|
||||||
|
|
||||||
|
|
||||||
|
.Header {
|
||||||
|
font-family: $font-open-sans;
|
||||||
|
font-weight: $font-semi-bold;
|
||||||
|
font-size: 60px;
|
||||||
|
line-height: 100%;
|
||||||
|
color: $color-text;
|
||||||
|
margin-bottom: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Slider {
|
||||||
|
margin-bottom: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Form {
|
||||||
|
position: relative;
|
||||||
|
padding: 40px 60px;
|
||||||
|
background: #292E3D;
|
||||||
|
border-radius: 28px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
gap: 40px;
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
background-color: rgba(#163055, .6);
|
||||||
|
transition: 250ms background-color;
|
||||||
|
}
|
||||||
|
.Background {
|
||||||
|
position: absolute;
|
||||||
|
object-fit: cover;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Offer {
|
||||||
|
flex: 2;
|
||||||
|
.Title {
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
font-family: $font-open-sans;
|
||||||
|
font-weight: $font-regular;
|
||||||
|
font-size: 48px;
|
||||||
|
line-height: 110%;
|
||||||
|
color: $color-white;
|
||||||
|
margin: 0 0 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.SubTitle {
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
font-family: $font-open-sans;
|
||||||
|
font-weight: $font-light;
|
||||||
|
font-size: 30px;
|
||||||
|
line-height: 100%;
|
||||||
|
color: $color-white;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
max-width: 820px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.Inputs {
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@@ -1,5 +1,45 @@
|
|||||||
import s from './license.module.scss';
|
import s from './license.module.scss';
|
||||||
|
|
||||||
|
import { Button, Mark } from '@shared/ui';
|
||||||
|
|
||||||
|
import bgForm from '@public/images/bg-form.jpg';
|
||||||
|
import Image from 'next/image';
|
||||||
|
|
||||||
export default function License() {
|
export default function License() {
|
||||||
return <section className={s.License}>License</section>;
|
return (
|
||||||
|
<section className={s.License}>
|
||||||
|
<h2 className={s.Header}>
|
||||||
|
Наши услуги <Mark>подтверждены лицензиями</Mark> и сертификатами
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<div className={s.Slider}>Slider here</div>
|
||||||
|
|
||||||
|
<div className={s.Form}>
|
||||||
|
<div className={s.Offer}>
|
||||||
|
<Image
|
||||||
|
className={s.Background}
|
||||||
|
src={bgForm}
|
||||||
|
placeholder='blur'
|
||||||
|
alt={''}
|
||||||
|
quality={75}
|
||||||
|
fill
|
||||||
|
priority
|
||||||
|
/>
|
||||||
|
<h3 className={s.Title}>
|
||||||
|
Заключите договор до 1 июня и получите скидку на проведение пожарной
|
||||||
|
экспертизы 15 %
|
||||||
|
</h3>
|
||||||
|
<p className={s.SubTitle}>
|
||||||
|
Оставьте свои контактные данные и мы закрепим скидку до 1 июня за
|
||||||
|
вами
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className={s.Inputs}>
|
||||||
|
<input type='text' placeholder='Ваше имя' />
|
||||||
|
<input type='text' placeholder='+79991234567' />
|
||||||
|
<Button variant='orange'>Получить консультацию</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user