лояльность: карта скидок (10 визитов, −10% на 5-й, офисы, приведите друга)
This commit is contained in:
parent
991563f370
commit
5c472e9a29
50
index.html
50
index.html
@ -31,6 +31,12 @@
|
|||||||
}
|
}
|
||||||
.kt-ai-card .kt-ai-chip { margin-bottom: 10px; }
|
.kt-ai-card .kt-ai-chip { margin-bottom: 10px; }
|
||||||
#lead-ok { color: var(--kt-ai-primary); font-weight: 500; margin: 0; }
|
#lead-ok { color: var(--kt-ai-primary); font-weight: 500; margin: 0; }
|
||||||
|
.loyalty-head { display: flex; align-items: center; gap: var(--kt-ai-space-5); flex-wrap: wrap; }
|
||||||
|
.loyalty-stamps { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--kt-ai-space-4); margin: var(--kt-ai-space-7) 0 var(--kt-ai-space-5); }
|
||||||
|
.loyalty-stamp { width: 48px; height: 48px; border-radius: 50%; border: 1.5px dashed var(--kt-ai-border-strong); display: inline-flex; align-items: center; justify-content: center; color: transparent; }
|
||||||
|
.loyalty-stamp-done { border-style: solid; border-color: var(--kt-ai-primary); background: var(--kt-ai-primary-subtle); color: var(--kt-ai-fg); }
|
||||||
|
.loyalty-gift { border-style: solid; border-color: var(--kt-ai-primary); background: var(--kt-ai-primary-subtle); color: var(--kt-ai-fg); }
|
||||||
|
.loyalty-note { margin: 0 0 var(--kt-ai-space-4); font-size: 13px; color: var(--kt-ai-fg-muted); }
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -41,6 +47,7 @@
|
|||||||
<span class="kt-ai-spacer"></span>
|
<span class="kt-ai-spacer"></span>
|
||||||
<a class="kt-ai-btn" data-variant="ghost" href="#services">Услуги</a>
|
<a class="kt-ai-btn" data-variant="ghost" href="#services">Услуги</a>
|
||||||
<a class="kt-ai-btn" data-variant="ghost" href="#prices">Цены</a>
|
<a class="kt-ai-btn" data-variant="ghost" href="#prices">Цены</a>
|
||||||
|
<a class="kt-ai-btn" data-variant="ghost" href="#loyalty">Скидки</a>
|
||||||
<a class="kt-ai-btn" data-variant="primary" href="#contacts">Заказать уборку</a>
|
<a class="kt-ai-btn" data-variant="primary" href="#contacts">Заказать уборку</a>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
@ -135,6 +142,48 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<section id="loyalty" class="kt-ai-section" data-divider="true">
|
||||||
|
<div class="kt-ai-wrap">
|
||||||
|
<div class="kt-ai-section-head">
|
||||||
|
<h2>Карта скидок</h2>
|
||||||
|
<p>Копите визиты — получайте бесплатную уборку и повышенную скидку.</p>
|
||||||
|
</div>
|
||||||
|
<article class="kt-ai-card loyalty-card" style="margin-top:var(--kt-ai-space-9)">
|
||||||
|
<div class="loyalty-head">
|
||||||
|
<strong>ЧистоДом · карта лояльности</strong>
|
||||||
|
<span class="kt-ai-chip">10 визитов — 11-й бесплатно</span>
|
||||||
|
</div>
|
||||||
|
<div class="loyalty-stamps" aria-label="Штампы за визиты">
|
||||||
|
<svg class="loyalty-stamp loyalty-stamp-done" aria-hidden="true"><use href="#check"></use></svg>
|
||||||
|
<svg class="loyalty-stamp loyalty-stamp-done" aria-hidden="true"><use href="#check"></use></svg>
|
||||||
|
<svg class="loyalty-stamp loyalty-stamp-done" aria-hidden="true"><use href="#check"></use></svg>
|
||||||
|
<svg class="loyalty-stamp loyalty-stamp-done" aria-hidden="true"><use href="#check"></use></svg>
|
||||||
|
<svg class="loyalty-stamp loyalty-stamp-done" aria-hidden="true"><use href="#check"></use></svg>
|
||||||
|
<span class="loyalty-stamp"></span>
|
||||||
|
<span class="loyalty-stamp"></span>
|
||||||
|
<span class="loyalty-stamp"></span>
|
||||||
|
<span class="loyalty-stamp"></span>
|
||||||
|
<svg class="loyalty-stamp loyalty-gift" aria-hidden="true"><use href="#sparkles"></use></svg>
|
||||||
|
</div>
|
||||||
|
<p class="loyalty-note">На 5-м визите — дополнительно −10% к счёту. Штампы действуют 12 месяцев.</p>
|
||||||
|
</article>
|
||||||
|
<div class="kt-ai-grid" data-cols="3" style="margin-top:var(--kt-ai-space-9)">
|
||||||
|
<article class="kt-ai-tile">
|
||||||
|
<h3>−10% на 5-й визит</h3>
|
||||||
|
<p>Постоянным клиентам с первого месяца. Аккумулируется на каждый следующий 5-й визит.</p>
|
||||||
|
</article>
|
||||||
|
<article class="kt-ai-tile">
|
||||||
|
<h3>Офисы от 3 месяцев</h3>
|
||||||
|
<p>Абонемент на регулярное обслуживание: −15% к каждой уборке, фиксированная смета.</p>
|
||||||
|
</article>
|
||||||
|
<article class="kt-ai-tile">
|
||||||
|
<h3>Приведи друга</h3>
|
||||||
|
<p>Вам и новому клиенту — −200 ₸ с первой заявки. Без лимита по количеству.</p>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<section id="how" class="kt-ai-section" data-divider="true">
|
<section id="how" class="kt-ai-section" data-divider="true">
|
||||||
<div class="kt-ai-wrap">
|
<div class="kt-ai-wrap">
|
||||||
<div class="kt-ai-section-head">
|
<div class="kt-ai-section-head">
|
||||||
@ -210,6 +259,7 @@
|
|||||||
<a class="kt-ai-link" href="tel:+77001234567">+7 700 123-45-67</a>
|
<a class="kt-ai-link" href="tel:+77001234567">+7 700 123-45-67</a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
|
<script src="design-system/icons/kt-ai-icons.js"></script>
|
||||||
<script src="script.js"></script>
|
<script src="script.js"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user