From 6d7cf60ca66c042c652e442f43bd7085bef6f1d4 Mon Sep 17 00:00:00 2001 From: Podumki Date: Mon, 1 Jul 2024 20:49:38 +0200 Subject: [PATCH] added buttons, update style-consultant --- .../education/style-consultant/page-data.json | 54 +++++++++++++++---- src/components/buttons/circle-button.tsx | 26 +++++++++ src/components/buttons/point-button.tsx | 13 +++++ src/components/page-grid.tsx | 11 ++-- 4 files changed, 91 insertions(+), 13 deletions(-) create mode 100644 src/components/buttons/circle-button.tsx create mode 100644 src/components/buttons/point-button.tsx diff --git a/src/app/education/style-consultant/page-data.json b/src/app/education/style-consultant/page-data.json index 939de53..34e28ee 100644 --- a/src/app/education/style-consultant/page-data.json +++ b/src/app/education/style-consultant/page-data.json @@ -1,23 +1,28 @@ { "title": "КОНСУЛЬТАНТ ПО СТИЛЮ", "title2": "Быстрый старт", - "description": "Ёмко и насыщенно о самом важном для реализации идей в создании модных и стильных комплектов одежды и аксессуаров. В курсе: живые вебинары, видеолекции, чат в группе, наставник курирует проектную работу, в итоге обучения - style-book. Эксперты - опытные преподаватели и авторы книг, практикующие стилисты, имиджмейкеры", - "list": ["Старт: 18 июля, 19 сентября", "Длительность: 2 месяца", "Организаторы: ВШСДТ, НИ ТГУ.", "Уровень: для новичков.", "Бесплатный формат: доступен."], + "description": "Погрузитесь в мир моды и стиля, научитесь анализировать тренды,создавать стильные образы и сделаете любимое хобби своей профессией, приносящей доход. На курсе вас ждут: живые вебинары с экспертами, удобное расписание видеолекций,закрытый чат для общения с преподавателями и поддержка коллег, практика и отработка навыков в крупных торговых центрах, наставничество опытных преподавателей и практикующих стилистов - имиджмейкеров.", + "list": ["ДОСТУПЕН БЕСПЛАТНЫЙ ФОРМАТ ОБУЧЕНИЯ", "Ближайший старт: 18 июля, 19 сентября", "Длительность: 2 месяца", "Организаторы: ВШСДТ, НИ ТГУ", "Диплом установленного образца государственного университета", "Для любого уровня подготовки"], "tags": [ { "id": "program", - "text": "#Программа" + "text": "Программа" }, { "id": "teachers", - "text": "#Преподователи" + "text": "Преподователи" }, { "id": "cost", - "text": "#Стоимость" + "text": "Стоимость" } ], + "points": [ + { + "mb": "0px", + "button": {"text": "Записаться на курс", "href": "https://t.me/styleschoolru", "title": "Записаться на курс"} + }, { "mb": "0px", "banner": { @@ -32,7 +37,7 @@ "title2": "Характеристики программы", "content": [ { "text": - "Курс создан для обучения с “нуля”. Дает возможность реализовать мечту о творческой самореализации в области моды и сделать первые шаги в профессии стилиста. В курсе представлены базовые методики в области подбора комплектов одежды в соответствии с индивидуальными особенностями персон и модными тенденциями. Гибкий график изучения видео материалов в сочетании с живыми практическими занятиями и командной работой дает гарантированный результат." }, + "Курс создан для обучения с “нуля”. Наш курс дает возможность сделать любимое хобби своей профессией, приносящей доход. Курс за 2 месяца погрузит вас в мир моды и стиля, вы научитесь анализировать тренды,создавать стильные образы и пройдете практику в магазинах, преодолеете страх работы с клиентом, оформите свой первый кейс."}, { "text": "Направления в профессии: имидж-консультант, консультант по стилю, персональный стилист, шопер, продавец-стилист."}, { "text": "Доступно полностью дистанционное (онлайн) обучение"}, { "text": "Доступно индивидуальное комбинированное обучение с очными практиками", "mb": true} @@ -62,16 +67,47 @@ "2part": "от 40 тыс. рублей, доступна рассрочка" },{ "1part": "Действует акция - приведи 2 друга и получи обучение на 15% дешевле" + },{ + "2part": "Доступно бесплатное обучение для определенных категорий граждан РФ в рамках федерального проекта “Содействие занятости”" },{ "1part": "Документ об образовании", "2part": "удостоверение о повышении квалификации установленного государством образца ведущего гос. ВУЗа" - },{ - "1part": "Бесплатное обучение", - "2part": "Доступно для определенных категорий граждан РФ, включая работающих (трудоустроенных), в рамках федерального проекта Содействие занятости в определенном перечне регионов РФ" } ] }] }, + { + "lists": [{ + "type": "column", + "mb": true, + "texts": [{ "text": "Что вас ждет:"}], + "content": [ + { "text": "Научитесь разбираться в модных тенденциях и анализировать тренды" }, + { "text": "Узнаете типологию мужских и женских фигур, научитесь подбирать для них одежду." }, + { "text": "Научитесь применять техники визуальной коррекции." }, + { "text": "Узнаете секреты визуального мерчандайзинга, сможете стилизовать манекены и создавать актуальные образы для витрин магазинов." }, + { "text": "Начнете консультировать клиентов по стилю,давать рекомендации по выбору одежды и аксессуаров." }, + { "text": "Проводить шоппинг-сопровождение, ревизию гардероба, создавать клиентский Stylebook. " }, + { "text": "Получите навыки презентации своих услуг и сможете увеличить свою клиентскую базу. " }, + { "text": "Оформите свой аккаунт и услуги стилиста." } + ] + }, + { + "type": "column", + "mb": true, + "texts": [{ "text": "Преимущества нашего курса:"}], + "content": [ + { "text": "Опытные преподаватели- эксперты в своей нише, стаж в профессии более 10 лет, авторы книг, владельцы своих школ, коучи, наставники." }, + { "text": "Практические задания, практика в магазинах, реальные кейсы." }, + { "text": "Дополнительные материалы - видео, чек-листы, статьи, сайты и другие онлайн-ресурсы. " }, + { "text": "Общение с коллегами и преподавателями в закрытом чате, обмен опытом и обратной связью." }, + { "text": "По результатам обучения доступ к сообществу стилистов, где Вы всегда найдете поддержку, сможете задать вопросы по профессии, работе с клиентами, личному развитию, а также найти партнеров, единомышленников, собрать команду для старта и продвижения." } + ], + "details": [ + {"text": "Используйте свой шанс получить профессию будущего, стать настоящим профессионалом в мире стиля и моды! "} + ] + }] + }, { "mb": "0px", "banner": { diff --git a/src/components/buttons/circle-button.tsx b/src/components/buttons/circle-button.tsx new file mode 100644 index 0000000..638a3ed --- /dev/null +++ b/src/components/buttons/circle-button.tsx @@ -0,0 +1,26 @@ +import { Flex, Box, Link, Text, useMediaQuery } from '@chakra-ui/react'; +import { memo } from "react"; +import NextLink from 'next/link'; + +export default memo(function circleButton(props: any) { + const [isMax959] = useMediaQuery('(max-width: 959px)') + + return ( + + + + {props.text} + + + + ) +}) diff --git a/src/components/buttons/point-button.tsx b/src/components/buttons/point-button.tsx new file mode 100644 index 0000000..693191e --- /dev/null +++ b/src/components/buttons/point-button.tsx @@ -0,0 +1,13 @@ +import { memo } from "react"; +import CircleButton from "./circle-button"; + + +export default memo(function PointButton(props: any) { + const { type, ...data } = props; + + return(<> + { type === 'circle' ? : null } + + ); + }) + \ No newline at end of file diff --git a/src/components/page-grid.tsx b/src/components/page-grid.tsx index 13a9c42..7898168 100644 --- a/src/components/page-grid.tsx +++ b/src/components/page-grid.tsx @@ -1,4 +1,4 @@ -import { Box, Flex, HStack, Text, VStack, useMediaQuery, Link } from '@chakra-ui/react' +import { Box, Flex, HStack, Text, VStack, useMediaQuery, Link, Button } from '@chakra-ui/react' import NextLink from 'next/link' import { memo } from "react" import { HoveredStyledLink } from "./footer-link"; @@ -12,6 +12,7 @@ import { BreadcrumbItem, BreadcrumbLink, } from '@chakra-ui/react' +import PointButton from './buttons/point-button'; export const PageGrid = memo(function PageGrid(props: any) { const [isMax667] = useMediaQuery('(max-width: 667px)'); @@ -21,7 +22,7 @@ export const PageGrid = memo(function PageGrid(props: any) { tags, list, points, breadcrumbs } = props; return (<> { title || title2 || description || details || tags || list - ? + ? @@ -118,7 +119,9 @@ export const PageGrid = memo(function PageGrid(props: any) { }) : null } - { point.button ? + { point.button ? : point.button ? : null } + + {/* { point.button ? {point.button.text} : null - } + } */} { point.details && point.details.length ? point.details.map((detail: {text: string; mb?: boolean|string; textStyles?: string}, i: number) =>