diff --git a/public/images/logo-bogatyr.png b/public/images/logo-bogatyr.png new file mode 100644 index 0000000..fa68012 Binary files /dev/null and b/public/images/logo-bogatyr.png differ diff --git a/public/images/logo-chateau-de-talu.png b/public/images/logo-chateau-de-talu.png new file mode 100644 index 0000000..961aadf Binary files /dev/null and b/public/images/logo-chateau-de-talu.png differ diff --git a/public/images/logo-gazprom.png b/public/images/logo-gazprom.png new file mode 100644 index 0000000..4f32f57 Binary files /dev/null and b/public/images/logo-gazprom.png differ diff --git a/public/images/logo-kraspol.png b/public/images/logo-kraspol.png new file mode 100644 index 0000000..d29f75a Binary files /dev/null and b/public/images/logo-kraspol.png differ diff --git a/public/images/logo-sochipark.png b/public/images/logo-sochipark.png new file mode 100644 index 0000000..2c46237 Binary files /dev/null and b/public/images/logo-sochipark.png differ diff --git a/src/views/home/ui/contacts/contacts.module.scss b/src/views/home/ui/contacts/contacts.module.scss index 170e846..cc1ef9b 100644 --- a/src/views/home/ui/contacts/contacts.module.scss +++ b/src/views/home/ui/contacts/contacts.module.scss @@ -1,3 +1,119 @@ .Contacts { + background: $color-lightgray; + border-radius: 28px; + 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; + } + + .Clients { + margin: 0 auto; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-around; + align-items: center; + gap: 40px; + max-width: 1200px; + margin-bottom: 160px; + + .Client { + + img { + width: 300px; + height: auto; + } + } + } + + .Form { + background: $color-white; + border-radius: 28px; + display: flex; + flex-direction: row; + padding: 60px 50px; + margin-bottom: 80px; + + .Offer { + flex: 2; + display: flex; + flex-direction: column; + + + .Title { + font-family: $font-open-sans; + font-weight: $font-semi-bold; + font-size: 48px; + line-height: 100%; + color: $color-text-light; + margin-bottom: 80px; + } + + .SubTitle { + font-family: $font-open-sans; + font-weight: $font-light; + font-size: 32px; + line-height: 100%; + color: $color-text-light; + max-width: 720px; + } + } + + .Inputs { + flex: 1; + display: flex; + flex-direction: column; + align-items: flex-start; + } + } + + .Map { + position: relative; + + iframe { + border-radius: 28px; + } + + .Contacts{ + position: absolute; + z-index: 2; + top: -40px; + right: 180px; + border-radius: 28px; + background: $color-white; + width: 440px; + height: 540px; + padding: 40px 35px; + + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: flex-start; + + .Title{ + font-family: $font-open-sans; + font-weight: $font-semi-bold; + font-size: 48px; + line-height: 100%; + color: $color-text; + text-align: right; + margin-bottom: 32px; + align-self: center; + } + .Address { + font-family: $font-open-sans; + font-weight: $font-regular; + font-size: 32px; + line-height: 130%; + color: $color-text; + margin-bottom: 32px; + } + } + } } \ No newline at end of file diff --git a/src/views/home/ui/contacts/contacts.tsx b/src/views/home/ui/contacts/contacts.tsx index f5d2d4d..da1c3d1 100644 --- a/src/views/home/ui/contacts/contacts.tsx +++ b/src/views/home/ui/contacts/contacts.tsx @@ -1,5 +1,74 @@ import s from './contacts.module.scss'; +import { Button, Mark } from '@shared/ui'; + +import Image from 'next/image'; + +import bogatyrLogo from '@public/images/logo-bogatyr.png'; +import sochiparkLogo from '@public/images/logo-sochipark.png'; +import chateauLogo from '@public/images/logo-chateau-de-talu.png'; +import gazpromLogo from '@public/images/logo-gazprom.png'; +import kraspolLogo from '@public/images/logo-kraspol.png'; export default function Contacts() { - return
Contacts
; + return ( +
+

+ Клиенты, которые нам доверяют +

+
+ {clientsLogos.map(({ logo }, idx) => ( +
+ +
+ ))} +
+ +
+
+

Остались вопросы?

+

+ Наш эксперт свяжется с вами для уточнения подробностей и определения + точной стоимости работ +

+
+
+ + + +
+
+ +
+ + +
+

+ Мы всегда
на связи +

+

+ Краснодарский край
+ г.Сочи
+ ТЦ «Атриум»
+ ул. Навагинская д.9«Д»
+ этаж 3, офис 35 +

+

+7 (988) 400 93 93

+

office@firecheck.ru

+
+
+
+ ); } + +const clientsLogos = [ + { logo: bogatyrLogo }, + { logo: sochiparkLogo }, + { logo: chateauLogo }, + { logo: gazpromLogo }, + { logo: kraspolLogo }, +]; diff --git a/src/views/home/ui/footer/footer.module.scss b/src/views/home/ui/footer/footer.module.scss index 30558fb..bc97d22 100644 --- a/src/views/home/ui/footer/footer.module.scss +++ b/src/views/home/ui/footer/footer.module.scss @@ -1,2 +1,36 @@ .Footer { + background-color: #1B1B25; + padding: 80px 160px; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: flex-start; + gap: 20px; + + .Header { + font-family: $font-open-sans; + font-weight: $font-semi-bold; + font-size: 60px; + line-height: 100%; + color: $color-white; + margin-bottom: 40px; + } + + .Bottom { + width: 100%; + height: 80px; + border-top: 1px solid $color-white; + display: flex; + flex-direction: row; + align-items: center; + + .Policy { + font-family: $font-open-sans; + font-weight: $font-regular; + font-size: 16px; + line-height: 100%; + color: $color-white; + margin-left: auto; + } + } } \ No newline at end of file diff --git a/src/views/home/ui/footer/footer.tsx b/src/views/home/ui/footer/footer.tsx index d5c1ce4..b19bb9a 100644 --- a/src/views/home/ui/footer/footer.tsx +++ b/src/views/home/ui/footer/footer.tsx @@ -1,5 +1,27 @@ import s from './footer.module.scss'; +import { Button, Mark } from '@shared/ui'; export default function Footer() { - return
Footer
; + return ( +
+

+ Давайте обсудим ваши задачи +

+ + + + + +
+
TG
+
WA
+
+7 999 1234567
+

Политика конфиденциальности

+
+
+ ); } diff --git a/src/views/home/ui/home.tsx b/src/views/home/ui/home.tsx index 61f5f74..f5ac30d 100644 --- a/src/views/home/ui/home.tsx +++ b/src/views/home/ui/home.tsx @@ -2,8 +2,8 @@ import Main from './main/main'; import Offer from './offer/offer'; import Result from './result/result'; import License from './license/license'; -// import Contacts from './contacts/contacts'; -// import Footer from './footer/footer'; +import Contacts from './contacts/contacts'; +import Footer from './footer/footer'; export default function HomePage() { return ( @@ -12,8 +12,8 @@ export default function HomePage() { - {/**/} - {/*