diff --git a/src/app/[locale]/pages/faq/page.tsx b/src/app/[locale]/pages/faq/page.tsx new file mode 100644 index 0000000..54e4e27 --- /dev/null +++ b/src/app/[locale]/pages/faq/page.tsx @@ -0,0 +1,13 @@ +import PageTitle from '@/app/ui/page-title'; +import PopularAskedQuestions from '@/app/ui/faq/popular-asked-questions'; +import FrequentlyAskedQuestions from '@/app/ui/faq/frequently-asked-questions'; + +export default function Page() { + return ( +
+ + + +
+ ) +} \ No newline at end of file diff --git a/src/app/styles/pages-styles.scss b/src/app/styles/pages-styles.scss index 02cde73..347528c 100644 --- a/src/app/styles/pages-styles.scss +++ b/src/app/styles/pages-styles.scss @@ -4467,4 +4467,118 @@ box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1); } } +} + +.popular-questions { + background: linear-gradient(135deg, #6366f1, #8b5cf6); + border-radius: 20px; + padding: 30px; + margin-bottom: 30px; + color: white; + + h2 { + font-size: 24px; + margin-bottom: 20px; + display: flex; + align-items: center; + } + + .popular-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 20px; + + div { + background: rgba(255, 255, 255, 0.1); + border-radius: 15px; + padding: 20px; + + h4 { + margin-bottom: 10px; + } + + p { + font-size: 14px; + opacity: 0.9; + } + } + } +} + +.faq-section { + margin-bottom: 40px; + + h2 { + font-size: 22px; + font-weight: 600; + margin-bottom: 20px; + color: #1f2937; + display: flex; + align-items: center; + + span:first-child { + width: 6px; + height: 6px; + background: #6366f1; + border-radius: 50%; + margin-right: 15px; + } + + span:last-child { + margin-left: 10px; + font-size: 14px; + color: #6b7280; + font-weight: 400; + } + } + + .faq-item { + background: white; + border-radius: 15px; + margin-bottom: 15px; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); + overflow: hidden; + transition: transform 0.3s, box-shadow 0.3s; + + &:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12); + } + + .faq-question { + padding: 20px; + cursor: pointer; + display: flex; + justify-content: space-between; + align-items: center; + font-weight: 500; + background: white; + transition: background-color 0.3s; + } + } + + .faq-question { + display: flex; + justify-content: space-between; + align-items: center; + cursor: pointer; + padding: 15px 0; + border-bottom: 1px solid #e5e7eb; + + span { + font-weight: 500; + } + } + + .faq-toggle { + font-size: 20px; + color: #6366f1; + } + + .faq-answer { + display: none; + padding: 15px 0; + color: #4b5563; + line-height: 1.6; + } } \ No newline at end of file diff --git a/src/app/ui/faq/frequently-asked-questions.tsx b/src/app/ui/faq/frequently-asked-questions.tsx new file mode 100644 index 0000000..9c5becf --- /dev/null +++ b/src/app/ui/faq/frequently-asked-questions.tsx @@ -0,0 +1,33 @@ +export default function FrequentlyAskedQuestions() { + return ( +
+
+

+ + Защита контента + (2 вопросов) +

+ +
+
+ Как скрытый водяной знак защищает контент? +
+
+
+
+ Скрытый водяной знак встраивается незаметно в ваш контент и позволяет отслеживать его использование в интернете. Технология работает на основе скрытого водяного знака No Copy и не влияет на качество изображений, видео или аудио. +
+
+ +
+
+ Насколько надежна защита? +
+
+
+
+ Наша многослойная защита обеспечивает 99.8% точность определения авторства даже после обработки файлов. +
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/ui/faq/popular-asked-questions.tsx b/src/app/ui/faq/popular-asked-questions.tsx new file mode 100644 index 0000000..625b27e --- /dev/null +++ b/src/app/ui/faq/popular-asked-questions.tsx @@ -0,0 +1,23 @@ +export default function PopularAskedQuestions() { + return ( +
+

+ Популярные вопросы +

+
+
+

Как работает защита?

+

Мы встраиваем невидимые водяные знаки в ваш контент

+
+
+

Сколько файлов можно загрузить?

+

Зависит от вашего тарифного плана

+
+
+

Безопасность данных

+

Все файлы хранятся на защищенных серверах

+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/ui/header/userMenuButton.tsx b/src/app/ui/header/userMenuButton.tsx index 5cbda6e..73e375e 100644 --- a/src/app/ui/header/userMenuButton.tsx +++ b/src/app/ui/header/userMenuButton.tsx @@ -74,7 +74,7 @@ export default function UserMenuButton() { {t('settings')} - + diff --git a/src/i18n/messages/en.json b/src/i18n/messages/en.json index 671da66..8f5aacf 100644 --- a/src/i18n/messages/en.json +++ b/src/i18n/messages/en.json @@ -293,7 +293,8 @@ "there-are-not-enough-funds-to-protect-files": "There are not enough funds to protect files. {count} tokens required", "there-are-not-enough-funds-to-protect-file": "There are not enough funds to protect file. {count} tokens required", "duplicate-files": "Duplicate files", - "monitoring-is-not-supported": "Monitoring is not supported" + "monitoring-is-not-supported": "Monitoring is not supported", + "frequently-asked-questions": "Frequently Asked Questions" }, "Login-register-form": { "and": "and", diff --git a/src/i18n/messages/ru.json b/src/i18n/messages/ru.json index 2b247ed..b0e1e46 100644 --- a/src/i18n/messages/ru.json +++ b/src/i18n/messages/ru.json @@ -293,7 +293,8 @@ "there-are-not-enough-funds-to-protect-files": "Для защиты файлов недостаточно средств. Необходимо {count} токен(ов/а)", "there-are-not-enough-funds-to-protect-file": "Для защиты файла недостаточно средств. Необходимо {count} токен(ов/а)", "duplicate-files": "Дубликаты файлов", - "monitoring-is-not-supported": "Мониторинг не поддерживается" + "monitoring-is-not-supported": "Мониторинг не поддерживается", + "frequently-asked-questions": "Часто задаваемые вопросы" }, "Login-register-form": { "and": "и",