diff --git a/public/images/licence/dtr-eac-0.png b/public/images/licence/dtr-eac-0.png new file mode 100644 index 0000000..c4c8510 Binary files /dev/null and b/public/images/licence/dtr-eac-0.png differ diff --git a/public/images/licence/dtr-eac-1.png b/public/images/licence/dtr-eac-1.png new file mode 100644 index 0000000..fd78b4b Binary files /dev/null and b/public/images/licence/dtr-eac-1.png differ diff --git a/public/images/licence/dtr-eac-2.png b/public/images/licence/dtr-eac-2.png new file mode 100644 index 0000000..2d1cbc0 Binary files /dev/null and b/public/images/licence/dtr-eac-2.png differ diff --git a/public/images/licence/dtr-eac-3.png b/public/images/licence/dtr-eac-3.png new file mode 100644 index 0000000..02ae1e5 Binary files /dev/null and b/public/images/licence/dtr-eac-3.png differ diff --git a/public/images/licence/dtr-strahovka.png b/public/images/licence/dtr-strahovka.png new file mode 100644 index 0000000..bcc39a9 Binary files /dev/null and b/public/images/licence/dtr-strahovka.png differ diff --git a/src/app/contacts/page.tsx b/src/app/contacts/page.tsx index d757635..476b947 100644 --- a/src/app/contacts/page.tsx +++ b/src/app/contacts/page.tsx @@ -1,3 +1,5 @@ +import { Contacts } from '@/views'; + export default function ContactsPage() { - return
Contacts
; + return ; } diff --git a/src/feature/contacts/index.ts b/src/feature/contacts/index.ts new file mode 100644 index 0000000..10b1966 --- /dev/null +++ b/src/feature/contacts/index.ts @@ -0,0 +1,2 @@ +export * from './licence-slider'; +export * from './yandex-map'; diff --git a/src/feature/contacts/licence-slider/index.ts b/src/feature/contacts/licence-slider/index.ts new file mode 100644 index 0000000..5ecdd1f --- /dev/null +++ b/src/feature/contacts/licence-slider/index.ts @@ -0,0 +1 @@ +export * from './ui'; diff --git a/src/feature/contacts/licence-slider/styles.module.scss b/src/feature/contacts/licence-slider/styles.module.scss new file mode 100644 index 0000000..f39f9ea --- /dev/null +++ b/src/feature/contacts/licence-slider/styles.module.scss @@ -0,0 +1,15 @@ +.Slider { + display: block; + padding: 0 20px; + + .Slide { + display: flex; + justify-content: center; + align-items: center; + + .Image { + width: 200px; + height: auto; + } + } +} diff --git a/src/feature/contacts/licence-slider/ui.tsx b/src/feature/contacts/licence-slider/ui.tsx new file mode 100644 index 0000000..766d5d9 --- /dev/null +++ b/src/feature/contacts/licence-slider/ui.tsx @@ -0,0 +1,61 @@ +'use client'; + +import 'swiper/css'; +import 'swiper/css/navigation'; +import 'swiper/css/grid'; +import 'swiper/css/autoplay'; +import s from './styles.module.scss'; + +import Image, { StaticImageData } from 'next/image'; +import { Swiper, SwiperSlide } from 'swiper/react'; +import { Autoplay, Grid } from 'swiper/modules'; + +type LicenseSliderProps = { + slidesData: { + id: string; + name: string; + image: StaticImageData; + }[]; +}; + +const swiperBreakpoints = { + 360: { + slidesPerView: 1, + spaceBetween: 10, + }, + 768: { + slidesPerView: 3, + spaceBetween: 30, + }, + 1024: { + slidesPerView: 4, + spaceBetween: 30, + }, + 1440: { + slidesPerView: 5, + spaceBetween: 30, + }, +}; + +function LicenceSlider({ slidesData }: LicenseSliderProps) { + return ( + + {slidesData.map(({ id, name, image }) => ( + + {name} + + ))} + + ); +} + +export { LicenceSlider }; diff --git a/src/feature/contacts/yandex-map/index.ts b/src/feature/contacts/yandex-map/index.ts new file mode 100644 index 0000000..5ecdd1f --- /dev/null +++ b/src/feature/contacts/yandex-map/index.ts @@ -0,0 +1 @@ +export * from './ui'; diff --git a/src/feature/contacts/yandex-map/styles.module.scss b/src/feature/contacts/yandex-map/styles.module.scss new file mode 100644 index 0000000..1c57feb --- /dev/null +++ b/src/feature/contacts/yandex-map/styles.module.scss @@ -0,0 +1,85 @@ +.Map { + position: relative; + + iframe { + border-radius: rem(28px); + width: 100%; + height: rem(600px); + padding-bottom: rem(200px); + + @include iftablet { + height: rem(360px); + padding-bottom: unset; + } + + @include iflaptop { + height: rem(400px); + } + + @include ifdesktop { + height: rem(450px); + } + } + + .FlowBlock{ + position: absolute; + z-index: 2; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: flex-start; + background: $color-white; + + bottom: 0; + border-radius: rem(28px); + width: 100%; + height: fit-content; + padding: rem(40px) rem(35px) rem(20px); + + @include iftablet { + top: rem(30px); + right: rem(50px); + border-radius: rem(28px); + width: rem(300px); + padding: rem(20px) rem(20px) rem(10px); + } + + @include iflaptop { + top: rem(20px); + right: rem(150px); + border-radius: rem(28px); + width: rem(300px); + padding: rem(40px) rem(20px) rem(20px); + } + + @include ifdesktop { + top: rem(40px); + right: rem(300px); + border-radius: rem(28px); + width: rem(340px); + padding: rem(40px) rem(35px) rem(40px); + } + + .Header { + font-family: $font-roboto; + font-weight: 400; + font-size: 32px; + line-height: 130%; + color: $color-text; + margin-top: 10px; + + &:first-child { + margin-top: 0; + } + } + + .Text { + font-family: $font-roboto; + font-weight: 400; + font-size: 16px; + line-height: 130%; + color: $color-text; + margin-bottom: 10px; + } + } +} \ No newline at end of file diff --git a/src/feature/contacts/yandex-map/ui.tsx b/src/feature/contacts/yandex-map/ui.tsx new file mode 100644 index 0000000..ed904f7 --- /dev/null +++ b/src/feature/contacts/yandex-map/ui.tsx @@ -0,0 +1,25 @@ +import s from './styles.module.scss'; + +function YandexMap() { + return ( +
+ +
+

Сочи

+

ул. Навагинская д. 9Д, офис 35

+

Время работы:

+

Понедельник - Пятница

+

с 09:00 до 17:00

+

Телефон:

+

+7 (900) 241-34-34

+
+
+ ); +} + +export { YandexMap }; diff --git a/src/shared/ui/icon/ui.tsx b/src/shared/ui/icon/ui.tsx index 2332142..4dd0fa6 100644 --- a/src/shared/ui/icon/ui.tsx +++ b/src/shared/ui/icon/ui.tsx @@ -180,7 +180,7 @@ const BtnPhone = (props: SVGIcon) => ( ); //HealthiconsHomeOutline -const Home = (props: SVGProps) => ( +const Home = (props: SVGIcon) => ( ) => ( ); +// PhPhoneCall +const ContactCall = (props: SVGIcon) => ( + + + +); + +//StreamlineFastforwardClock +const ContactTimer = (props: SVGIcon) => ( + + + + + + + +); + +//RiWhatsappLine +const ContactWhatsapp = (props: SVGIcon) => { + return ( + + + + ); +}; + +//Fa6BrandsCloudscale +const CloudScale = (props: SVGIcon) => ( + + + +); + +//FaSolidMailBulk +const MailBulk = (props: SVGIcon) => ( + + + +); + const Icons = Object.assign( {}, { @@ -212,6 +295,11 @@ const Icons = Object.assign( MenuArrow, BtnPhone, Home, + ContactCall, + ContactTimer, + ContactWhatsapp, + CloudScale, + MailBulk, }, ); diff --git a/src/views/contacts/index.ts b/src/views/contacts/index.ts index e69de29..5ecdd1f 100644 --- a/src/views/contacts/index.ts +++ b/src/views/contacts/index.ts @@ -0,0 +1 @@ +export * from './ui'; diff --git a/src/views/contacts/model/breadcrums.ts b/src/views/contacts/model/breadcrums.ts new file mode 100644 index 0000000..9bf7b94 --- /dev/null +++ b/src/views/contacts/model/breadcrums.ts @@ -0,0 +1,14 @@ +import { ROUTES } from '@shared/const/route'; + +export const PAGE_NAME = 'Контакты'; + +export const breadcrumbData = [ + { + name: '', + path: '', + }, + { + name: PAGE_NAME, + path: '', + }, +]; diff --git a/src/views/contacts/model/slides.ts b/src/views/contacts/model/slides.ts new file mode 100644 index 0000000..414a54b --- /dev/null +++ b/src/views/contacts/model/slides.ts @@ -0,0 +1,33 @@ +import lic0 from '@public/images/licence/dtr-strahovka.png'; +import lic1 from '@public/images/licence/dtr-eac-0.png'; +import lic2 from '@public/images/licence/dtr-eac-1.png'; +import lic3 from '@public/images/licence/dtr-eac-2.png'; +import lic4 from '@public/images/licence/dtr-eac-3.png'; + +export const slidesData = [ + { + id: '0', + name: '', + image: lic0, + }, + { + id: '1', + name: '', + image: lic1, + }, + { + id: '2', + name: '', + image: lic2, + }, + { + id: '3', + name: '', + image: lic3, + }, + { + id: '4', + name: '', + image: lic4, + }, +]; diff --git a/src/views/contacts/styles.module.scss b/src/views/contacts/styles.module.scss index e69de29..bc87805 100644 --- a/src/views/contacts/styles.module.scss +++ b/src/views/contacts/styles.module.scss @@ -0,0 +1,162 @@ +.Information { + margin: 0 auto; + max-width: rem(1540px); + display: grid; + grid-template-columns: auto; + gap: 10px; + padding: 10px; + + @include iftablet { + grid-template-columns: repeat(2, 1fr); + justify-items: center; + gap: 20px; + padding: 20px; + } + + @include iflaptop { + padding: 28px; + } + + @include ifdesktop { + padding: 40px; + gap: 40px; + } + + .Contact { + h3 { + @extend %title; + width: 100%; + + @include iftablet { + max-width: 420px; + } + } + + .Row { + display: grid; + grid-template-columns: 1fr 1fr; + justify-items: center; + align-items: center; + margin-bottom: 20px; + + .Info { + display: flex; + flex-direction: column; + align-items: center; + gap: 12px; + + .Text { + font-family: $font-roboto; + font-weight: 400; + font-size: 16px; + line-height: 100%; + color: $color-text; + + a { + color: $color-green; + + &:hover { + color: $color-green-hover; + text-decoration: underline; + } + } + + } + } + } + } + + .Details { + h3 { + @extend %title; + } + + p { + font-family: $font-roboto; + font-weight: 400; + font-size: 16px; + line-height: 150%; + color: $color-text-light; + margin-bottom: 20px; + } + } +} + +.LicenceSlider { + margin: 0 auto 40px; + max-width: rem(1200px); + + .Title { + @extend %title; + } +} + +.WorkTime { + display: grid; + grid-template-columns: auto; + gap: 0; + width: 100%; + background-color: transparent; + background-image: linear-gradient(300deg, #009283 16%, #58c644 37%); + + @include iftablet { + grid-template-columns: auto auto; + } + + .Block { + position: relative; + padding: 20px 0 20px 100px; + + @include iftablet { + background-color: #009283; + } + + &_grad { + @include iftablet { + background-color: transparent; + background-image: linear-gradient(300deg, #009283 16%, #58c644 37%); + } + } + + .Icon { + position: absolute; + top: 16px; + left: 16px; + + @include iftablet { + top: 18px; + left: 30px; + } + } + + .Title { + font-family: $font-roboto; + font-weight: 500; + font-size: 24px; + line-height: 130%; + color: $color-white; + margin-bottom: 4px; + } + + .Text { + font-family: $font-roboto; + font-weight: 500; + font-size: 16px; + line-height: 130%; + color: $color-white; + margin-bottom: 4px; + } + } +} + + +%title { + font-family: $font-roboto; + font-weight: 500; + font-size: 32px; + line-height: 130%; + color: $color-text; + text-align: center; + height: 80px; + margin-bottom: 20px; +} \ No newline at end of file diff --git a/src/views/contacts/ui.tsx b/src/views/contacts/ui.tsx index c49c0c4..7da8cc3 100644 --- a/src/views/contacts/ui.tsx +++ b/src/views/contacts/ui.tsx @@ -1,7 +1,111 @@ import s from './styles.module.scss'; +import { Breadcrumbs } from '@/widgets'; +import { Partners } from '@/feature/article'; +import { LicenceSlider, YandexMap } from '@/feature/contacts'; +import { breadcrumbData } from './model/breadcrums'; +import { Icons } from '@shared/ui/icon'; +import { slidesData } from './model/slides'; +import clsx from 'clsx'; function Contacts() { - return <>; + return ( + <> + +
+ +
+
+
+

