630 lines
32 KiB
HTML
630 lines
32 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Hotel 777 — Гостиница на берегу моря в Абхазии</title>
|
||
<link rel="stylesheet" href="css/bootstrap.min.css">
|
||
<link rel="stylesheet" href="css/inter-font.css">
|
||
<link rel="stylesheet" href="css/playfair-font.css">
|
||
<link rel="stylesheet" href="css/fontawesome.min.css">
|
||
<link rel="stylesheet" href="css/style.css">
|
||
<link rel="stylesheet" href="css/reviews.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- Preloader -->
|
||
<div id="preloader">
|
||
<div class="logo-text">HOTEL 777</div>
|
||
<div class="loader-bar"></div>
|
||
</div>
|
||
|
||
<!-- Navigation -->
|
||
<nav class="navbar navbar-expand-lg fixed-top">
|
||
<div class="container">
|
||
<a class="navbar-brand" href="#">HOTEL <span>777</span></a>
|
||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMenu">
|
||
<span class="navbar-toggler-icon"></span>
|
||
</button>
|
||
<div class="collapse navbar-collapse" id="navMenu">
|
||
<ul class="navbar-nav ms-auto">
|
||
<li class="nav-item"><a class="nav-link" href="#about">О нас</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#rooms">Номера</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#gallery">Галерея</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#activities">Развлечения</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#reviews">Отзывы</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#host">Хозяин</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#contact">Контакты</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="/admin" style="color: var(--gold);"><i class="fas fa-cog"></i> Управление</a></li>
|
||
<li class="nav-item language-switcher">
|
||
<button class="lang-btn active" data-lang="ru" onclick="switchLang('ru')">RU</button>
|
||
<button class="lang-btn" data-lang="en" onclick="switchLang('en')">EN</button>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- Hero Section -->
|
||
<section class="hero" id="home">
|
||
<img class="hero-bg" src="img/h777.webp" alt="Hotel 777">
|
||
<div class="hero-overlay"></div>
|
||
<div class="container">
|
||
<div class="hero-content">
|
||
<div class="hero-badge"><i class="fas fa-anchor me-2"></i>Набережная ул. 1, Мгудзырхуа</div>
|
||
<h1 class="hero-title">Hotel <span>777</span><br>Абхазия</h1>
|
||
<p class="hero-subtitle">Ваш идеальный отдых на берегу Чёрного моря в самом сердце Абхазии. Комфорт, природа и гостеприимство — всё, что нужно для незабываемого отпуска.</p>
|
||
<div class="hero-buttons">
|
||
<a href="#rooms" class="btn-gold"><i class="fas fa-bed"></i> Выбрать номер</a>
|
||
<a href="tel:89409270080" class="btn-outline-white"><i class="fas fa-phone"></i> Позвонить</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="hero-stats">
|
||
<div class="container">
|
||
<div class="row align-items-center justify-content-center">
|
||
<div class="col-auto">
|
||
<div class="stat-item">
|
||
<div class="stat-number"><span class="counter" data-target="5">0</span></div>
|
||
<div class="stat-label">мин до моря</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-auto"><div class="stat-divider"></div></div>
|
||
<div class="col-auto">
|
||
<div class="stat-item">
|
||
<div class="stat-number"><span class="counter" data-target="3">0</span></div>
|
||
<div class="stat-label">категории</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-auto"><div class="stat-divider"></div></div>
|
||
<div class="col-auto">
|
||
<div class="stat-item">
|
||
<div class="stat-number"><span class="counter" data-target="98">0</span>%</div>
|
||
<div class="stat-label">довольных гостей</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-auto"><div class="stat-divider"></div></div>
|
||
<div class="col-auto">
|
||
<div class="stat-item">
|
||
<div class="stat-number"><span class="counter" data-target="365">0</span></div>
|
||
<div class="stat-label">дней в году</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- About Section -->
|
||
<section class="section section-light" id="about">
|
||
<div class="container">
|
||
<div class="row align-items-center g-5">
|
||
<div class="col-lg-6 animate-on-scroll">
|
||
<div class="about-image-wrapper">
|
||
<img src="img/123f15ff3-55ae-428f-8af9-7d53c01d28a5.webp" alt="Вид на реку Гудаута">
|
||
<div class="about-image-badge">
|
||
<span class="big">777</span>
|
||
<span class="small">Счастье рядом</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 animate-on-scroll">
|
||
<div class="section-badge">О гостинице</div>
|
||
<h2 class="section-title">Добро пожаловать в <span style="color: var(--primary);">Hotel 777</span></h2>
|
||
<div class="ornament"><div class="ornament-line"></div><div class="ornament-diamond"></div><div class="ornament-line"></div></div>
|
||
<p style="font-size: 1.05rem; line-height: 1.8; color: #555; margin-bottom: 20px;">
|
||
Гостиница <strong>Hotel 777</strong> расположена в живописном селе Мгудзырхуа, Гудаутский район Абхазии, на Набережной улице, 1 — прямо на берегу реки Гудаута и всего в нескольких шагах от Чёрного моря.
|
||
</p>
|
||
<p style="font-size: 1.05rem; line-height: 1.8; color: #555; margin-bottom: 25px;">
|
||
Мы предлагаем уютные номера всех категорий, вкусную домашнюю кухню в столовой, аренду SUP-бордов и близость к пляжному кафе. Наши гости ценят аутентичное абхазское гостеприимство и современный комфорт.
|
||
</p>
|
||
<div class="feature-grid">
|
||
<div class="feature-item">
|
||
<div class="feature-icon"><i class="fas fa-water"></i></div>
|
||
<div class="feature-text">
|
||
<h5>На берегу моря</h5>
|
||
<p>Чистый пляж в 5 минутах ходьбы</p>
|
||
</div>
|
||
</div>
|
||
<div class="feature-item">
|
||
<div class="feature-icon"><i class="fas fa-snowflake"></i></div>
|
||
<div class="feature-text">
|
||
<h5>Кондиционер</h5>
|
||
<p>В каждом номере для вашего комфорта</p>
|
||
</div>
|
||
</div>
|
||
<div class="feature-item">
|
||
<div class="feature-icon"><i class="fas fa-wifi"></i></div>
|
||
<div class="feature-text">
|
||
<h5>Бесплатный WiFi</h5>
|
||
<p>Высокоскоростной интернет на территории</p>
|
||
</div>
|
||
</div>
|
||
<div class="feature-item">
|
||
<div class="feature-icon"><i class="fas fa-utensils"></i></div>
|
||
<div class="feature-text">
|
||
<h5>Столовая</h5>
|
||
<p>Домашняя кухня — абхазская и русская</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Rooms Section -->
|
||
<section class="section section-light" id="rooms" style="background: #f8fafc;">
|
||
<div class="container">
|
||
<div class="section-header animate-on-scroll">
|
||
<div class="section-badge">Размещение</div>
|
||
<h2 class="section-title">Выберите свой номер</h2>
|
||
<div class="abkhazian-pattern"></div>
|
||
<p class="section-subtitle">Четыре категории номеров — от 2x-местного до люкса. Каждый номер оснащён всем необходимым для идеального отдыха.</p>
|
||
</div>
|
||
<div id="roomsGrid" class="row g-4"></div>
|
||
<div id="roomsEmpty" style="display: none; text-align: center; padding: 40px; color: #94a3b8;">
|
||
<!--
|
||
<i class="fas fa-door-open" style="font-size: 3rem; margin-bottom: 16px;"></i>
|
||
<p>Номера скоро появятся</p>
|
||
-->
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Gallery Section -->
|
||
<section class="section section-light" id="gallery">
|
||
<div class="container">
|
||
<div class="section-header animate-on-scroll">
|
||
<div class="section-badge">Галерея</div>
|
||
<h2 class="section-title">Красота Абхазии</h2>
|
||
<div class="abkhazian-pattern"></div>
|
||
<p class="section-subtitle">Насладитесь видами нашей гостиницы, побережья и окрестностей Гудауты</p>
|
||
</div>
|
||
<div class="gallery-grid animate-on-scroll">
|
||
<div class="gallery-item">
|
||
<img src="img/h777.webp" alt="Hotel 777">
|
||
<div class="gallery-overlay"><span>Наша гостиница</span></div>
|
||
</div>
|
||
<div class="gallery-item">
|
||
<img src="img/16536f4b7-0c1c-4bbb-8537-96bbdd2e0886.webp" alt="Пляж">
|
||
<div class="gallery-overlay"><span>Пляж Гудауты</span></div>
|
||
</div>
|
||
<div class="gallery-item">
|
||
<img src="img/1e4e22546-0208-4ba8-96fb-02052aecc8b5.webp" alt="Закат">
|
||
<div class="gallery-overlay"><span>Закат на море</span></div>
|
||
</div>
|
||
<div class="gallery-item">
|
||
<img src="img/1e1ad70fe-ff01-4f94-9ca9-4926eba5bdd2.webp" alt="Горы">
|
||
<div class="gallery-overlay"><span>Горы Абхазии</span></div>
|
||
</div>
|
||
<div class="gallery-item">
|
||
<img src="img/123f15ff3-55ae-428f-8af9-7d53c01d28a5.webp" alt="Река">
|
||
<div class="gallery-overlay"><span>Река Гудаута</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Activities Section -->
|
||
<section class="section section-dark" id="activities">
|
||
<div class="container">
|
||
<div class="section-header animate-on-scroll">
|
||
<div class="section-badge">Развлечения</div>
|
||
<h2 class="section-title">Чем заняться рядом</h2>
|
||
<div class="abkhazian-pattern"></div>
|
||
<p class="section-subtitle">SUP-борды, пляжное кафе и незабываемые виды — всё это ждёт вас</p>
|
||
</div>
|
||
<div class="row g-4">
|
||
<div class="col-lg-4 animate-on-scroll">
|
||
<div class="activity-card">
|
||
<img src="img/105d059e5-a204-499f-a01c-c540f6ae1e5d.webp" alt="SUP-борд">
|
||
<div class="activity-overlay">
|
||
<div class="activity-icon"><i class="fas fa-water"></i></div>
|
||
<h3 class="activity-title">SUP-борды</h3>
|
||
<p class="activity-desc">Аренда SUP-бордов прямо на пляже. Исследуйте побережье с воды — идеальный способ увидеть Абхазию с нового ракурса!</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 animate-on-scroll">
|
||
<div class="activity-card">
|
||
<img src="img/18abbb136-0e24-4c92-a568-fec8011e029b.webp" alt="Кафе у пляжа">
|
||
<div class="activity-overlay">
|
||
<div class="activity-icon"><i class="fas fa-coffee"></i></div>
|
||
<h3 class="activity-title">Кафе у пляжа</h3>
|
||
<p class="activity-desc">Всего 2 минуты пешком — уютное кафе с видом на море. Абхазская и русская кухня, свежие морепродукты и ароматный кофе.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 animate-on-scroll">
|
||
<div class="activity-card">
|
||
<img src="img/1f00325ba-df2c-4bb9-9ec6-28958e11f843.webp" alt="Столовая">
|
||
<div class="activity-overlay">
|
||
<div class="activity-icon"><i class="fas fa-utensils"></i></div>
|
||
<h3 class="activity-title">Столовая Hotel 777</h3>
|
||
<p class="activity-desc">Домашняя кухня каждый день! Завтраки, обеды и ужины из свежих местных продуктов. Аджика, хачапури, азу и многое другое.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- CTA Banner -->
|
||
<section class="section section-light" style="background: #fff;">
|
||
<div class="container">
|
||
<div class="cta-banner animate-on-scroll">
|
||
<h2>Забронируйте номер прямо сейчас!</h2>
|
||
<p>Лучшие цены гарантированы при бронировании напрямую. Позвоните Рауфу Алексеевичу или оставьте заявку.</p>
|
||
<a href="tel:89409270080" class="btn-dark-cta"><i class="fas fa-phone"></i> 8 (940) 927-00-80</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Reviews Section -->
|
||
<section class="section reviews-section" id="reviews">
|
||
<div class="container">
|
||
<div class="section-header animate-on-scroll">
|
||
<div class="section-badge" data-i18n="reviews.title">Отзывы</div>
|
||
<h2 class="section-title" data-i18n="reviews.title">Что говорят наши гости</h2>
|
||
<div class="abkhazian-pattern"></div>
|
||
</div>
|
||
|
||
<div class="reviews-grid" id="reviewsGrid"></div>
|
||
|
||
<div class="reviews-empty" id="reviewsEmpty" style="display: none;">
|
||
<i class="fas fa-star-half-alt"></i>
|
||
<p data-i18n="reviews.write_first">Будьте первым, кто оставит отзыв!</p>
|
||
</div>
|
||
|
||
<div class="reviews-actions">
|
||
<button class="btn-gold" onclick="openReviewModal()" data-i18n="reviews.leave_review">
|
||
<i class="fas fa-pen"></i> Оставить отзыв
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Host Section -->
|
||
<section class="section section-light" id="host">
|
||
<div class="container">
|
||
<div class="section-header animate-on-scroll">
|
||
<div class="section-badge">Хозяин Hotel 777</div>
|
||
<h2 class="section-title">Рауф Алексеевич</h2>
|
||
<div class="abkhazian-pattern"></div>
|
||
</div>
|
||
<div class="host-card animate-on-scroll">
|
||
<div class="host-image">
|
||
<div class="host-portrait">
|
||
<div class="host-portrait-ring"></div>
|
||
<i class="fas fa-user" style="position: relative; z-index: 2;"></i>
|
||
</div>
|
||
</div>
|
||
<div class="host-body">
|
||
<p style="font-size: 1.1rem; color: var(--gold); font-weight: 600; margin-bottom: 20px; font-style: italic;">
|
||
«Абхазское гостеприимство — это не работа, это образ жизни»
|
||
</p>
|
||
<p style="font-size: 1rem; color: #666; line-height: 1.7; margin-bottom: 25px;">
|
||
Рауф Алексеевич — настоящий хозяин и душа Hotel 777. Он встречает каждого гостя с теплотой и заботой, как родного человека. Всегда подскажет лучшие маршруты по Абхазии, организует экскурсии к самым красивым местам — Новоафонскому монастырю, озеру Рица, Гагрскому парку.
|
||
</p>
|
||
<p style="font-size: 1rem; color: #666; line-height: 1.7; margin-bottom: 25px;">
|
||
Домашняя кухня — отдельная достопримечательность гостиницы. Свежие местные продукты, абхазские и русские блюда, приготовленные с душой — абиц, ачапа, хачапури, шашлык и многое другое. Чистые номера, искренняя улыбка и внимание к каждой детали — это то, что делает Hotel 777 особенным.
|
||
</p>
|
||
<a href="tel:89409270080" class="host-contact">
|
||
<i class="fas fa-phone"></i> 8 (940) 927-00-80
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Contact Section -->
|
||
<section class="section contact-section" id="contact">
|
||
<div class="container">
|
||
<div class="section-header animate-on-scroll">
|
||
<div class="section-badge">Контакты</div>
|
||
<h2 class="section-title" style="color: #fff;">Свяжитесь с нами</h2>
|
||
<div class="abkhazian-pattern"></div>
|
||
<p class="section-subtitle">Рауф Алексеевич всегда рад ответить на ваши вопросы и помочь спланировать идеальный отдых</p>
|
||
</div>
|
||
<div class="row g-5">
|
||
<div class="col-lg-5 animate-on-scroll">
|
||
<div class="contact-info-item">
|
||
<div class="contact-icon"><i class="fas fa-user-tie"></i></div>
|
||
<div>
|
||
<div class="contact-label">Хозяин гостиницы</div>
|
||
<div class="contact-value">Рауф Алексеевич</div>
|
||
</div>
|
||
</div>
|
||
<div class="contact-info-item">
|
||
<div class="contact-icon"><i class="fas fa-map-marker-alt"></i></div>
|
||
<div>
|
||
<div class="contact-label">Адрес</div>
|
||
<div class="contact-value">Абхазия, Гудаутский район,<br>с. Мгудзырхуа, Набережная ул., 1</div>
|
||
</div>
|
||
</div>
|
||
<div class="contact-info-item">
|
||
<div class="contact-icon"><i class="fas fa-phone"></i></div>
|
||
<div>
|
||
<div class="contact-label">Телефон</div>
|
||
<div class="contact-value"><a href="tel:89409270080">8 (940) 927-00-80</a></div>
|
||
</div>
|
||
</div>
|
||
<div class="contact-info-item">
|
||
<div class="contact-icon"><i class="fas fa-clock"></i></div>
|
||
<div>
|
||
<div class="contact-label">Режим работы</div>
|
||
<div class="contact-value">Круглосуточно, 365 дней в году</div>
|
||
</div>
|
||
</div>
|
||
<div class="contact-info-item">
|
||
<div class="contact-icon"><i class="fas fa-water"></i></div>
|
||
<div>
|
||
<div class="contact-label">Расположение</div>
|
||
<div class="contact-value">На берегу реки Гудаута,<br>5 минут до Чёрного моря</div>
|
||
</div>
|
||
</div>
|
||
<div class="mt-4">
|
||
<a href="https://wa.me/89409270080" class="btn-gold" target="_blank" style="text-decoration: none;">
|
||
<i class="fab fa-whatsapp"></i> Написать Рауфу в WhatsApp
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-7 animate-on-scroll">
|
||
<div class="map-container">
|
||
<i class="fas fa-map-marked-alt"></i>
|
||
<span>Гудаутский район, Абхазия</span>
|
||
<span style="font-size: 0.8rem; color: rgba(255,255,255,0.4);">E 40.5° N 43.1°</span>
|
||
<div style="padding: 20px; text-align: center;">
|
||
<p style="color: rgba(255,255,255,0.5); font-size: 0.9rem;">
|
||
<i class="fas fa-info-circle me-2"></i>
|
||
Мгудзырхуа — уютное село на Набережной улице, окружённое виноградниками и горами.
|
||
Чистый воздух, тишина и близость к морю — идеальное место для отдыха.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Footer -->
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<div class="row g-4">
|
||
<div class="col-lg-4">
|
||
<div class="footer-brand">HOTEL <span>777</span></div>
|
||
<p class="footer-desc">Гостиница на берегу Чёрного моря в Абхазии. Комфортные номера, домашняя кухня Рауфа Алексеевича и настоящее абхазское гостеприимство.</p>
|
||
<div class="footer-social">
|
||
<a href="#"><i class="fab fa-whatsapp"></i></a>
|
||
<a href="#"><i class="fab fa-telegram"></i></a>
|
||
<a href="#"><i class="fab fa-instagram"></i></a>
|
||
<a href="tel:89409270080"><i class="fas fa-phone"></i></a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-2 col-md-4">
|
||
<div class="footer-title">Навигация</div>
|
||
<ul class="footer-links">
|
||
<li><a href="#home">Главная</a></li>
|
||
<li><a href="#about">О нас</a></li>
|
||
<li><a href="#rooms">Номера</a></li>
|
||
<li><a href="#gallery">Галерея</a></li>
|
||
<li><a href="#reviews">Отзывы</a></li>
|
||
<li><a href="#host">Хозяин</a></li>
|
||
<li><a href="/admin" style="color: var(--gold);"><i class="fas fa-cog"></i> Управление</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-lg-3 col-md-4">
|
||
<div class="footer-title">Услуги</div>
|
||
<ul class="footer-links">
|
||
<li><a href="#rooms">Номера Эконом</a></li>
|
||
<li><a href="#rooms">Номера Стандарт</a></li>
|
||
<li><a href="#rooms">Номера VIP</a></li>
|
||
<li><a href="#activities">Аренда SUP-бордов</a></li>
|
||
<li><a href="#activities">Столовая</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-lg-3 col-md-4">
|
||
<div class="footer-title">Контакты</div>
|
||
<ul class="footer-links">
|
||
<li><a href="tel:89409270080"><i class="fas fa-phone me-2"></i>8 (940) 927-00-80</a></li>
|
||
<li><a href="#"><i class="fas fa-user me-2"></i>Рауф Алексеевич</a></li>
|
||
<li><a href="#"><i class="fas fa-map-marker-alt me-2"></i>с. Мгудзырхуа</a></li>
|
||
<li><a href="#"><i class="fas fa-water me-2"></i>Набережная ул., 1</a></li>
|
||
<li><a href="#"><i class="fas fa-flag me-2"></i>Абхазия, Гудаутский р-н</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="footer-bottom">
|
||
<p>© 2025 Hotel 777. Хозяин — Рауф Алексеевич. Все права защищены. Абхазия, Гудаутский район, с. Мгудзырхуа.</p>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- Floating Phone Button -->
|
||
<a href="tel:89409270080" class="float-phone">
|
||
<i class="fas fa-phone"></i>
|
||
</a>
|
||
|
||
<!-- Booking Modal -->
|
||
<div class="modal fade" id="bookingModal" tabindex="-1">
|
||
<div class="modal-dialog modal-dialog-centered">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title" style="font-family: 'Playfair Display', serif; font-size: 1.5rem;">
|
||
<i class="fas fa-calendar-check me-2"></i>Бронирование номера
|
||
</h5>
|
||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form id="bookingForm">
|
||
<div class="mb-3">
|
||
<label class="form-label">Выбранный номер</label>
|
||
<input type="text" class="form-control" id="selectedRoom" name="room" readonly style="background: #f0f4f8; font-weight: 600;">
|
||
<input type="hidden" id="selectedRoomId" name="room_id">
|
||
</div>
|
||
<div class="row g-3">
|
||
<div class="col-md-6">
|
||
<label class="form-label">Ваше имя</label>
|
||
<input type="text" class="form-control" name="name" placeholder="Иван Иванов" required>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label class="form-label">Телефон</label>
|
||
<input type="tel" class="form-control" name="phone" placeholder="+7 (___) ___-__-__" required>
|
||
</div>
|
||
</div>
|
||
<div class="row g-3 mt-1">
|
||
<div class="col-md-6">
|
||
<label class="form-label">Дата заезда</label>
|
||
<input type="date" class="form-control" name="checkin" required>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label class="form-label">Дата выезда</label>
|
||
<input type="date" class="form-control" name="checkout" required>
|
||
</div>
|
||
</div>
|
||
<div class="row g-3 mt-1">
|
||
<div class="col-md-6">
|
||
<label class="form-label">Кол-во гостей</label>
|
||
<select class="form-select" name="guests">
|
||
<option value="1">1 гость</option>
|
||
<option value="2">2 гостя</option>
|
||
<option value="3">3 гостя</option>
|
||
<option value="4">4 гостя</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label class="form-label">Пожелания</label>
|
||
<input type="text" class="form-control" name="wishes" placeholder="Например: вид на море">
|
||
</div>
|
||
</div>
|
||
<div class="row g-3 mt-1">
|
||
<div class="col-md-6">
|
||
<label class="form-label">Промокод</label>
|
||
<input type="text" class="form-control" id="promocodeInput" name="promocode" placeholder="Введите промокод" style="text-transform: uppercase;">
|
||
<div id="promocodeError" class="text-danger small mt-1" style="display: none;"></div>
|
||
</div>
|
||
<div class="col-md-6 d-flex align-items-end">
|
||
<button type="button" class="btn btn-outline-primary btn-sm" id="checkPromocodeBtn" style="width: 100%;">Проверить промокод</button>
|
||
</div>
|
||
</div>
|
||
<div id="priceInfo" class="mt-3" style="display: none; padding: 15px; background: #f8f9fa; border-radius: 10px;">
|
||
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
|
||
<span>Базовая стоимость:</span>
|
||
<span id="basePriceDisplay">—</span>
|
||
</div>
|
||
<div style="display: flex; justify-content: space-between; margin-bottom: 8px; color: #16a34a;">
|
||
<span>Скидка (<span id="discountPercentDisplay">0</span>%):</span>
|
||
<span id="discountAmountDisplay">—</span>
|
||
</div>
|
||
<div style="display: flex; justify-content: space-between; font-weight: 700; font-size: 1.1rem; border-top: 1px solid #dee2e6; padding-top: 8px;">
|
||
<span>Итого к оплате:</span>
|
||
<span id="totalPriceDisplay" style="color: var(--primary);">—</span>
|
||
</div>
|
||
</div>
|
||
<div class="mt-4">
|
||
<button type="submit" class="btn-submit-booking">
|
||
<i class="fas fa-paper-plane me-2"></i>Отправить заявку
|
||
</button>
|
||
</div>
|
||
<p class="text-center mt-3" style="font-size: 0.8rem; color: #999;">
|
||
Или позвоните Рауфу Алексеевичу: <a href="tel:89409270080" style="color: var(--primary); font-weight: 600;">8 (940) 927-00-80</a>
|
||
</p>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="js/bootstrap.bundle.min.js"></script>
|
||
<script src="js/rooms-public.js?v=20260511"></script>
|
||
<script src="js/main.js?v=20260511b"></script>
|
||
<script src="js/i18n.js"></script>
|
||
<script src="js/reviews.js"></script>
|
||
|
||
<!-- Review Modal -->
|
||
<div class="review-modal" id="reviewModal">
|
||
<div class="review-modal-content">
|
||
<div class="review-modal-header">
|
||
<h3 data-i18n="reviews.write_review">Написать отзыв</h3>
|
||
<button class="review-modal-close" onclick="closeReviewModal()">×</button>
|
||
</div>
|
||
<div class="review-modal-body" id="reviewModalBody">
|
||
<form id="reviewForm">
|
||
<div class="review-row">
|
||
<div class="review-form-group">
|
||
<label data-i18n="form.select_country">Страна</label>
|
||
<div class="review-select-wrapper">
|
||
<select class="review-form-control" id="reviewCountry" required>
|
||
<option value="" data-i18n="form.select_country">Выберите страну</option>
|
||
</select>
|
||
</div>
|
||
<div class="review-error" id="countryError" data-i18n="validation.country_required">Выберите страну</div>
|
||
</div>
|
||
<div class="review-form-group">
|
||
<label data-i18n="form.select_city">Город (необязательно)</label>
|
||
<div class="review-select-wrapper" id="citySelectWrapper">
|
||
<select class="review-form-control" id="reviewCity">
|
||
<option value="" data-i18n="form.select_city">Выберите город</option>
|
||
</select>
|
||
</div>
|
||
<div class="review-error" id="cityError" data-i18n="validation.city_required">Выберите или введите город</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="review-form-group" id="otherCityGroup" style="display: none;">
|
||
<label data-i18n="form.another_city">Другой город</label>
|
||
<input type="text" class="review-form-control" id="reviewOtherCity" data-i18n-placeholder="form.city_placeholder" placeholder="Введите название города">
|
||
<div class="review-error" data-i18n="validation.city_required">Введите название города</div>
|
||
</div>
|
||
|
||
<div class="review-form-group">
|
||
<label data-i18n="form.rating">Оценка</label>
|
||
<div class="review-stars-input">
|
||
<div class="review-stars-slider-wrapper">
|
||
<div class="review-stars-display" id="starsDisplay"></div>
|
||
<div class="review-stars-value" id="starsValue">5.0</div>
|
||
</div>
|
||
<input type="range" class="review-stars-slider" id="starsSlider" min="0" max="5" step="0.1" value="5" style="--value: 100%;">
|
||
</div>
|
||
<div class="review-error" data-i18n="validation.rating_required">Поставьте оценку</div>
|
||
</div>
|
||
|
||
<div class="review-form-group">
|
||
<label data-i18n="form.your_name">Ваше имя (ФИО) <span class="required">*</span></label>
|
||
<input type="text" class="review-form-control" id="reviewName" required data-i18n-placeholder="form.name_placeholder" placeholder="Иванов Иван Иванович" minlength="2">
|
||
<div class="review-error" data-i18n="validation.name_min">Имя должно содержать минимум 2 символа</div>
|
||
</div>
|
||
|
||
<div class="review-form-group">
|
||
<label data-i18n="form.review_text">Текст отзыва <span class="required">*</span></label>
|
||
<textarea class="review-form-control" id="reviewText" rows="4" required data-i18n-placeholder="form.review_placeholder" placeholder="Расскажите о вашем опыте отдыха в Hotel 777..." minlength="20"></textarea>
|
||
<div class="review-error" id="textError" data-i18n="validation.review_min">Отзыв должен содержать минимум 20 символов</div>
|
||
</div>
|
||
|
||
<div class="review-form-group">
|
||
<label data-i18n="form.hotel_code">Код гостиницы <span class="required">*</span></label>
|
||
<div class="review-code-wrapper">
|
||
<input type="password" class="review-form-control" id="reviewCode" required data-i18n-placeholder="form.code_placeholder" placeholder="Получите на ресепшене">
|
||
<button type="button" class="toggle-code" onclick="toggleCodeVisibility()">
|
||
<i class="fas fa-eye"></i>
|
||
</button>
|
||
</div>
|
||
<small class="hint" data-i18n="form.code_hint">Код сообщается гостям на ресепшене отеля</small>
|
||
<div class="review-error" id="codeError" data-i18n="validation.code_invalid">Неверный код гостиницы</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="review-modal-footer">
|
||
<button type="button" class="review-btn-cancel" onclick="closeReviewModal()" data-i18n="form.cancel">Отмена</button>
|
||
<button type="submit" class="review-btn-submit" form="reviewForm" id="reviewSubmitBtn">
|
||
<span data-i18n="form.submit">Отправить отзыв</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</body>
|
||
</html>
|
||
|