diff --git a/public/images/photo/yancen-yana.png b/public/images/photo/yancen-yana.png new file mode 100644 index 0000000..f8b7beb Binary files /dev/null and b/public/images/photo/yancen-yana.png differ diff --git a/src/core/styles/variables.scss b/src/core/styles/variables.scss index c5ac3f3..5c8c13e 100644 --- a/src/core/styles/variables.scss +++ b/src/core/styles/variables.scss @@ -22,7 +22,7 @@ $color-black: #000000; $color-lightgray: #E4E1E1; $color-darkgray: #999999; $color-text: #333333; -$color-text-light: #222222; +$color-text-light: #777777; $color-green: #23A455; $color-link: #333333; $color-link-hover: #009283; diff --git a/src/feature/article/consultation/index.ts b/src/feature/article/consultation/index.ts new file mode 100644 index 0000000..5ecdd1f --- /dev/null +++ b/src/feature/article/consultation/index.ts @@ -0,0 +1 @@ +export * from './ui'; diff --git a/src/feature/article/consultation/styles.module.scss b/src/feature/article/consultation/styles.module.scss new file mode 100644 index 0000000..fdc559b --- /dev/null +++ b/src/feature/article/consultation/styles.module.scss @@ -0,0 +1,65 @@ +.Container { + margin: 0 auto; + width: rem(1540px); + display: grid; + grid-template-columns: auto 360px; + gap: 160px; +} + +.Consultation { + background: $color-green; + margin-bottom: rem(40px); + + .Block { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: rem(60px); + padding: rem(20px) 0; + + .Header { + font-family: $font-roboto; + font-weight: 300; + font-size: rem(38px); + line-height: 100%; + color: $color-white; + text-transform: uppercase; + } + + .Form { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: rem(20px); + width: 100%; + } + } + + .Sidebar { + display: flex; + flex-direction: column; + align-items: center; + gap: rem(16px); + background: $color-white; + margin: rem(20px) 0; + padding: rem(20px); + border-radius: rem(20px); + + .Title { + font-family: $font-roboto; + font-weight: 500; + font-size: rem(16px); + line-height: 100%; + color: $color-text; + } + + .Description { + font-family: $font-roboto; + font-weight: 400; + font-size: rem(14px); + line-height: 100%; + color: $color-text-light; + } + } +} + diff --git a/src/feature/article/consultation/ui.tsx b/src/feature/article/consultation/ui.tsx new file mode 100644 index 0000000..efa566a --- /dev/null +++ b/src/feature/article/consultation/ui.tsx @@ -0,0 +1,34 @@ +import s from './styles.module.scss'; +import { Button, Input, PhoneInput } from '@shared/ui'; +import Image from 'next/image'; +import expertPhoto from '@public/images/photo/yancen-yana.png'; + +function Consultation() { + return ( +
+
+
+

Бесплатная консультация специалиста