Обращайтесь к нам, любым удобным способом

+
+ +
+

Звоните

+

+ +7 (900) 241-34-34 +

+
+
+
+ +
+

Ежедневно

+

с 09:00 до 17:00

+
+
+
+ +
+

E-mail:

+

+ spo-71@yandex.ru +

+
+
+
+ +
+

Whatsapp, Telegram:

+

+7 (900) 241-34-34

+
+
+
+
+

Реквизиты

+

Название: ООО “ДИ ТРАСО”

+

+ {' '} + Юр.адрес: 354000, Краснодарский край, г.Сочи, ул.Труда, д.15, кв. + 64{' '} +

+

+

+ ИНН: 2320219187
+ КПП: 232001001
+ ОГРН: 1142366003010 +

+

+ Банк: Юго-Западный Банк ПАО Сбербанк г. Ростов-на-Дону
+ БИК: 046015602 +
+ Р/с: 40702810230060002355 +
+ К/с: 30101810600000000602
+

+

Директор: Ельчищев Иван Борисович

+
+
+
+

Лицензии и сертификаты

+ +
+
+
+ +

Режим работы:

+

Будние дни: с 9.00 до 17.00

+

Выходные: суббота, воскресенье

+
+
+ +

Контакты для связи

+

Тел.: +7 (900) 241-34-34

+

E-mail: spo-71@yandex.ru

+
+
+ + + ); } export { Contacts }; diff --git a/src/views/index.ts b/src/views/index.ts index a5a5eda..604ddc9 100644 --- a/src/views/index.ts +++ b/src/views/index.ts @@ -1,4 +1,5 @@ export * from './home'; +export * from './contacts'; //Expertise export * from './expertise/category';