railminihanov/svadba

<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"> <title>Приглашение на свадьбу | Ксюша & Раиль</title>  <link href="https://fonts.googleapis.com/css2?family=Pangolin&family=Montserrat:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <style> * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Lora', serif; color: #5a3e35; line-height: 1.6; min-height: 100vh; /* ВАША КАРТИНКА НА ФОН */ background-image: url('https://drive.google.com/uc?id=1XotvwIh6jdJEvtM82lqlTe05Djrs77NB'); background-size: cover; background-position: center; background-attachment: fixed; } .container { max-width: 600px; margin: 0 auto; padding: 30px 20px 60px; } /* Анимация */ .animate-item { opacity: 0; transform: translateY(40px); transition: opacity 1.8s ease-out, transform 1.8s ease-out; } .animate-item.visible { opacity: 1; transform: translateY(0); } /* Задержки */ .invitation-image { transition-delay: 0s; } .timer-section { transition-delay: 0.15s; } .middle-image { transition-delay: 0.3s; } .map-button { transition-delay: 0.45s; } .program-image { transition-delay: 0.6s; } .dresscode-image { transition-delay: 0.75s; } .rsvp-card { transition-delay: 0.9s; } .final-image { transition-delay: 1.05s; } /* Изображения */ .invitation-image, .middle-image, .program-image, .dresscode-image, .final-image { width: 100%; border-radius: 24px; overflow: hidden; margin-bottom: 30px; } .invitation-image img, .middle-image img, .program-image img, .dresscode-image img, .final-image img { width: 100%; height: auto; display: block; } /* Таймер */ .timer-section { text-align: center; padding: 30px 25px; margin-bottom: 30px; } .timer-title { font-family: 'Pangolin', cursive; font-size: 1.3rem; letter-spacing: 1px; color: #b87a5a; margin-bottom: 20px; font-weight: 400; } .timer { display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; } .timer-box { background: rgba(255, 245, 239, 0.5); padding: 15px 12px; border-radius: 20px; min-width: 70px; text-align: center; } .timer-number { font-size: 2rem; font-weight: 600; color: #b87a5a; font-family: 'Montserrat', sans-serif; } .timer-label { font-size: 0.7rem; color: #a07a65; text-transform: uppercase; letter-spacing: 1px; font-family: 'Montserrat', sans-serif; } /* Кнопка карты */ .map-button { text-align: center; margin-bottom: 30px; } .map-btn { display: inline-block; background: #b87a5a; color: white; text-decoration: none; padding: 14px 35px; border-radius: 50px; font-weight: 500; font-family: 'Montserrat', sans-serif; transition: all 0.3s; } .map-btn:hover { background: #9b6245; transform: translateY(-2px); } /* Опрос */ .rsvp-card { padding: 30px 25px; margin-bottom: 30px; } .rsvp-title { font-family: 'Pangolin', cursive; font-size: 1.8rem; text-align: center; color: #b87a5a; margin-bottom: 25px; font-weight: 400; } .question { margin-bottom: 28px; padding-bottom: 20px; border-bottom: 1px solid rgba(200, 160, 140, 0.3); } .question:last-of-type { border-bottom: none; padding-bottom: 0; } .question-label { font-weight: 600; color: #5a3e35; margin-bottom: 15px; display: block; font-size: 1rem; font-family: 'Montserrat', sans-serif; } .options-group { display: flex; flex-direction: column; gap: 12px; } .option { display: flex; align-items: center; gap: 12px; cursor: pointer; } .option input { position: absolute; opacity: 0; width: 0; height: 0; } .custom-radio { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #b87a5a; display: inline-block; position: relative; background: white; flex-shrink: 0; } .option input:checked + .custom-radio::after { content: ""; width: 12px; height: 12px; background: #b87a5a; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .custom-checkbox { width: 22px; height: 22px; border-radius: 6px; border: 2px solid #b87a5a; display: inline-block; position: relative; background: white; flex-shrink: 0; } .option input:checked + .custom-checkbox::after { content: "✓"; font-size: 14px; font-weight: bold; color: #b87a5a; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .option-text { font-size: 0.95rem; color: #5a3e35; font-family: 'Montserrat', sans-serif; } .alcohol-group { display: flex; flex-direction: column; gap: 12px; } .name-input { width: 100%; padding: 12px 16px; border-radius: 50px; border: none; background: rgba(255, 245, 239, 0.7); font-family: 'Montserrat', sans-serif; font-size: 0.95rem; color: #5a3e35; } .name-input:focus { outline: none; background: rgba(255, 245, 239, 0.9); } .name-input::placeholder { color: #c4a58e; font-family: 'Montserrat', sans-serif; } .submit-btn { background: #b87a5a; color: white; border: none; padding: 14px; border-radius: 50px; font-size: 1rem; font-weight: 600; font-family: 'Montserrat', sans-serif; cursor: pointer; transition: all 0.3s; width: 100%; margin-top: 20px; } .submit-btn:hover { background: #9b6245; transform: translateY(-2px); } @media (max-width: 550px) { .container { padding: 20px 15px 50px; } .timer-number { font-size: 1.5rem; } .timer-box { min-width: 55px; padding: 10px 8px; } .rsvp-title { font-size: 1.5rem; } } </style> </head> <body> <div class="container">  <div class="invitation-image animate-item"> <img src="https://drive.google.com/uc?id=1X6RV6KerQ8raVUgKLjiUxOHoeaTh3Fv5" alt="Приглашение"> </div>  <div class="timer-section animate-item"> <div class="timer-title">ДО НАШЕЙ СВАДЬБЫ ОСТАЛОСЬ</div> <div id="countdown" class="timer"> <div class="timer-box"><span id="days" class="timer-number">0</span><br><span class="timer-label">Дней</span></div> <div class="timer-box"><span id="hours" class="timer-number">0</span><br><span class="timer-label">Часов</span></div> <div class="timer-box"><span id="minutes" class="timer-number">0</span><br><span class="timer-label">Минут</span></div> <div class="timer-box"><span id="seconds" class="timer-number">0</span><br><span class="timer-label">Секунд</span></div> </div> </div>  <div class="middle-image animate-item"> <img src="https://via.placeholder.com/600x400/f5e6dc/b87a5a?text=Здесь+будет+ваше+фото" alt="Наше фото"> </div>  <div class="map-button animate-item"> <a href="https://yandex.ru/maps/?text=Уфа%20проспект%20Октября%2079%2F1" target="_blank" class="map-btn"> Открыть карту </a> </div>  <div class="program-image animate-item"> <img src="https://via.placeholder.com/600x500/f5e6dc/b87a5a?text=Программа+дня+будет+здесь" alt="Программа дня"> </div>  <div class="dresscode-image animate-item"> <img src="https://via.placeholder.com/600x400/f5e6dc/b87a5a?text=Dress+code+будет+здесь" alt="Дресс-код"> </div>  <div class="rsvp-card animate-item"> <div class="rsvp-title">Пожалуйста, ответьте</div> <form id="rsvpForm" action="https://formsubmit.co/minihanovrail70@gmail.com" method="POST"> <div class="question"> <label class="question-label">Ваше имя</label> <input type="text" name="Имя гостя" placeholder="Напишите ваше имя" required class="name-input"> </div> <div class="question"> <label class="question-label">Подтверждение присутствия</label> <div class="options-group"> <label class="option"> <input type="radio" name="Присутствие" value="Приду с радостью" required> <span class="custom-radio"></span> <span class="option-text">Приду с радостью</span> </label> <label class="option"> <input type="radio" name="Присутствие" value="Приду с гостем"> <span class="custom-radio"></span> <span class="option-text">Приду с гостем</span> </label> <label class="option"> <input type="radio" name="Присутствие" value="К сожалению не смогу"> <span class="custom-radio"></span> <span class="option-text">Не смогу</span> </label> </div> </div> <div class="question"> <label class="question-label">Какой алкоголь предпочитаете? (можно выбрать несколько)</label> <div class="alcohol-group"> <label class="option"> <input type="checkbox" name="Алкоголь" value="Вино красное"> <span class="custom-checkbox"></span> <span class="option-text">Вино красное</span> </label> <label class="option"> <input type="checkbox" name="Алкоголь" value="Вино белое"> <span class="custom-checkbox"></span> <span class="option-text">Вино белое</span> </label> <label class="option"> <input type="checkbox" name="Алкоголь" value="Шампанское"> <span class="custom-checkbox"></span> <span class="option-text">Шампанское</span> </label> <label class="option"> <input type="checkbox" name="Алкоголь" value="Коньяк"> <span class="custom-checkbox"></span> <span class="option-text">Коньяк</span> </label> <label class="option"> <input type="checkbox" name="Алкоголь" value="Виски"> <span class="custom-checkbox"></span> <span class="option-text">Виски</span> </label> <label class="option"> <input type="checkbox" name="Алкоголь" value="Водка"> <span class="custom-checkbox"></span> <span class="option-text">Водка</span> </label> <label class="option"> <input type="checkbox" name="Алкоголь" value="Самогон"> <span class="custom-checkbox"></span> <span class="option-text">Самогон</span> </label> </div> </div> <input type="hidden" name="_subject" value="Новый ответ на приглашение! Ксюша и Раиль"> <input type="hidden" name="_captcha" value="false"> <input type="hidden" name="_template" value="table"> <button type="submit" class="submit-btn">Отправить ответ</button> </form> <p style="font-size: 0.7rem; text-align: center; margin-top: 15px; color: #a07a65; font-family: 'Montserrat', sans-serif;"> После нажатия откроется письмо — просто нажмите "Отправить" </p> </div>  <div class="final-image animate-item"> <img src="https://via.placeholder.com/600x300/f5e6dc/b87a5a?text=Здесь+будет+ваше+финальное+изображение" alt="Финальное изображение"> </div> </div>  <audio id="weddingMusic" autoplay loop preload="auto"> <source src="https://cdn.pixabay.com/download/audio/2022/03/24/audio_0b8f2c0c2a.mp3?filename=romantic-guitar-137081.mp3" type="audio/mpeg"> </audio> <script> // Музыка const audio = document.getElementById('weddingMusic'); function playMusic() { audio.play().catch(e => { document.body.addEventListener('click', function once() { audio.play(); document.body.removeEventListener('click', once); }); }); } playMusic(); audio.volume = 0.35; // Таймер function updateTimer() { const weddingDate = new Date(2026, 8, 26, 15, 0, 0); const now = new Date(); const diff = weddingDate - now; if (diff <= 0) { document.getElementById('countdown').innerHTML = '<div style="text-align:center; font-size:1.2rem;">Сегодня наш день! Ждём вас</div>'; return; } document.getElementById('days').innerText = Math.floor(diff / (1000 * 60 * 60 * 24)); document.getElementById('hours').innerText = Math.floor((diff % (86400000)) / (3600000)); document.getElementById('minutes').innerText = Math.floor((diff % 3600000) / 60000); document.getElementById('seconds').innerText = Math.floor((diff % 60000) / 1000); } setInterval(updateTimer, 1000); updateTimer(); // Плавное появление const animateItems = document.querySelectorAll('.animate-item'); const observer = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('visible'); } }); }, { threshold: 0.15 }); animateItems.forEach(item => observer.observe(item)); setTimeout(() => { animateItems.forEach(item => { const rect = item.getBoundingClientRect(); if (rect.top < window.innerHeight - 100) { item.classList.add('visible'); } }); }, 100); // Обработка алкоголя document.getElementById('rsvpForm').addEventListener('submit', function(e) { const checkboxes = document.querySelectorAll('input[name="Алкоголь"]:checked'); const selectedValues = Array.from(checkboxes).map(cb => cb.value).join(', '); if (selectedValues) { const hiddenField = document.createElement('input'); hiddenField.type = 'hidden'; hiddenField.name = 'Выбранный алкоголь'; hiddenField.value = selectedValues; this.appendChild(hiddenField); } }); </script>  </body> </html>

язык не указан · рейтинг — · 👍 0 · ❤️ 0 · 💎 0 · 0 форков · ссылка на SourceCraft

Дата анализа: 29.09.2026 00:59

Нет данных

Скан есть, измерить метрики нельзя

Почему такой балл

Документация Нет данных
- репозиторий пуст is_empty=True
CI/CD Нет данных
- репозиторий пуст is_empty=True
Безопасность Нет данных
- репозиторий пуст is_empty=True
Активность Нет данных
- репозиторий пуст is_empty=True
Issues Нет данных
- репозиторий пуст is_empty=True
Состояние кода Нет данных
- репозиторий пуст is_empty=True

Сильные и слабые стороны

Слабые: Документация: нет данных, CI/CD: нет данных, Безопасность: нет данных, Активность: нет данных, Issues: нет данных, Состояние кода: нет данных

Находки и рекомендации

Находок нет — либо скан ещё не считал Score, либо проблем не найдено.

История проверок

29.09.2026 00:59 — нет данных