Monorepo skeleton, Prisma schema, core domain and services with tests
Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
commit
45d7512d2b
64 files changed
+9483
No files matched your search
@@ -0,0 +1,222 @@
|
||||
<!doctype html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Barev Club — лендинг v2</title>
|
||||
<script src="./vendor/react.js"></script>
|
||||
<script src="./vendor/react-dom.js"></script>
|
||||
<script src="./support.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<x-dc>
|
||||
<helmet>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,700;0,800;1,400;1,500&family=Onest:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
body{margin:0;background:#FBF6EE}
|
||||
a{color:#1E1B1A}a:hover{color:#B8235A}
|
||||
</style>
|
||||
</helmet>
|
||||
<div style="font-family: 'Onest', system-ui, sans-serif; color: #1E1B1A; background: #FBF6EE; width: 100%">
|
||||
<div style="max-width: 1240px; margin: 0 auto; padding: 16px 20px 32px; display: flex; flex-direction: column; gap: 12px">
|
||||
|
||||
<header style="display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 8px 8px 20px; border-radius: 999px; background: #FFFFFF">
|
||||
<div style="display: flex; align-items: center; gap: 8px">
|
||||
<svg aria-hidden="true" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#4A1028" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9.5"></circle><path d="M8 12.5l2.6 2.6L16 9.5"></path></svg>
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 20px; color: #4A1028">Barev Club</div>
|
||||
</div>
|
||||
<nav style="display: flex; flex-wrap: wrap; gap: 20px; font-size: 15px; font-weight: 500">
|
||||
<a href="#services" style="text-decoration: none">Услуги</a>
|
||||
<a href="#how" style="text-decoration: none">Как это работает</a>
|
||||
<a href="#plans" style="text-decoration: none">Членство</a>
|
||||
<a href="#faq" style="text-decoration: none">Вопросы</a>
|
||||
</nav>
|
||||
<div style="display: flex; flex-wrap: wrap; align-items: center; gap: 4px">
|
||||
<sc-for list="{{langs}}" as="l" hint-placeholder-count="5">
|
||||
<button onClick="{{l.pick}}" style="{{l.style}}">{{l.code}}</button>
|
||||
</sc-for>
|
||||
<a href="https://t.me/" style="margin-left: 6px; display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: 999px; background: #1E1B1A; color: #FFFFFF; font-weight: 600; font-size: 14px; text-decoration: none">Открыть в Telegram</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section style="display: flex; flex-wrap: wrap; gap: 12px">
|
||||
<div style="flex: 999 1 560px; min-width: 0; box-sizing: border-box; padding: 40px; border-radius: 36px; background: #F6C3D3; display: flex; flex-direction: column; gap: 22px">
|
||||
<div style="align-self: flex-start; padding: 8px 14px; border-radius: 999px; background: #FFFFFF; font-size: 14px; font-weight: 600; color: #4A1028">Для тех, кто переехал в Ереван</div>
|
||||
<h1 style="margin: 0; font-family: 'Rubik', sans-serif; font-weight: 800; font-size: clamp(40px, 5.4vw, 74px); line-height: 0.98; letter-spacing: -2px; color: #4A1028">{{title}}</h1>
|
||||
<p style="margin: 0; font-size: 19px; line-height: 1.5; color: #4A1028; max-width: 560px">{{sub}}</p>
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 10px">
|
||||
<a href="https://t.me/" style="display: inline-flex; align-items: center; gap: 10px; height: 56px; padding: 0 28px; border-radius: 999px; background: #1E1B1A; color: #FFFFFF; font-weight: 600; font-size: 16px; text-decoration: none">{{cta}}
|
||||
<svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"></path></svg></a>
|
||||
<a href="#services" style="display: inline-flex; align-items: center; height: 56px; padding: 0 24px; border-radius: 999px; background: #FFFFFF; font-weight: 600; font-size: 16px; text-decoration: none">Смотреть услуги</a>
|
||||
</div>
|
||||
<div style="display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: auto">
|
||||
<div style="padding: 14px; border-radius: 22px; background: #FFFFFF"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 22px; color: #B8235A">1</div><div style="font-size: 14px; font-weight: 500">Открой бота в Telegram</div></div>
|
||||
<div style="padding: 14px; border-radius: 22px; background: #FFFFFF"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 22px; color: #B8235A">2</div><div style="font-size: 14px; font-weight: 500">Выбери услугу и время</div></div>
|
||||
<div style="padding: 14px; border-radius: 22px; background: #FFFFFF"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 22px; color: #B8235A">3</div><div style="font-size: 14px; font-weight: 500">Следи за статусом в приложении</div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 12px">
|
||||
<div style="padding: 20px; border-radius: 36px; background: #FFFFFF; display: flex; flex-direction: column; gap: 8px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; padding: 0 4px 6px"><div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 20px">Мои заявки</div><div style="font-size: 13px; color: #5C5550">в приложении</div></div>
|
||||
<div style="padding: 12px 14px; border-radius: 20px; background: #BCD0F2; color: #12264D; display: flex; align-items: center; gap: 10px"><div style="flex: 1"><div style="font-weight: 600; font-size: 14px">Трансфер · аэропорт → дом</div><div style="font-size: 12px">Сегодня 12:30</div></div><span style="padding: 4px 10px; border-radius: 999px; background: #FFFFFF; font-size: 12px; font-weight: 600">Ждёт вас</span></div>
|
||||
<div style="padding: 12px 14px; border-radius: 20px; background: #A8C38A; color: #1F3311; display: flex; align-items: center; gap: 10px"><div style="flex: 1"><div style="font-weight: 600; font-size: 14px">Клининг · генеральная</div><div style="font-size: 12px">Сб 16:00</div></div><span style="padding: 4px 10px; border-radius: 999px; background: #FFFFFF; font-size: 12px; font-weight: 600">Назначен</span></div>
|
||||
<div style="padding: 12px 14px; border-radius: 20px; background: #F9CDB0; color: #4D200A; display: flex; align-items: center; gap: 10px"><div style="flex: 1"><div style="font-weight: 600; font-size: 14px">Соцкарта</div><div style="font-size: 12px">Документы проверяются</div></div><span style="padding: 4px 10px; border-radius: 999px; background: #FFFFFF; font-size: 12px; font-weight: 600">В работе</span></div>
|
||||
<div style="padding: 12px 14px; border-radius: 20px; background: #CFC8F5; color: #2B1F5C; display: flex; align-items: center; gap: 10px"><div style="flex: 1"><div style="font-weight: 600; font-size: 14px">Армянский A1 · урок 3</div><div style="font-size: 12px">Сегодня 15:00 · онлайн</div></div><span style="padding: 4px 10px; border-radius: 999px; background: #FFFFFF; font-size: 12px; font-weight: 600">Сегодня</span></div>
|
||||
</div>
|
||||
<div style="display: flex; gap: 12px">
|
||||
<div style="flex: 1; padding: 18px; border-radius: 30px; background: #F7DA6E; display: flex; align-items: center; gap: 12px">
|
||||
<div style="position: relative; width: 72px; height: 72px; flex: none; transform: rotate(-10deg)">
|
||||
<svg aria-hidden="true" viewBox="0 0 100 100" width="72" height="72" style="position: absolute; inset: 0"><g fill="#B8235A"><circle cx="50" cy="50" r="34"></circle><circle cx="82" cy="50" r="16"></circle><circle cx="75.9" cy="68.8" r="16"></circle><circle cx="59.9" cy="80.4" r="16"></circle><circle cx="40.1" cy="80.4" r="16"></circle><circle cx="24.1" cy="68.8" r="16"></circle><circle cx="18" cy="50" r="16"></circle><circle cx="24.1" cy="31.2" r="16"></circle><circle cx="40.1" cy="19.6" r="16"></circle><circle cx="59.9" cy="19.6" r="16"></circle><circle cx="75.9" cy="31.2" r="16"></circle></g></svg>
|
||||
<div style="position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #FFFFFF; font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 26px">5</div>
|
||||
</div>
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 17px; line-height: 1.15; color: #4A1028">языков:<br>RU EN 中文 HY ES</div>
|
||||
</div>
|
||||
<div style="flex: 1; padding: 18px; border-radius: 30px; background: #CFC8F5; display: flex; flex-direction: column; justify-content: center; gap: 4px; color: #2B1F5C">
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 18px; line-height: 1.15">Без установки</div>
|
||||
<div style="font-size: 13px">Всё внутри Telegram</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="services" style="display: flex; flex-wrap: wrap; gap: 12px">
|
||||
<div style="flex: 1 1 270px; min-width: 0; box-sizing: border-box; padding: 24px; border-radius: 32px; background: #A8C38A; color: #1F3311; display: flex; flex-direction: column; gap: 12px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 26px">Быт</div>
|
||||
<svg aria-hidden="true" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 11l8-7 8 7v9H4z"></path></svg></div>
|
||||
<div style="display: flex; flex-direction: column; gap: 6px">
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Клининг</span><span>от [ЦЕНА] ֏</span></div>
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Ремонт</span><span>от [ЦЕНА] ֏</span></div>
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Трансфер</span><span>от [ЦЕНА] ֏</span></div>
|
||||
</div>
|
||||
<div style="font-size: 14px">Проверенные исполнители, статус заказа в приложении.</div>
|
||||
<a href="https://t.me/" style="margin-top: auto; font-weight: 700; color: #1F3311">Заказать →</a>
|
||||
</div>
|
||||
<div style="flex: 1 1 270px; min-width: 0; box-sizing: border-box; padding: 24px; border-radius: 32px; background: #F9CDB0; color: #4D200A; display: flex; flex-direction: column; gap: 12px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 26px">Документы</div>
|
||||
<svg aria-hidden="true" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M7 3h7l5 5v13H7zM14 3v5h5M10 13h6M10 17h6"></path></svg></div>
|
||||
<div style="display: flex; flex-direction: column; gap: 6px">
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Соцкарта</span><span>от [ЦЕНА] ֏</span></div>
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Перевод паспорта</span><span>от [ЦЕНА] ֏</span></div>
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">ВНЖ</span><span>от [ЦЕНА] ֏</span></div>
|
||||
</div>
|
||||
<div style="font-size: 14px">Нотариальный перевод и сопровождение до готового документа.</div>
|
||||
<a href="https://t.me/" style="margin-top: auto; font-weight: 700; color: #4D200A">Оформить →</a>
|
||||
</div>
|
||||
<div style="flex: 1 1 270px; min-width: 0; box-sizing: border-box; padding: 24px; border-radius: 32px; background: #CFC8F5; color: #2B1F5C; display: flex; flex-direction: column; gap: 12px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 26px; line-height: 1">Обучение и карьера</div>
|
||||
<svg aria-hidden="true" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="flex: none"><path d="M4 5h6a2 2 0 0 1 2 2v13a2 2 0 0 0-2-2H4zM20 5h-6a2 2 0 0 0-2 2v13a2 2 0 0 1 2-2h6z"></path></svg></div>
|
||||
<div style="display: flex; flex-direction: column; gap: 6px">
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Армянский</span><span>от [ЦЕНА] ֏</span></div>
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Английский</span><span>от [ЦЕНА] ֏</span></div>
|
||||
<div style="height: 46px; padding: 0 16px; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: space-between; font-size: 15px"><span style="font-weight: 600">Карьерный консультант</span><span>от [ЦЕНА] ֏</span></div>
|
||||
</div>
|
||||
<div style="font-size: 14px">Онлайн и офлайн, в удобное время.</div>
|
||||
<a href="https://t.me/" style="margin-top: auto; font-weight: 700; color: #2B1F5C">Записаться →</a>
|
||||
</div>
|
||||
<div style="flex: 1 1 270px; min-width: 0; box-sizing: border-box; padding: 24px; border-radius: 32px; background: #F7DA6E; color: #4A1028; display: flex; flex-direction: column; gap: 12px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center"><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 26px; line-height: 1">Скидки и подарки</div>
|
||||
<svg aria-hidden="true" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="flex: none"><path d="M4 8h16v4H4zM5 12h14v8H5zM12 8v12M12 8c-2-3-6-3-6 0M12 8c2-3 6-3 6 0"></path></svg></div>
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 64px; line-height: 1; letter-spacing: -2px">до −[N]%</div>
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 6px">
|
||||
<span style="padding: 8px 14px; border-radius: 999px; background: #FFFFFF; font-size: 14px; font-weight: 500">Кофейни</span>
|
||||
<span style="padding: 8px 14px; border-radius: 999px; background: #FFFFFF; font-size: 14px; font-weight: 500">Рестораны</span>
|
||||
<span style="padding: 8px 14px; border-radius: 999px; background: #FFFFFF; font-size: 14px; font-weight: 500">Подарки партнёров</span>
|
||||
</div>
|
||||
<div style="font-size: 14px">Покажи клубную карту в Telegram на кассе.</div>
|
||||
<a href="https://t.me/" style="margin-top: auto; font-weight: 700; color: #4A1028">Смотреть партнёров →</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="how" style="display: flex; flex-wrap: wrap; gap: 12px">
|
||||
<div style="flex: 999 1 640px; min-width: 0; box-sizing: border-box; padding: 28px; border-radius: 36px; background: #1E1B1A; color: #FFFFFF; display: flex; flex-direction: column; gap: 18px">
|
||||
<h2 style="margin: 0; font-family: 'Rubik', sans-serif; font-size: 34px; letter-spacing: -1px"><span style="font-weight: 700">Как это</span> <span style="font-weight: 400; font-style: italic">работает</span></h2>
|
||||
<div style="display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px">
|
||||
<div style="padding: 16px; border-radius: 24px; background: #2E2A28; display: flex; flex-direction: column; gap: 8px"><div style="width: 36px; height: 36px; border-radius: 50%; background: #F6C3D3; color: #4A1028; display: flex; align-items: center; justify-content: center; font-weight: 700">1</div><div style="font-weight: 600">Отсканируй QR</div><div style="font-size: 13px; color: #CFC8C2">Из договора аренды или с сайта</div></div>
|
||||
<div style="padding: 16px; border-radius: 24px; background: #2E2A28; display: flex; flex-direction: column; gap: 8px"><div style="width: 36px; height: 36px; border-radius: 50%; background: #F7DA6E; color: #4A1028; display: flex; align-items: center; justify-content: center; font-weight: 700">2</div><div style="font-weight: 600">Выбери язык</div><div style="font-size: 13px; color: #CFC8C2">Пять языков на выбор</div></div>
|
||||
<div style="padding: 16px; border-radius: 24px; background: #2E2A28; display: flex; flex-direction: column; gap: 8px"><div style="width: 36px; height: 36px; border-radius: 50%; background: #A8C38A; color: #1F3311; display: flex; align-items: center; justify-content: center; font-weight: 700">3</div><div style="font-weight: 600">Закажи услугу</div><div style="font-size: 13px; color: #CFC8C2">Время, адрес, оплата</div></div>
|
||||
<div style="padding: 16px; border-radius: 24px; background: #2E2A28; display: flex; flex-direction: column; gap: 8px"><div style="width: 36px; height: 36px; border-radius: 50%; background: #BCD0F2; color: #12264D; display: flex; align-items: center; justify-content: center; font-weight: 700">4</div><div style="font-weight: 600">Следи за статусом</div><div style="font-size: 13px; color: #CFC8C2">Чат с исполнителем внутри</div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="flex: 1 1 340px; min-width: 0; box-sizing: border-box; padding: 28px; border-radius: 36px; background: #A8C38A; display: flex; align-items: center; gap: 16px">
|
||||
<div style="flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px">
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 26px; line-height: 1.05; color: #1F3311">Сняли квартиру через [АГЕНТСТВО]?</div>
|
||||
<div style="font-size: 15px; color: #1F3311">Код на месяц Barev+ уже в договоре.</div>
|
||||
</div>
|
||||
<div style="width: 120px; height: 110px; flex: none; box-sizing: border-box; padding: 14px; background: #F7DA6E; border-radius: 6px; transform: rotate(6deg); display: flex; flex-direction: column; justify-content: space-between">
|
||||
<div style="font-family: 'Rubik', sans-serif; font-style: italic; font-size: 20px; font-weight: 500; color: #4A1028">Подарок!</div>
|
||||
<div style="font-size: 12px; color: #4A1028">1 месяц Barev+</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="plans" style="display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch">
|
||||
<div style="flex: 1 1 300px; min-width: 0; box-sizing: border-box; padding: 28px; border-radius: 36px; background: #FFFFFF; display: flex; flex-direction: column; gap: 14px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: baseline"><div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 28px">Barev</div><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 32px">0 ֏</div></div>
|
||||
<div style="display: flex; flex-direction: column; gap: 8px; font-size: 15px">
|
||||
<div style="display: flex; gap: 8px; align-items: center"><svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#1F7A52" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12l4 4 10-10"></path></svg>Скидки и подарки партнёров</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center"><svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#1F7A52" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12l4 4 10-10"></path></svg>Все услуги по обычной цене</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center"><svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#1F7A52" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12l4 4 10-10"></path></svg>Статусы заявок и чат</div>
|
||||
</div>
|
||||
<a href="https://t.me/" style="margin-top: auto; display: flex; align-items: center; justify-content: center; height: 52px; border-radius: 999px; border: 2px solid #1E1B1A; font-weight: 600; text-decoration: none">Вступить бесплатно</a>
|
||||
</div>
|
||||
<div style="flex: 1 1 300px; min-width: 0; box-sizing: border-box; padding: 28px; border-radius: 36px; background: #CFC8F5; color: #2B1F5C; display: flex; flex-direction: column; gap: 14px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: baseline"><div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 28px">Barev+</div><div style="font-family: 'Rubik', sans-serif; font-weight: 800; font-size: 24px">[ЦЕНА] ֏/мес</div></div>
|
||||
<div style="display: flex; flex-direction: column; gap: 8px; font-size: 15px">
|
||||
<div style="display: flex; gap: 8px; align-items: center"><svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#B8235A" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12l4 4 10-10"></path></svg>Всё из Barev</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center"><svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#B8235A" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12l4 4 10-10"></path></svg>−[N]% на документы и быт</div>
|
||||
<div style="display: flex; gap: 8px; align-items: center"><svg aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#B8235A" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12l4 4 10-10"></path></svg>−[N]% на обучение и карьеру</div>
|
||||
</div>
|
||||
<a href="https://t.me/" style="margin-top: auto; display: flex; align-items: center; justify-content: center; height: 52px; border-radius: 999px; background: #1E1B1A; color: #FFFFFF; font-weight: 600; text-decoration: none">Попробовать Barev+</a>
|
||||
</div>
|
||||
<div id="faq" style="flex: 1 1 340px; min-width: 0; box-sizing: border-box; padding: 28px; border-radius: 36px; background: #F6C3D3; color: #4A1028; display: flex; flex-direction: column; gap: 8px">
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 700; font-size: 28px; margin-bottom: 4px">Вопросы</div>
|
||||
<sc-for list="{{faq}}" as="q" hint-placeholder-count="4">
|
||||
<div style="border-radius: 20px; background: #FFFFFF; overflow: hidden">
|
||||
<button onClick="{{q.toggle}}" style="width: 100%; min-height: 48px; padding: 12px 16px; border: none; background: transparent; font-family: inherit; font-size: 15px; font-weight: 600; color: #1E1B1A; text-align: left; display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer"><span>{{q.q}}</span><span aria-hidden="true">{{q.sign}}</span></button>
|
||||
<sc-if value="{{q.open}}" hint-placeholder-val="{{false}}">
|
||||
<div style="padding: 0 16px 14px; font-size: 14px; line-height: 1.45; color: #5C5550">{{q.a}}</div>
|
||||
</sc-if>
|
||||
</div>
|
||||
</sc-for>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer style="display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: center; padding: 18px 24px; border-radius: 999px; background: #FFFFFF; font-size: 14px; color: #5C5550">
|
||||
<div style="font-family: 'Rubik', sans-serif; font-weight: 700; color: #4A1028">Barev Club · Ереван</div>
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 20px"><a href="https://t.me/">Стать партнёром</a><a href="mailto:[EMAIL]">[EMAIL]</a><a href="#">Политика конфиденциальности</a></div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</x-dc>
|
||||
<script type="text/x-dc" data-dc-script data-props='{"$preview":{"width":1440,"height":2400}}'>
|
||||
class Component extends DCLogic {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = { lang: 'RU', open: 0 };
|
||||
}
|
||||
renderVals() {
|
||||
const copy = {
|
||||
RU: { t: 'Ереван — как дома. С первого дня.', s: 'Быт, документы, обучение и скидки партнёров — в одном клубе в Telegram.', c: 'Вступить бесплатно' },
|
||||
EN: { t: 'Yerevan feels like home. From day one.', s: 'Home services, documents, learning and partner discounts — one club in Telegram.', c: 'Join for free' },
|
||||
'中文': { t: '在埃里温,从第一天起就像在家。', s: '生活服务、证件、学习和合作伙伴优惠——尽在 Telegram 俱乐部。', c: '免费加入' },
|
||||
'ՀԱՅ': { t: 'Երևանը՝ ինչպես տանը։ Առաջին օրվանից։', s: 'Կենցաղ, փաստաթղթեր, ուսում և գործընկերների զեղչեր՝ մեկ ակումբում Telegram-ում։', c: 'Միանալ անվճար' },
|
||||
ES: { t: 'Ereván como en casa. Desde el primer día.', s: 'Servicios del hogar, documentos, formación y descuentos de socios — un club en Telegram.', c: 'Únete gratis' }
|
||||
};
|
||||
const codes = ['RU', 'EN', '中文', 'ՀԱՅ', 'ES'];
|
||||
const cur = this.state.lang;
|
||||
const base = 'min-width: 44px; height: 44px; padding: 0 10px; border-radius: 999px; border: none; font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; ';
|
||||
const langs = codes.map((code) => ({ code: code, pick: () => this.setState({ lang: code }), style: base + (code === cur ? 'background: #F6C3D3; color: #4A1028;' : 'background: transparent; color: #1E1B1A;') }));
|
||||
const qs = [
|
||||
['Нужно что-то устанавливать?', 'Нет. Клуб работает внутри Telegram: открываешь бота и пользуешься.'],
|
||||
['На каких языках можно общаться?', 'Русский, английский, китайский, армянский и испанский.'],
|
||||
['Чем Barev+ отличается от бесплатного?', 'Скидки [N]% на документы, быт, обучение и карьерные консультации.'],
|
||||
['Как получить подарок от агентства?', 'Код на месяц Barev+ указан в договоре аренды. Введи его в боте.']
|
||||
];
|
||||
const faq = qs.map(([q, a], i) => ({ q: q, a: a, open: this.state.open === i, sign: this.state.open === i ? '−' : '+', toggle: () => this.setState({ open: this.state.open === i ? -1 : i }) }));
|
||||
const c = copy[cur];
|
||||
return { langs: langs, title: c.t, sub: c.s, cta: c.c, faq: faq };
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user