/
hellok1tta
/
html-css
Обзор
Документация
Войти
/
hellok1tta
/
html-css
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
frontend/workshops.html
315 строк
17 KB
hellok1tta
upload files
20 дек 2025, 12:41
20 дек 2025, 12:41
b528fd7
Код
Авторство
О чём код?
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Мастер-классы</title> <style> @import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Unbounded:wght@200..900&display=swap'); </style> <link rel="stylesheet" href="assets/css/main.css"> <link rel="website icon" type="png" href="assets/img/H.png"> </head> <body> <header> <nav> <div class="logo"> <a href="index.html"><img src="assets/img/Heaven.png" alt="лого"></a> </div> <div class="menu"> <a class="menu-btn" href="menu.html">Меню</a> <a class="menu-btn" href="promotions.html">Акции</a> <a class="menu-btn" href="workshops.html">Мастер-классы</a> <a class="menu-btn" href="contacts.html">Контакты</a> <a class="a-btn" href="account.html">Личный Кабинет</a> <a class="a-btn cart-btn" href="cart.html"> 🛒 <span id="cartCount" class="cart-count">0</span> </a> </div> <button class="burger-menu" id="burgerMenu" aria-label="Открыть меню"> <span></span> <span></span> <span></span> </button> </nav> <div class="mobile-menu-overlay" id="mobileMenuOverlay"></div> <div class="mobile-menu" id="mobileMenu"> <div class="mobile-menu-header"> <a href="index.html" class="mobile-logo"> <img src="assets/img/Heaven.png" alt="Heaven"> </a> </div> <div class="mobile-menu-content"> <a class="mobile-menu-link" href="menu.html">Меню</a> <a class="mobile-menu-link" href="promotions.html">Акции</a> <a class="mobile-menu-link" href="workshops.html">Мастер-классы</a> <a class="mobile-menu-link" href="contacts.html">Контакты</a> <div class="mobile-menu-buttons"> <a class="a-btn mobile-account-btn" href="account.html"> Личный Кабинет </a> <a class="a-btn mobile-cart-btn" href="cart.html"> Корзина <span id="mobileCartCount" class="cart-count">0</span> </a> </div> </div> </div> </header> <main class="workshops-main"> <div class="workshops-container"> <h1>Мастер-классы по кофе и десертам</h1> <p class="subtitle">Научитесь создавать кофейные шедевры у лучших бариста</p> <!-- Ближайшие мастер-классы --> <section class="upcoming-workshops"> <h2>Ближайшие мероприятия</h2> <div class="workshops-grid"> <!-- МК 1 --> <div class="workshop-card"> <div class="workshop-badge">Скоро</div> <div class="workshop-image"> <img src="assets/img/workshop1.jpg" alt="Латте-арт"> </div> <div class="workshop-content"> <h3>Основы латте-арта</h3> <div class="workshop-meta"> <span class="date">📅 15 декабря, 18:00</span> <span class="duration">⏰ 1.5 часа</span> <span class="price">💰 2000 ₽</span> </div> <div class="workshop-description"> <p>Научитесь создавать базовые рисунки на кофе:</p> <ul> <li>Сердце</li> <li>Тюльпан</li> <li>Розетта</li> </ul> </div> <div class="workshop-details"> <p><strong>Ведущий:</strong> Анна, главный бариста</p> <p><strong>Место:</strong> Кофейня на Текучёва</p> <p><strong>Уровень:</strong> Начинающий</p> </div> <button class="a-btn register-btn" data-workshop-id="1">Записаться</button> </div> </div> <!-- МК 2 --> <div class="workshop-card featured"> <div class="workshop-badge">Популярный</div> <div class="workshop-image"> <img src="assets/img/workshop2.jpg" alt="Десерты"> </div> <div class="workshop-content"> <h3>Домашние десерты</h3> <div class="workshop-meta"> <span class="date">📅 20 декабря, 16:00</span> <span class="duration">⏰ 3 часа</span> <span class="price">💰 2000 ₽</span> </div> <div class="workshop-description"> <p>Приготовьте три десерта своими руками:</p> <ul> <li>Тирамису</li> <li>Чизкейк Нью-Йорк</li> <li>Карамельные эклеры</li> </ul> </div> <div class="workshop-details"> <p><strong>Ведущий:</strong> Максим, кондитер</p> <p><strong>Место:</strong> Кулинарная студия</p> <p><strong>Уровень:</strong> Любой</p> </div> <button class="a-btn register-btn" data-workshop-id="2">Записаться</button> </div> </div> <!-- МК 3 --> <div class="workshop-card"> <div class="workshop-image"> <img src="assets/img/workshop3.jpg" alt="Холодный кофе"> </div> <div class="workshop-content"> <h3>Зимние напитки</h3> <div class="workshop-meta"> <span class="date">📅 25 декабря, 14:00</span> <span class="duration">⏰ 2.5 часа</span> <span class="price">💰 1200 ₽</span> </div> <div class="workshop-description"> <p>Освойте приготовление согревающих напитков:</p> <ul> <li>Вишневый глинтвейн б/а</li> <li>Имбирно-пряничный латте</li> <li>Сливочное пиво Гарри Поттера</li> </ul> </div> <div class="workshop-details"> <p><strong>Ведущий:</strong> Виктория, менеджер</p> <p><strong>Место:</strong> Кофейня на Садовой</p> <p><strong>Уровень:</strong> Любой</p> </div> <button class="a-btn register-btn" data-workshop-id="3">Записаться</button> </div> </div> </div> </section> <section class="schedule"> <h2>Расписание на месяц</h2> <div class="calendar"> <div class="calendar-header"> <h3 id="calendarMonth">Декабрь 2025</h3> </div> <div class="calendar-grid" id="calendarGrid"> </div> </div> </section> <section class="registration-form"> <h2>Запись на мастер-класс</h2> <div id="formMessage" class="form-message"></div> <form id="workshopRegistration"> <div class="form-group"> <label for="workshopSelect">Выберите мастер-класс:</label> <select id="workshopSelect" required> <option value="">Выберите</option> <option value="1">Основы латте-арта (15 декабря, 2000 ₽)</option> <option value="2">Домашние десерты (20 декабря, 2000 ₽)</option> <option value="3">Зимние напитки (25 декабря, 1200 ₽)</option> </select> </div> <div class="form-group"> <label for="participantName">Ваше имя:</label> <input type="text" id="participantName" required> </div> <div class="form-group"> <label for="participantEmail">Email:</label> <input type="email" id="participantEmail" required> </div> <div class="form-group"> <label for="participantPhone">Телефон:</label> <input type="tel" id="participantPhone" placeholder="+7 (999) 123-45-67" required> </div> <div class="form-group"> <label for="participantsCount">Количество участников:</label> <input type="number" id="participantsCount" min="1" max="5" value="1"> </div> <div class="form-group"> <label for="specialRequests">Особые пожелания:</label> <textarea id="specialRequests" rows="3"></textarea> </div> <button type="submit" class="a-btn">Отправить заявку</button> </form> </section> <section class="testimonials"> <h2>Отзывы участников</h2> <div class="testimonials-grid"> <div class="testimonial"> <div class="testimonial-content"> <p>"Анна — потрясающий преподаватель! За 2 часа научилась делать сердечко на кофе. Теперь радую мужа каждое утро!"</p> </div> <div class="testimonial-author"> <strong>Елена, 28 лет</strong> <span>Участница мастер-класса по латте-арту</span> </div> </div> <div class="testimonial"> <div class="testimonial-content"> <p>"Пришел с нулевыми знаниями о кофе, ушел с пониманием разницы между арабикой и робустой. Очень информативно!"</p> </div> <div class="testimonial-author"> <strong>Алексей, 35 лет</strong> <span>Участник кофейного сомелье</span> </div> </div> <div class="testimonial"> <div class="testimonial-content"> <p>"Десерты получились даже лучше, чем в кофейне! Максим делился секретными приемами. Обязательно приду еще!"</p> </div> <div class="testimonial-author"> <strong>Марина, 42 года</strong> <span>Участница десертного мастер-класса</span> </div> </div> </div> </section> <section class="faq"> <h2>Часто задаваемые вопросы</h2> <div class="faq-list"> <div class="faq-item"> <div class="faq-question">Нужен ли опыт?</div> <div class="faq-answer">Нет, большинство мастер-классов рассчитаны на начинающих. Уровень указан в описании каждого занятия.</div> </div> <div class="faq-item"> <div class="faq-question">Что входит в стоимость?</div> <div class="faq-answer">Все ингредиенты, оборудование, работа преподавателя и кофе-брейк. Вы также получаете рецепты и сертификат.</div> </div> <div class="faq-item"> <div class="faq-question">Можно ли отменить запись?</div> <div class="faq-answer">Да, отменить запись можно за 48 часов до начала. При отмене позже этого срока возвращается 50% стоимости.</div> </div> <div class="faq-item"> <div class="faq-question">Есть ли подарочные сертификаты?</div> <div class="faq-answer">Да, вы можете приобрести подарочный сертификат на любой мастер-класс в наших кофейнях.</div> </div> </div> </section> </div> </main> <footer> <div class="footer-container"> <div class="footer-content"> <div class="footer-column animate-on-scroll fade-in-up"> <h3>Кофейня Heaven</h3> <p>Ваш уголок рая на земле</p> </div> <div class="footer-column animate-on-scroll fade-in-up"> <h3>Контакты</h3> <ul> <li>Ростов-на-Дону, ул. Текучёва, 139а</li> <li>+7 (999) 123-45-67</li> <li>info@heaven-coffee.ru</li> </ul> </div> <div class="footer-column animate-on-scroll fade-in-up"> <h3>Часы работы</h3> <ul> <li>Пн-Пт: 8:00 - 22:00</li> <li>Сб-Вс: 9:00 - 23:00</li> </ul> </div> </div> <p class="copyright">2025 Heaven | Создано с <i class="fas fa-heart" style="color: #ffffff;"></i> для ценителей кофе</p> </div> </footer> <script src="/assets/js/burger-menu.js"></script> <script src="/assets/js/cart-counter.js"></script> <script src="/assets/js/workshops.js"></script> <script src="assets/js/animations.js"></script> </body> </html>