Merge branch 'vk-and-yandex-instructions' into 'dev'
added Vk and Yandex instructions See merge request frontend/squiz!302
This commit is contained in:
commit
97d9f85517
@ -16,6 +16,8 @@ import { updateQuiz } from "@root/quizes/actions";
|
|||||||
import { useCurrentQuiz } from "@root/quizes/hooks";
|
import { useCurrentQuiz } from "@root/quizes/hooks";
|
||||||
import { QuizMetricType } from "@model/quizSettings";
|
import { QuizMetricType } from "@model/quizSettings";
|
||||||
import { InstructionsBlock } from "./IntsructionsBlock/InstructionsBlock";
|
import { InstructionsBlock } from "./IntsructionsBlock/InstructionsBlock";
|
||||||
|
import { YandexInstruction } from "./IntsructionsBlock/Instructions/YandexInstruction";
|
||||||
|
import { VKPixelInstruction } from "./IntsructionsBlock/Instructions/VKInstruction";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
isModalOpen: boolean;
|
isModalOpen: boolean;
|
||||||
@ -46,8 +48,7 @@ export default function AnalyticsModal({
|
|||||||
instructionTitle: "Как установить Яндекс Метрику в квиз?",
|
instructionTitle: "Как установить Яндекс Метрику в квиз?",
|
||||||
instructionSubTitle: "Инструкция по настройке Яндекс Метрики",
|
instructionSubTitle: "Инструкция по настройке Яндекс Метрики",
|
||||||
instructionHeader: "Настройка счётчика и интеграции",
|
instructionHeader: "Настройка счётчика и интеграции",
|
||||||
instructionText:
|
instructionText: <YandexInstruction />,
|
||||||
"Повседневная практика показывает, что дальнейшее развитие различных форм деятельности требуют определения и уточнения соответствующий условий активизации.Повседневная практика показывает, что дальнейшее развитие различных форм деятельности требуют определения и уточнения соответствующий условий активизации.Повседневная практика показывает, что дальнейшее развитие различных форм деятельности требуют определения и уточнения соответствующий условий активизации.",
|
|
||||||
},
|
},
|
||||||
vk: {
|
vk: {
|
||||||
header: "VK Пиксель",
|
header: "VK Пиксель",
|
||||||
@ -55,8 +56,7 @@ export default function AnalyticsModal({
|
|||||||
instructionTitle: "Как установить VK Пиксель в квиз?",
|
instructionTitle: "Как установить VK Пиксель в квиз?",
|
||||||
instructionSubTitle: "Инструкция по настройке VK Пиксель",
|
instructionSubTitle: "Инструкция по настройке VK Пиксель",
|
||||||
instructionHeader: "Настройка счётчика и интеграции",
|
instructionHeader: "Настройка счётчика и интеграции",
|
||||||
instructionText:
|
instructionText: <VKPixelInstruction />,
|
||||||
"Повседневная практика показывает, что дальнейшее развитие различных форм деятельности требуют определения и уточнения соответствующий условий активизации.",
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
|
|||||||
214
src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/IntsructionsBlock/Instructions/VKInstruction.tsx
Normal file
214
src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/IntsructionsBlock/Instructions/VKInstruction.tsx
Normal file
@ -0,0 +1,214 @@
|
|||||||
|
import * as React from "react";
|
||||||
|
import { Box, List, ListItem, Typography } from "@mui/material";
|
||||||
|
|
||||||
|
export const VKPixelInstruction = () => {
|
||||||
|
return (
|
||||||
|
<Box>
|
||||||
|
<List>
|
||||||
|
<Typography paragraph>
|
||||||
|
Чтобы настроить VK пиксель , нужно выполнить следующие шаги:
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Перед тем, как создать пиксель, убедитесь, что корректно указали
|
||||||
|
электронную почту для получения уведомлений — это нужно, чтобы доступы
|
||||||
|
работали правильно. Сделать это можно в «Настройках» во вкладке
|
||||||
|
«Контакты», и затем приступать к созданию пикселя.{" "}
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
В VK Рекламе есть два способа создать пиксель:
|
||||||
|
</Typography>
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
1) В момент создания рекламной кампании по продвижению сайта.
|
||||||
|
Чтобы сделать это, введите в поле «Рекламируемый сайт» ссылку,
|
||||||
|
после чего система предложит вам создать пиксель для этого домена.
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
2) На вкладке «Сайты». Чтобы создать пиксель, перейдите в раздел
|
||||||
|
«Сайты» и нажмите на кнопку «Добавить пиксель». Введите домен
|
||||||
|
сайта, для которого хотите отслеживать конверсии, и нажмите
|
||||||
|
«Добавить».
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
|
||||||
|
<Typography paragraph>
|
||||||
|
Если ранее вы рекламировали сайт, то возможно, на нем уже установлен
|
||||||
|
пиксель — в этом случае при запуске рекламы вы увидите подсказку
|
||||||
|
«Привязан пиксель ID 1234567». В таком случае вы можете добавить еще
|
||||||
|
один пиксель на сайт через кнопку «Создать новый пиксель» (например,
|
||||||
|
если у вас нет доступа к этому) или отправить{" "}
|
||||||
|
<a href={"https://ads.vk.com/help/articles/sites#access"}>
|
||||||
|
запрос на доступ к уже имеющемуся пикселю.
|
||||||
|
</a>
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Typography paragraph>
|
||||||
|
отом Скопируйте номер пикселя и вставьте его в поле «Введите номер
|
||||||
|
пикселя» в личном кабинете PenaQuiz. Опубликуйте квиз.
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="h5">Как настроить события пикселя</Typography>
|
||||||
|
|
||||||
|
<Typography paragraph>
|
||||||
|
Кампании по продвижению сайтов в VK Рекламе по умолчанию можно
|
||||||
|
оптимизировать на клики и показы. Если вы используете пиксель, то
|
||||||
|
сможете настроить оптимизацию на другие действия пользователей,
|
||||||
|
например:
|
||||||
|
</Typography>
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>• Посетитель открыл квиз</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>• Посетитель увидел результат</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>• Посетитель увидел определенный результат</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
<Typography paragraph>
|
||||||
|
В разделе «Сайты» в меню слева выберите пиксель и нажмите «Настройка».
|
||||||
|
Чтобы добавить событие, перейдите во вкладку «События» и нажмите
|
||||||
|
кнопку{" "}
|
||||||
|
<a href={"https://ads.vk.com/help/articles/sites#events"}>
|
||||||
|
«Добавить событие».
|
||||||
|
</a>
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель открыл квиз: <b>penaquiz-start</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель нажал на кнопку стартовой страницы:{" "}
|
||||||
|
<b>penaquiz-startquiz</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель кликнул по номеру телефона на стартовой странице:{" "}
|
||||||
|
<b>penaquiz-phone</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель кликнул по email на стартовой странице:{" "}
|
||||||
|
<b>penaquiz-email</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель увидел результат: <b>penaquiz-result</b> (цель
|
||||||
|
прописывается, если подключены результаты)
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель увидел определенный результат:{" "}
|
||||||
|
<b>penaquiz-result-{"{id}"}</b>
|
||||||
|
(где id — id результата. Например, marquiz-result-149495)
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель дошёл до формы контактов: <b>penaquiz-form</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель заполнил форму контактов : <b>penaquiz-contacts</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель отправил заявку с мессенджером:{" "}
|
||||||
|
<b>penaquiz-messengers-X</b>, где X — один из мессенджеров.
|
||||||
|
Например,
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-telegram
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-viber
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-whatsapp
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-vkontakte
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-messenger
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-skype
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-instagram
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель увидел страницу «Спасибо»: <b>penaquiz-finish</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель прошёл вопрос N: <b>penaquiz-stepN</b>
|
||||||
|
(где N — порядковый номер вопроса. Например, <b>penaquiz</b>
|
||||||
|
-step2)
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
8. Кликните кнопку «Сохранить». <b>Готово!</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
<Typography paragraph>
|
||||||
|
Если в консоли или в интерфейсе отсутствуют данные, значит цель не
|
||||||
|
фиксируется. Скорее всего вы не указали номер счётчика в настройках или
|
||||||
|
не опубликовали квиз после этого.
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Если данные присутствуют (цели в квиз работают), но в пикселе они не
|
||||||
|
отображаются, то вам необходимо проверить последовательность целей в
|
||||||
|
настройках пикселя (если настроена составная цель). Затем нужно
|
||||||
|
дождаться срабатывания цели (возможны задержки со стороны VK) или
|
||||||
|
обратиться в техподдержку VK с выяснением возможных проблем.
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
};
|
||||||
211
src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/IntsructionsBlock/Instructions/YandexInstruction.tsx
Normal file
211
src/pages/IntegrationsPage/PartnersBoard/AnalyticsModal/IntsructionsBlock/Instructions/YandexInstruction.tsx
Normal file
@ -0,0 +1,211 @@
|
|||||||
|
import * as React from "react";
|
||||||
|
import { Box, List, ListItem, Typography } from "@mui/material";
|
||||||
|
|
||||||
|
export const YandexInstruction = () => {
|
||||||
|
return (
|
||||||
|
<Box>
|
||||||
|
<Typography paragraph>
|
||||||
|
<b>Важно!</b> Счётчик метрики может показывать статус{" "}
|
||||||
|
<b>«Не найден» и быть окрашен в красный</b>, это связано с особенностями
|
||||||
|
интеграции Метрики и PenaQuiz. Однако, если вы получаете статистику
|
||||||
|
(видите посещения в отчётах), это означает, что счётчик работает и
|
||||||
|
собирает статистику по вашему сайту.
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="h5">
|
||||||
|
Чтобы настроить Яндекс Метрику, нужно выполнить следующие шаги:
|
||||||
|
</Typography>
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
1. Перейдите на сайт Яндекс Метрики metrika.yandex.ru"
|
||||||
|
</Typography>{" "}
|
||||||
|
</ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>а) Если у вас ещё нет счётчика:</b>
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Авторизуйтесь и нажмите «Добавить счётчик».
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Придумайте имя счётчика. Укажите <b>прямую ссылку на квиз</b> в поле
|
||||||
|
«Адрес сайта». Для её получения откройте в PenaQuiz редактирование
|
||||||
|
квиза (Мои квизы {"=>"} Редактировать), откройте вкладку «Установка
|
||||||
|
квиза» {"=>"} «Ссылка на квиз», или же нажмите опубликовать и
|
||||||
|
перейдите по ссылке на публикацию квиза, скопируйте ссылку с адресной
|
||||||
|
строки и вставьте.
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Можете оставить включенными автоматические цели. Это поможет
|
||||||
|
отправлять часть событий вашего квиза в качестве целей в Метрику без
|
||||||
|
дополнительных настроек.
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>Нажмите «Создать счётчик»:</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
На следующей странице подтвердите и нажмите «Начать пользоваться».
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Введите номер счетчика в интеграции квиза “яндекс метрика”
|
||||||
|
</Typography>
|
||||||
|
<Typography>
|
||||||
|
<b>б) Если у вас уже есть счётчик:</b>
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>Зайдите в созданный счетчик</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Перейдите в настройки счётчика и добавьте{" "}
|
||||||
|
<b>прямую ссылку на ваш квиз</b> в раздел «Дополнительные адреса».
|
||||||
|
</Typography>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
2. Перейдите во вкладку «Интеграции» и выберите «Яндекс Метрика» в
|
||||||
|
редакторе квиза.
|
||||||
|
</Typography>{" "}
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
3. Скопируйте номер счётчика и вставьте его в поле «Номер счётчика»
|
||||||
|
в личном кабинете PenaQuiz. Опубликуйте квиз.
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
4. На сайте Яндекс Метрики в настройках счётчика перейдите во
|
||||||
|
вкладку <b>«Цели»</b>.
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
5. Если автоматических событий недостаточно, вы можете настроить
|
||||||
|
дополнительные цели вручную. Создайте новую цель с помощью кнопки
|
||||||
|
<b>«Добавить цель».</b>.
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<Typography paragraph>
|
||||||
|
В поле <b>«Название»</b> укажите любой текст, соответствующий текущей
|
||||||
|
цели (шагу квиза), выберите тип условия «JavaScript-событие» и в поле{" "}
|
||||||
|
<b>«Идентификатор цели»</b> укажите идентификатор «Содержит»:
|
||||||
|
</Typography>
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель открыл квиз: <b>penaquiz-start</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель кликнул по номеру телефона на стартовой странице:{" "}
|
||||||
|
<b>penaquiz-phone</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель кликнул по email на стартовой странице:
|
||||||
|
<b>penaquiz-email</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель увидел результат: <b>penaquiz-result</b> (цель
|
||||||
|
прописывается, если подключены результаты)
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель увидел определенный результат:{" "}
|
||||||
|
<b>penaquiz-result- {"{id}"}</b>
|
||||||
|
(где id — id результата. Например, marquiz-result-149495)
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель дошёл до формы контактов: <b>penaquiz-form</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель заполнил форму контактов <b>penaquiz-contacts</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель отправил заявку с мессенджером:{" "}
|
||||||
|
<b>penaquiz-messengers-X</b>, где X — один из мессенджеров.
|
||||||
|
Например,
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-telegram
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-viber
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-whatsapp
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-vkontakte
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-messenger
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-skype
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
<b>penaquiz</b>-messengers-instagram
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель увидел страницу «Спасибо»: <b>penaquiz-finish</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
• Посетитель прошёл вопрос N: <b>penaquiz-stepN</b>
|
||||||
|
(где N — порядковый номер вопроса. Например, <b>penaquiz</b>
|
||||||
|
-step2)
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
<ListItem>
|
||||||
|
<Typography>
|
||||||
|
8. Кликните кнопку «Сохранить». <b>Готово!</b>
|
||||||
|
</Typography>
|
||||||
|
</ListItem>
|
||||||
|
</List>
|
||||||
|
<Typography paragraph>
|
||||||
|
Если в консоли или в интерфейсе отсутствуют данные, значит цель не
|
||||||
|
фиксируется. Скорее всего вы не указали номер счётчика в настройках или
|
||||||
|
не опубликовали квиз после этого.
|
||||||
|
</Typography>
|
||||||
|
<Typography paragraph>
|
||||||
|
Если данные присутствуют (цели в квиз работают), но в Метрике они не
|
||||||
|
отображаются, то вам необходимо проверить последовательность целей в
|
||||||
|
настройках Метрики (если настроена составная цель). Затем нужно
|
||||||
|
дождаться срабатывания цели (возможны задержки со стороны Яндекс) или
|
||||||
|
обратиться в{" "}
|
||||||
|
<a href={"https://yandex.ru/support/"}>техподдержку Яндекс</a> с
|
||||||
|
выяснением возможных проблем.
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
};
|
||||||
@ -7,7 +7,7 @@ type InstructionsBlockProps = {
|
|||||||
headerText: string;
|
headerText: string;
|
||||||
subHeaderText: string;
|
subHeaderText: string;
|
||||||
instructionTitle: string;
|
instructionTitle: string;
|
||||||
instructionsText: string;
|
instructionsText: JSX.Element;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const InstructionsBlock: FC<InstructionsBlockProps> = ({
|
export const InstructionsBlock: FC<InstructionsBlockProps> = ({
|
||||||
@ -78,9 +78,7 @@ export const InstructionsBlock: FC<InstructionsBlockProps> = ({
|
|||||||
>
|
>
|
||||||
{instructionTitle}
|
{instructionTitle}
|
||||||
</Typography>
|
</Typography>
|
||||||
<Typography sx={{ color: theme.palette.grey3.main }}>
|
{instructionsText}
|
||||||
{instructionsText}
|
|
||||||
</Typography>
|
|
||||||
</Box>
|
</Box>
|
||||||
)}
|
)}
|
||||||
</Box>
|
</Box>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user