iroxol/markinstefan.xyz
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added music button

Browse Source
This commit is contained in:
spetznas
2026-05-04 19:13:52 +02:00
parent eccb229f03
commit 9bd514dac0
83 changed files with 704 additions and 13276 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/ru/marriage/index.html
Executable → Regular
+64 -7
View File
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="ru">
<head><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
<head>
<title>Маркин Степан</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -22,7 +22,7 @@
<meta name="twitter:description" content="С радостью приглашаем вас на свадьбу Стефана и Мариии! Присоединяйтесь к нам, чтобы отпраздновать этот особенный день, наполненный любовью, радостью и незабываемыми воспоминаниями.
С нетерпением ждем встречи с вами!">
<meta property="og:url" content="http://localhost:1313/ru/marriage/">
<meta property="og:url" content="http://markinstefan.xyz/ru/marriage/">
<meta property="og:site_name" content="Маркин Степан">
<meta property="og:title" content="Свадьба Стефана и Марии">
<meta property="og:description" content="С радостью приглашаем вас на свадьбу Стефана и Мариии! Присоединяйтесь к нам, чтобы отпраздновать этот особенный день, наполненный любовью, радостью и незабываемыми воспоминаниями.
@@ -33,7 +33,7 @@
<link rel="canonical" href="http://localhost:1313/ru/marriage/">
<link rel="canonical" href="http://markinstefan.xyz/ru/marriage/">
<link rel="preload" href="/fonts/fa-brands-400.woff2" as="font" type="font/woff2" crossorigin>
@@ -43,7 +43,7 @@
<link rel="stylesheet" href="/css/coder.css" media="screen">
<link rel="stylesheet" href="/css/coder.min.f6b1b35a7b02521b25338f6cf58975f9980a6c12847763fe35a48307758cd1e7.css" integrity="sha256-9rGzWnsCUhslM49s9Yl1&#43;ZgKbBKEd2P&#43;NaSDB3WM0ec=" crossorigin="anonymous" media="screen" />
@@ -53,7 +53,7 @@
<link rel="stylesheet" href="/css/coder-dark.css" media="screen">
<link rel="stylesheet" href="/css/coder-dark.min.ad48f476275974885bdc03d5251e3cdbe1678c54a63ff772376b0ed2adc468dd.css" integrity="sha256-rUj0didZdIhb3APVJR482&#43;FnjFSmP/dyN2sO0q3EaN0=" crossorigin="anonymous" media="screen" />
@@ -102,7 +102,7 @@
<nav class="navigation">
<section class="container">
<a class="navigation-title" href="http://localhost:1313/ru/">
<a class="navigation-title" href="http://markinstefan.xyz/ru/">
Маркин Степан
</a>
@@ -238,6 +238,63 @@
</style>
<div class="wedding-container">
<style>
.music-fab {
position: fixed;
bottom: 20px;
left: 20px;
z-index: 9999;
}
.fab-button {
width: 52px;
height: 52px;
border-radius: 50%;
border: none;
background: white;
box-shadow: 0 6px 18px rgba(0,0,0,0.2);
font-size: 20px;
cursor: pointer;
transition: transform 0.15s ease;
}
.fab-button:active {
transform: scale(0.95);
}
</style>
<div class="music-fab">
<button id="music-btn" class="fab-button">▶️</button>
</div>
<audio id="bg-music" loop>
<source src="/audio/canon-in-d.mp3" type="audio/mpeg">
</audio>
<script>
const btn = document.getElementById("music-btn");
const audio = document.getElementById("bg-music");
audio.volume = 0.2;
let isPlaying = false;
btn.addEventListener("click", async () => {
if (!isPlaying) {
try {
await audio.play();
isPlaying = true;
btn.textContent = "⏸️";
} catch (e) {
console.log("Playback blocked:", e);
}
} else {
audio.pause();
isPlaying = false;
btn.textContent = "▶️";
}
});
</script>
<div class="countdown">
@@ -364,7 +421,7 @@
<script src="/js/coder.js"></script>
<script src="/js/coder.min.6ae284be93d2d19dad1f02b0039508d9aab3180a12a06dcc71b0b0ef7825a317.js" integrity="sha256-auKEvpPS0Z2tHwKwA5UI2aqzGAoSoG3McbCw73gloxc="></script>