+
+ + + + +
+
+ {'Автоэксперт +

Янцен Яна

+

Автоэксперт

+
+
+
+ ); +} + +export { Consultation }; diff --git a/src/feature/article/index.ts b/src/feature/article/index.ts new file mode 100644 index 0000000..39b02e1 --- /dev/null +++ b/src/feature/article/index.ts @@ -0,0 +1,2 @@ +export * from './related-articles'; +export * from './consultation'; diff --git a/src/feature/article/related-articles/index.ts b/src/feature/article/related-articles/index.ts new file mode 100644 index 0000000..5ecdd1f --- /dev/null +++ b/src/feature/article/related-articles/index.ts @@ -0,0 +1 @@ +export * from './ui'; diff --git a/src/feature/article/related-articles/styles.module.scss b/src/feature/article/related-articles/styles.module.scss new file mode 100644 index 0000000..05311ca --- /dev/null +++ b/src/feature/article/related-articles/styles.module.scss @@ -0,0 +1,42 @@ +.Related { + .Container { + margin: 0 auto; + width: rem(1540px); + display: grid; + grid-template-columns: auto 360px; + gap: 160px; + } + + .Header { + font-family: $font-roboto; + font-weight: 300; + font-size: 32px; + line-height: 130%; + color: $color-text; + margin-bottom: 16px; + } + + .Grid { + display: grid; + grid-template-columns: auto auto; + gap: 16px; + margin-bottom: 20px; + + .Title { + font-family: $font-roboto; + font-weight: 500; + font-size: 20px; + line-height: 130%; + color: $color-text; + margin-bottom: 16px; + } + + .Description { + font-family: $font-roboto; + font-weight: 400; + font-size: 16px; + line-height: 130%; + color: $color-text; + } + } +} \ No newline at end of file diff --git a/src/feature/article/related-articles/ui.tsx b/src/feature/article/related-articles/ui.tsx new file mode 100644 index 0000000..005f142 --- /dev/null +++ b/src/feature/article/related-articles/ui.tsx @@ -0,0 +1,58 @@ +import s from './styles.module.scss'; +import { CallbackForm } from '@/entities'; + +function RelatedArticles() { + return ( +
+
+
+

+ Похожие услуги, которые возможно Вас заинтересуют +

+
+
+

Трасологическая экспертиза

+

+ Эксперты нашей компании быстро и точно восстановят картину + происшествия и дадут профессиональную оценку ситуации. Также во + время трасологической экспертизы изучаются имеющиеся повреждения + и следы на месте… +

+
+
+

Товароведческая экспертиза

+

+ Судебная экспертиза товаров должна проводиться только + специалистом, получившим узкопрофильную квалификацию. Если Вам + необходима товароведческая экспертиза и для суда, мы готовы + подробно исследовать любой товар. Результат работы… +

+
+
+

Оценочная экспертиза

+

+ Судебная оценочная (стоимостная) экспертиза представляет собой + вид экспертизы, главной задачей которой является определение + рыночной стоимости объектов оценки… +

+
+
+

Рецензия (Проверка) экспертизы

+

+ Необходимость в составлении рецензии на судебную экспертизу + появляется в ситуациях, когда выводы заключения являются не + обоснованными, а квалификация и опыт эксперта не вызывают + доверия. В ходе рецензирования экспертное заключение + проверяется… +

+
+
+ +
+
+
+
+ ); +} + +export { RelatedArticles }; diff --git a/src/views/expertise/autotech/styles.module.scss b/src/views/expertise/autotech/styles.module.scss index 72116a7..9ef07f6 100644 --- a/src/views/expertise/autotech/styles.module.scss +++ b/src/views/expertise/autotech/styles.module.scss @@ -47,38 +47,3 @@ } } - -.Related { - .Header { - font-family: $font-roboto; - font-weight: 300; - font-size: 32px; - line-height: 130%; - color: $color-text; - margin-bottom: 16px; - } - - .Grid { - display: grid; - grid-template-columns: auto auto; - gap: 16px; - margin-bottom: 20px; - - .Title { - font-family: $font-roboto; - font-weight: 500; - font-size: 20px; - line-height: 130%; - color: $color-text; - margin-bottom: 16px; - } - - .Description { - font-family: $font-roboto; - font-weight: 400; - font-size: 16px; - line-height: 130%; - color: $color-text; - } - } -} \ No newline at end of file diff --git a/src/views/expertise/autotech/ui.tsx b/src/views/expertise/autotech/ui.tsx index e021f79..c21dc13 100644 --- a/src/views/expertise/autotech/ui.tsx +++ b/src/views/expertise/autotech/ui.tsx @@ -1,5 +1,6 @@ import s from './styles.module.scss'; import { CallbackForm, Connect, OrderSchema } from '@/entities'; +import { Consultation, RelatedArticles } from '@/feature/article'; function AutoTech() { return ( @@ -85,59 +86,10 @@ function AutoTech() {
sidebar
-
-
-
-
-
-
-
-

- Похожие услуги, которые возможно Вас заинтересуют -

-
-
-

Трасологическая экспертиза

-

- Эксперты нашей компании быстро и точно восстановят картину - происшествия и дадут профессиональную оценку ситуации. Также - во время трасологической экспертизы изучаются имеющиеся - повреждения и следы на месте… -

-
-
-

Товароведческая экспертиза

-

- Судебная экспертиза товаров должна проводиться только - специалистом, получившим узкопрофильную квалификацию. Если Вам - необходима товароведческая экспертиза и для суда, мы готовы - подробно исследовать любой товар. Результат работы… -

-
-
-

Оценочная экспертиза

-

- Судебная оценочная (стоимостная) экспертиза представляет собой - вид экспертизы, главной задачей которой является определение - рыночной стоимости объектов оценки… -

-
-
-

Рецензия (Проверка) экспертизы

-

- Необходимость в составлении рецензии на судебную экспертизу - появляется в ситуациях, когда выводы заключения являются не - обоснованными, а квалификация и опыт эксперта не вызывают - доверия. В ходе рецензирования экспертное заключение - проверяется… -

-
-
- -
-
-
-
+ + + +
);