diff --git a/public/svg/ru-krd-map.svg b/public/svg/ru-krd-map.svg new file mode 100644 index 0000000..5761e23 --- /dev/null +++ b/public/svg/ru-krd-map.svg @@ -0,0 +1,9 @@ + + \ No newline at end of file diff --git a/public/yandex_eb592d0a9916552a.html b/public/yandex_eb592d0a9916552a.html new file mode 100644 index 0000000..2d9ba3c --- /dev/null +++ b/public/yandex_eb592d0a9916552a.html @@ -0,0 +1,6 @@ + +
+ + +Verification: eb592d0a9916552a + \ No newline at end of file diff --git a/src/views/home/ui/main/main.module.scss b/src/views/home/ui/main/main.module.scss index 7dd067c..03d61ea 100644 --- a/src/views/home/ui/main/main.module.scss +++ b/src/views/home/ui/main/main.module.scss @@ -24,10 +24,11 @@ height: rem(900px); z-index: -1; - & img { + .Background { object-fit: cover; filter: brightness(0.5); } + } } @@ -68,11 +69,11 @@ margin-bottom: rem(6px); width: fit-content; - @include iftablet{ + @include iftablet { font-size: rem(28px); } - @include ifdesktop{ + @include ifdesktop { font-size: rem(32px); } } @@ -85,11 +86,11 @@ color: $color-white; text-transform: uppercase; - @include iftablet{ + @include iftablet { font-size: rem(12px); } - @include ifdesktop{ + @include ifdesktop { font-size: rem(14px); } } @@ -122,6 +123,7 @@ } .Info { + position: relative; margin: 0 auto; display: flex; flex-direction: column; @@ -131,15 +133,49 @@ @include iftablet { flex-direction: row; gap: unset; - padding: rem(130px) 0 rem(160px); + padding: rem(110px) 0 rem(160px); } @include iflaptop { - padding: rem(130px) 0 rem(160px); + padding: rem(110px) 0 rem(160px); } @include ifdesktop { - padding: rem(160px) 0 rem(120px); + padding: rem(130px) 0 rem(120px); + } + + .Map { + position: absolute; + z-index: -1; + width: 90vw; + bottom: rem(-50px); + right: 50%; + transform: translateX(50%); + + @media (min-width: 500px) and (max-width: 768px) { + bottom: rem(-40px); + width: rem(480px); + } + + @include iftablet { + width: rem(500px); + top: rem(10px); + bottom: unset; + right: rem(-50px); + transform: none; + } + + @include iflaptop { + width: rem(580px); + top: rem(10px); + right: rem(-30px); + } + + @include ifdesktop { + width: rem(800px); + top: rem(120px); + right: rem(-100px); + } } .Content { diff --git a/src/views/home/ui/main/main.tsx b/src/views/home/ui/main/main.tsx index 5b0b5be..b46242d 100644 --- a/src/views/home/ui/main/main.tsx +++ b/src/views/home/ui/main/main.tsx @@ -5,6 +5,7 @@ import { ConsultationOrder } from '@/entities/home/consultation-order'; import { CallbackOrder } from '@/entities/home/callback-order'; import bgStart from '@public/images/bg-start-desktop.jpg'; +import ruKrdMap from '@public/svg/ru-krd-map.svg'; import logo from '@public/images/dtr-logo.png'; import waIcon from '@public/svg/whatsapp.svg'; import emailIcon from '@public/svg/email-icon.svg'; @@ -14,6 +15,7 @@ export default function Main() {