133 lines
6.1 KiB
HTML
133 lines
6.1 KiB
HTML
{{define "home.html"}}
|
||
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>{{.Title}}</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="/static/css/style.css">
|
||
</head>
|
||
<body>
|
||
{{template "shop_header" .}}
|
||
|
||
<section class="hero">
|
||
<div class="container hero__inner">
|
||
<div class="hero__content">
|
||
<span class="badge">Новая коллекция 2026</span>
|
||
<h1 class="hero__title">Всё лучшее —<br>в одном магазине</h1>
|
||
<p class="hero__text">Электроника, одежда, дом и сад. Покупайте с регистрацией или без — как вам удобно.</p>
|
||
<div class="hero__cta">
|
||
<a href="#catalog" class="btn btn--primary btn--lg">Смотреть каталог</a>
|
||
<a href="/register" class="btn btn--outline btn--lg">Создать аккаунт</a>
|
||
</div>
|
||
</div>
|
||
<div class="hero__visual">
|
||
<div class="hero__card hero__card--1">
|
||
<span class="hero__card-label">Бесплатная доставка</span>
|
||
<span class="hero__card-value">от 3 000 ₽</span>
|
||
</div>
|
||
<div class="hero__card hero__card--2">
|
||
<span class="hero__card-label">Покупка без регистрации</span>
|
||
<span class="hero__card-value">Доступна</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{{if .Categories}}
|
||
<section id="categories" class="section">
|
||
<div class="container">
|
||
<h2 class="section__title">Популярные категории</h2>
|
||
<div class="categories">
|
||
{{range .Categories}}
|
||
<a href="#catalog" class="category-card">
|
||
<span class="category-card__name">{{.Name}}</span>
|
||
<span class="category-card__count">{{.Count}} товаров</span>
|
||
</a>
|
||
{{end}}
|
||
</div>
|
||
</div>
|
||
</section>
|
||
{{end}}
|
||
|
||
<section id="catalog" class="section section--alt">
|
||
<div class="container">
|
||
<div class="section__header">
|
||
<h2 class="section__title">Популярные товары</h2>
|
||
</div>
|
||
<div class="products">
|
||
{{range .Products}}
|
||
<article class="product-card">
|
||
<div class="product-card__image">
|
||
<img src="{{.ImageURL}}" alt="{{.Name}}" loading="lazy">
|
||
<span class="product-card__badge">{{.Category}}</span>
|
||
</div>
|
||
<div class="product-card__body">
|
||
<h3 class="product-card__title">{{.Name}}</h3>
|
||
<p class="product-card__desc">{{plain .Description}}</p>
|
||
<div class="product-card__footer">
|
||
<span class="product-card__price">{{printf "%.0f" .Price}} ₽</span>
|
||
<form method="POST" action="/cart/add">
|
||
<input type="hidden" name="product_id" value="{{.ID}}">
|
||
<input type="hidden" name="quantity" value="1">
|
||
<button type="submit" class="btn btn--primary btn--sm">В корзину</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
{{else}}
|
||
<p class="empty">Товары скоро появятся в каталоге.</p>
|
||
{{end}}
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="delivery" class="section">
|
||
<div class="container">
|
||
<h2 class="section__title">Почему выбирают нас</h2>
|
||
<div class="features">
|
||
<div class="feature">
|
||
<div class="feature__icon">🚚</div>
|
||
<h3 class="feature__title">Быстрая доставка</h3>
|
||
<p class="feature__text">Доставим заказ за 1–3 дня</p>
|
||
</div>
|
||
<div class="feature">
|
||
<div class="feature__icon">👤</div>
|
||
<h3 class="feature__title">Без регистрации</h3>
|
||
<p class="feature__text">Оформите заказ как гость — достаточно email и телефона</p>
|
||
</div>
|
||
<div class="feature">
|
||
<div class="feature__icon">🔒</div>
|
||
<h3 class="feature__title">Личный кабинет</h3>
|
||
<p class="feature__text">История заказов и сохранённые данные для постоянных клиентов</p>
|
||
</div>
|
||
<div class="feature">
|
||
<div class="feature__icon">💬</div>
|
||
<h3 class="feature__title">Поддержка 24/7</h3>
|
||
<p class="feature__text">Ответим на любой вопрос</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<footer class="footer">
|
||
<div class="container footer__inner">
|
||
<div class="footer__brand">
|
||
<span class="logo__icon">◆</span>
|
||
<span class="logo__text">Shop</span>
|
||
<p class="footer__copy">© 2026 Shop. Все права защищены.</p>
|
||
</div>
|
||
<div class="footer__links">
|
||
<a href="/account">Личный кабинет</a>
|
||
<a href="/cart">Корзина</a>
|
||
<a href="/login">Вход</a>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
</body>
|
||
</html>
|
||
{{end}}
|