723 lines
42 KiB
HTML
723 lines
42 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
||
<link rel="icon" type="icon" sizes="32x32" href="images/free-icon-wedding-ring-4155044.ico">
|
||
<title>Wedding invitation</title>
|
||
<link rel="stylesheet" href="reset.css">
|
||
<link rel="stylesheet" href="style.css">
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css" />
|
||
<link rel="preload" href="fonts/yourfont.woff2" as="font" type="font/woff2" crossorigin>
|
||
|
||
</head>
|
||
|
||
<body>
|
||
<div class="bg"></div>
|
||
<header class="header">
|
||
|
||
<div class="burger" id="burger">
|
||
<span></span>
|
||
<span></span>
|
||
<span></span>
|
||
</div>
|
||
|
||
<nav class="nav" id="nav">
|
||
<ul class="menu">
|
||
<div class="items_up">
|
||
<!-- 1 -->
|
||
<li class="item">
|
||
<a href="#" class="link">
|
||
Добро пожаловать!
|
||
</a>
|
||
</li>
|
||
<!-- 2 -->
|
||
<li class="item">
|
||
<a href="#people" class="link">
|
||
Список гостей
|
||
</a>
|
||
</li>
|
||
<!-- 3 -->
|
||
<li class="item">
|
||
<a href="#timetable" class="link">
|
||
Расписание
|
||
</a>
|
||
</li>
|
||
<!-- 4 -->
|
||
<li class="item">
|
||
<a href="#transfer" class="link">
|
||
Путешествие
|
||
</a>
|
||
</li>
|
||
</div>
|
||
<div class="items_down">
|
||
<!-- 5 -->
|
||
<li class="item item_none">
|
||
<a href="#photos" class="link">
|
||
Фотографии
|
||
</a>
|
||
</li>
|
||
<!-- 6 -->
|
||
<li class="item">
|
||
<a href="#to-do-list" class="link">
|
||
Список задач
|
||
</a>
|
||
</li>
|
||
<!-- 7 -->
|
||
<li class="item">
|
||
<a href="#answer" class="link">
|
||
Прошу ответить
|
||
</a>
|
||
</li>
|
||
</div>
|
||
</ul>
|
||
</nav>
|
||
</header>
|
||
|
||
<main class="content">
|
||
<section class="heading" id="heading">
|
||
<article class="heading_content">
|
||
<div class="heading_cont">
|
||
<h1 class="heding_title">Дмитрий и Алёна</h1>
|
||
<h2 class="heading_info">
|
||
Наша история
|
||
</h2>
|
||
<h3 class="heading_date">22 августа 2026</h3>
|
||
<!-- КНОПКА -->
|
||
<button class="story_btn">
|
||
Открыть историю
|
||
</button>
|
||
<p class="heading_text">
|
||
Мы — та самая история, которая началась со странного сообщения и превратилась в нечто настоящее.
|
||
В нас есть легкость и смех, который когда-то стал началом всего, любовь к простым вещам вроде
|
||
чашки чая и бесконечных разговоров обо всем на свете. Мы разные и неидеальные, но именно в этом
|
||
— наше совпадение: нам всегда интересно друг с другом, спокойно и по-настоящему. Мы умеем
|
||
смеяться до слез, поддерживать в нужный момент и находить радость в мелочах. И, пожалуй, самое
|
||
важное — мы с самого начала почувствовали, что это надолго, и с каждым днем только убеждаемся в
|
||
этом.
|
||
</p>
|
||
<button class="btn_share" button>
|
||
<a class="btn_link" href="#answer">
|
||
Подтвердить участие
|
||
</a>
|
||
</button>
|
||
</div>
|
||
</article>
|
||
</section>
|
||
<aside>
|
||
<div class="time">
|
||
<p id="demo"></p>
|
||
</div>
|
||
</aside>
|
||
<section class="people" id="people">
|
||
<h4 class="people_title">
|
||
Список гостей
|
||
</h4>
|
||
<div class="newlywed">
|
||
<div class="newlywed_item">
|
||
<img class="img_newlywed" src="images/people/groom.webp" alt="groom" loading="lazy"
|
||
decoding="async">
|
||
<div class="newlywed_text">
|
||
<h3 class="newlywed_title">Жених</h3>
|
||
<p class="newlywed_info">
|
||
Самый лучший, милый,классный, очаровательный, крутой, забавный, любящий, удивительный,
|
||
необычный, прелестный, веселый, смешной, умный, добрый,красивый, гениальный</p>
|
||
</div>
|
||
</div>
|
||
<div class="newlywed_item">
|
||
<img class="img_newlywed" src="images/people/bride.webp" alt="bride" loading="lazy"
|
||
decoding="async">
|
||
<div class="newlywed_text">
|
||
<h3 class="newlywed_title">Невеста</h3>
|
||
<p class="newlywed_info">Я — творческий и активный человек, люблю петь, путешествовать и
|
||
создавать что-то своими руками. Увлекаюсь готовкой, особенно десертами, которыми радую
|
||
близких. Люблю веселье, тусовки, животных и жизнь без
|
||
скуки.
|
||
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="guest_list">
|
||
<div class="guest_inner">
|
||
<!-- 1 -->
|
||
<!-- <div class="guest_item">
|
||
<div class="guest_index">
|
||
Стол 1
|
||
</div>
|
||
<div class="guest_item_list">
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
</div>
|
||
</div> -->
|
||
<!-- 2 -->
|
||
<!-- <div class="guest_item">
|
||
<div class="guest_index">
|
||
Стол 1
|
||
</div>
|
||
<div class="guest_item_list">
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
</div>
|
||
</div> -->
|
||
<!-- 3 -->
|
||
<!-- <div class="guest_item">
|
||
<div class="guest_index">
|
||
Стол 1
|
||
</div>
|
||
<div class="guest_item_list">
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
<div class="guest_name">
|
||
Lorem, ipsum.
|
||
</div>
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section class="timetable" id="timetable">
|
||
<h4 class="people_title">
|
||
Расписание
|
||
</h4>
|
||
<div class="time_wrapper">
|
||
<div class="time_content">
|
||
<div class="time_inner">
|
||
<div class="time_row_up">
|
||
<!-- 1 -->
|
||
<div class="row_up_item">
|
||
<div class="time_img_box">
|
||
<img src="images/time/guest1.webp" alt="ring" class="time_img" loading="lazy"
|
||
decoding="async">
|
||
<h6 class="time_h6">10:10</h6>
|
||
<p class="time_p">Сбор гостей</p>
|
||
<div class="time_comment">Приходите заранее, чтобы спокойно встретиться и сделать
|
||
фото
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 2 -->
|
||
<div class="row_up_item">
|
||
<div class="time_img_box">
|
||
<img src="images/time/ring.webp" alt="ring" class="time_img" loading="lazy"
|
||
decoding="async">
|
||
<h6 class="time_h6">10:40</h6>
|
||
<p class="time_p">Церемония</p>
|
||
<div class="time_comment">Самый трогательный и важный момент дня — регистрация
|
||
нашего брака
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 3 -->
|
||
<div class="row_up_item">
|
||
<div class="time_img_box">
|
||
<img src="images/time/camera.webp" alt="camera" class="time_img" loading="lazy"
|
||
decoding="async">
|
||
<h6 class="time_h6">11:30</h6>
|
||
<p class="time_p">Фотосессия</p>
|
||
<div class="time_comment">Мы отправляемся на фотосессию, а для гостей наступит свободное время до банкета</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="time_row_down">
|
||
<!-- 4 -->
|
||
<div class="row_up_item">
|
||
<div class="time_img_box">
|
||
<img src="images/time/wedding-dinner_11196102.webp" alt="" class="time_img"
|
||
loading="lazy" decoding="async">
|
||
<h6 class="time_h6">18:30</h6>
|
||
<p class="time_p">Сбор гостей и фуршет</p>
|
||
<div class="time_comment">Берем напиток, закуски и наслаждаемся началом вечера</div>
|
||
</div>
|
||
</div>
|
||
<!-- 5 -->
|
||
<div class="row_up_item">
|
||
<div class="time_img_box">
|
||
<img src="images/time/food.webp" alt="" class="time_img" loading="lazy"
|
||
decoding="async">
|
||
<h6 class="time_h6">19:00</h6>
|
||
<p class="time_p">Банкет</p>
|
||
<div class="time_comment">Приглашаем вас за столы, чтобы продолжить вечер в тёплой и
|
||
уютной атмосфере
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 6 -->
|
||
<div class="row_up_item">
|
||
<div class="time_img_box">
|
||
<img src="images/time/disco-ball_18181959.webp" alt="" class="time_img"
|
||
loading="lazy" decoding="async">
|
||
<h6 class="time_h6">22:00</h6>
|
||
<p class="time_p">Танцы</p>
|
||
<div class="time_comment">Приглашаем вас на танцпол. Танцуйте столько, сколько
|
||
захочется</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section class="transfer" id="transfer">
|
||
<h4 class="transfer_title">
|
||
Путешествие
|
||
</h4>
|
||
<div class="transfer_inner">
|
||
<div class="transfer_map">
|
||
<div class="map">
|
||
<div class="map_div">
|
||
<a href="https://maps.app.goo.gl/ZYTyA2qTvCpnXTdN7" target="_blank" class="map_link">
|
||
<img src="images/maps/zags.webp" alt="ЗАГС" class="map_preview" loading="lazy">
|
||
|
||
<div class="map_btn">
|
||
Открыть маршрут
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<a href="https://maps.app.goo.gl/ZYTyA2qTvCpnXTdN7" class="map_adress" target="_blank">Тверь,
|
||
Свободный переулок, 5</a>
|
||
<h6 class="map_info">Начало в</h6>
|
||
<h6 class="map_time">10:10</h6>
|
||
</div>
|
||
<div class="map">
|
||
<div class="map_div">
|
||
<a href="https://maps.app.goo.gl/5WFQzNhDqmo2dBxXA" target="_blank" class="map_link">
|
||
<img src="images/maps/loft.webp" alt="ЗАГС" class="map_preview" loading="lazy">
|
||
|
||
<div class="map_btn">
|
||
Открыть маршрут
|
||
</div>
|
||
</a>
|
||
</div>
|
||
<a href="https://maps.app.goo.gl/5WFQzNhDqmo2dBxXA" class="map_adress" target="_blank">Тверь,
|
||
улица Двор Пролетарки, 16</a>
|
||
<h6 class="map_info">Начало в</h6>
|
||
<h6 class="map_time">18:30</h6>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section class="photos" id="photos">
|
||
<h4 class="photos_title">
|
||
Фотографии
|
||
</h4>
|
||
<!-- Slider main container -->
|
||
<div class="swiper photos_slider">
|
||
<!-- Additional required wrapper -->
|
||
<div class="swiper-wrapper">
|
||
<!-- Slides -->
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/1.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/2.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/3.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/4.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/5.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/6.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/7.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/8.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/9.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<img class="swiper_img" src="images/photos/10.webp" alt="photo" width="500" height="500"
|
||
loading="lazy" decoding="async">
|
||
</div>
|
||
</div>
|
||
<!-- If we need pagination -->
|
||
<div class="swiper-pagination"></div>
|
||
|
||
<!-- If we need navigation buttons -->
|
||
<div class="swiper-button-prev"></div>
|
||
<div class="swiper-button-next"></div>
|
||
|
||
<!-- If we need scrollbar -->
|
||
<div class="swiper-scrollbar"></div>
|
||
</div>
|
||
<!-- COLLAGE -->
|
||
<div class="photos_collage">
|
||
<img src="images/photos/1.webp" alt="">
|
||
<img src="images/photos/2.webp" alt="">
|
||
<img src="images/photos/3.webp" alt="">
|
||
<img src="images/photos/4.webp" alt="">
|
||
<img src="images/photos/5.webp" alt="">
|
||
<img src="images/photos/6.webp" alt="">
|
||
<img src="images/photos/8.webp" alt="">
|
||
<img src="images/photos/9.webp" alt="">
|
||
</div>
|
||
</section>
|
||
<section class="to-do-list" id="to-do-list">
|
||
<h4 class="do-list_title">
|
||
Список задач
|
||
</h4>
|
||
<div class="to-do-list_wrapper">
|
||
<div class="to-do-list_items">
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Поздравить молодых и сказать тёплые слова
|
||
</div>
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Вручить подарок молодожёнам
|
||
</div>
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Сделать фото и видео, чтобы потом было что выложить
|
||
</div>
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Поднять тост за любовь
|
||
</div>
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Добраться до свадебного торта, сфотографировать его
|
||
</div>
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Потанцевать хотя бы один медленный танец
|
||
</div>
|
||
<div class="to-do-list_item">
|
||
<svg style="enable-background:new 0 0 24 24;" version="1.1" viewBox="0 0 24 24"
|
||
xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
|
||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<style type="text/css">
|
||
.st0 {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<g class="st0" id="grid" />
|
||
<g id="icon">
|
||
<path
|
||
d="M5.528,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199L23.899,5.275c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.166-0.535-0.124-0.7,0.099 L12.91,18.226l-6.677-7.839C6.053,10.176,5.736,10.151,5.528,10.33z" />
|
||
<path
|
||
d="M12.028,13.945l6.519-8.67c0.166-0.221,0.122-0.534-0.099-0.7c-0.222-0.167-0.535-0.12-0.7,0.099l-6.519,8.67 c-0.166,0.221-0.122,0.534,0.099,0.7c0.091,0.068,0.196,0.101,0.301,0.101C11.78,14.145,11.931,14.075,12.028,13.945z" />
|
||
<path
|
||
d="M0.176,10.33c-0.21,0.18-0.235,0.495-0.057,0.705l7.082,8.314c0.096,0.111,0.234,0.176,0.381,0.176c0.005,0,0.01,0,0.016,0 c0.151-0.005,0.293-0.078,0.384-0.199l0.967-1.285c0.166-0.221,0.122-0.534-0.099-0.7c-0.219-0.166-0.535-0.123-0.7,0.099 l-0.592,0.786l-6.677-7.839C0.7,10.176,0.385,10.151,0.176,10.33z" />
|
||
</g>
|
||
</svg>
|
||
Повеселиться так, чтобы этот день запомнился
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section class="answer" id="answer">
|
||
<h4 class="answer_title">Прошу ответить</h4>
|
||
|
||
<div class="answer_wrapper">
|
||
<h6 class="answer_heading">
|
||
Просим Вас заполнить форму и подтвердить своё участие
|
||
</h6>
|
||
|
||
<form class="form-info">
|
||
|
||
<!-- Левая колонка -->
|
||
<div class="form_name">
|
||
|
||
<label class="label_style">Фамилия
|
||
<input type="text" name="lastName" id="flname" required>
|
||
</label>
|
||
<label class="label_style">Имя
|
||
<input type="text" name="firstName" id="ffname" required>
|
||
</label>
|
||
<label class="label_style">Отчество
|
||
<input type="text" name="middleName" id="fmname" required>
|
||
</label>
|
||
|
||
<label class="label_1">Комментарий
|
||
<textarea cols="1.5" rows="1" type="text" name="lastName" id="text_field"
|
||
placeholder="Напишите здесь о ваших особых предпочтениях и аллергиях" style="resize: both; max-width: 300px; max-height: 300px; min-height: 150px; min-width: 150px;"></textarea>
|
||
</label>
|
||
|
||
</div>
|
||
|
||
<!-- Средняя колонка -->
|
||
<div class="form_menu">
|
||
<p class="block_title">Горячее блюдо</p>
|
||
|
||
<label class="option">
|
||
<input type="radio" name="food" id="rmeat" value="meat" required>
|
||
Мясо
|
||
</label>
|
||
|
||
<label class="option">
|
||
<input type="radio" name="food" id="rfish" value="fish" required>
|
||
Рыба
|
||
</label>
|
||
</div>
|
||
|
||
<!-- Правая колонка -->
|
||
<div class="form_drink">
|
||
<p class="block_title">Напитки</p>
|
||
|
||
<label class="option"><input type="checkbox" name="drink" value="champagne" id="cchampagne">
|
||
Шампанское</label>
|
||
<label class="option"><input type="checkbox" name="drink" value="wine" id="cwine"> Вино</label>
|
||
<label class="option"><input type="checkbox" name="drink" value="vodka" id="cvodka">
|
||
Водка</label>
|
||
<label class="option"><input type="checkbox" name="drink" value="whiskey" id="cwhiskey">
|
||
Виски</label>
|
||
<label class="option"><input type="checkbox" name="drink" value="tequila" id="ctequila">
|
||
Текила</label>
|
||
<label class="option"><input type="checkbox" name="drink" value="sam" id="sam">
|
||
Самогон</label>
|
||
</div>
|
||
|
||
|
||
</form>
|
||
<form class="form-connect">
|
||
<button type="submit" class="answer_btn" id="bsubmit">
|
||
Подтвердить участие
|
||
</button>
|
||
<button type="logout" class="answer_btn" id="logoutForm">
|
||
Выйти
|
||
</button>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="footer">
|
||
<div class="footer_inner">
|
||
<div class="footer_title">
|
||
<h1 class="fotter_logo">
|
||
Алёна и Дмитрий
|
||
</h1>
|
||
<p class="footer_date">22 августа 2026</p>
|
||
<p class="footer_place">LOFT 1870</p>
|
||
</div>
|
||
<div class="footer_contacts">
|
||
<p class="footer_text">"С нетерпением ждем встречи!"</p>
|
||
<div class="footer_cntcts">
|
||
<a class="footer_cnt" href="https://t.me/Alena7729" target="_blank">
|
||
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||
<svg width="40px" height="40px" viewBox="0 0 32 32" fill="none"
|
||
xmlns="http://www.w3.org/2000/svg">
|
||
<circle cx="16" cy="16" r="14" fill="url(#paint0_linear_87_7225)" />
|
||
<path
|
||
d="M22.9866 10.2088C23.1112 9.40332 22.3454 8.76755 21.6292 9.082L7.36482 15.3448C6.85123 15.5703 6.8888 16.3483 7.42147 16.5179L10.3631 17.4547C10.9246 17.6335 11.5325 17.541 12.0228 17.2023L18.655 12.6203C18.855 12.4821 19.073 12.7665 18.9021 12.9426L14.1281 17.8646C13.665 18.3421 13.7569 19.1512 14.314 19.5005L19.659 22.8523C20.2585 23.2282 21.0297 22.8506 21.1418 22.1261L22.9866 10.2088Z"
|
||
fill="white" />
|
||
<defs>
|
||
<linearGradient id="paint0_linear_87_7225" x1="16" y1="2" x2="16" y2="30"
|
||
gradientUnits="userSpaceOnUse">
|
||
<stop stop-color="#37BBFE" />
|
||
<stop offset="1" stop-color="#007DBB" />
|
||
</linearGradient>
|
||
</defs>
|
||
</svg>
|
||
Алёна
|
||
</a>
|
||
<a class="footer_cnt" href="https://t.me/DisaTylov" target="_blank">
|
||
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||
<svg width="40px" height="40px" viewBox="0 0 32 32" fill="none"
|
||
xmlns="http://www.w3.org/2000/svg">
|
||
<circle cx="16" cy="16" r="14" fill="url(#paint0_linear_87_7225)" />
|
||
<path
|
||
d="M22.9866 10.2088C23.1112 9.40332 22.3454 8.76755 21.6292 9.082L7.36482 15.3448C6.85123 15.5703 6.8888 16.3483 7.42147 16.5179L10.3631 17.4547C10.9246 17.6335 11.5325 17.541 12.0228 17.2023L18.655 12.6203C18.855 12.4821 19.073 12.7665 18.9021 12.9426L14.1281 17.8646C13.665 18.3421 13.7569 19.1512 14.314 19.5005L19.659 22.8523C20.2585 23.2282 21.0297 22.8506 21.1418 22.1261L22.9866 10.2088Z"
|
||
fill="white" />
|
||
<defs>
|
||
<linearGradient id="paint0_linear_87_7225" x1="16" y1="2" x2="16" y2="30"
|
||
gradientUnits="userSpaceOnUse">
|
||
<stop stop-color="#37BBFE" />
|
||
<stop offset="1" stop-color="#007DBB" />
|
||
</linearGradient>
|
||
</defs>
|
||
</svg>
|
||
Дмитрий
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="footer_copy">
|
||
<div class="footer_hashtag">#свадьба2026</div>
|
||
<div class="footer_copyright">© 2026 Алёна и Дмитрий</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js"></script>
|
||
<script src="main.js"></script>
|
||
<script src="api.js"></script>
|
||
</body>
|
||
|
||
</html> |