admin/34146-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Music Icon

Browse Source
This commit is contained in:
Flatlogic Bot 2025-09-18 14:44:33 +00:00
parent 8a4e09d491
commit 648d70a6dd
2 changed files with 59 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
assets/css/custom.css
View File

@ -157,7 +157,7 @@ section h2 {
#tickets {
position: relative;
background: url('https://noma.org/wp-content/uploads/2019/04/Screenshot-2019-04-30-10.10.43.png') no-repeat center center/cover;
background: #000000 !important;
}
#tickets::before {
@ -176,8 +176,8 @@ section h2 {
z-index: 2;
}
.ticket-form-container {
background-color: rgba(16, 16, 32, 0.85);
#tickets .ticket-form-container {
background-color: #000000 !important;
padding: 2rem;
border-radius: 8px;
border: 1px solid #00BFFF;
@ -369,3 +369,27 @@ span.flatpickr-weekday {
.choices__item--choice {
padding: 0.5rem 1rem;
}
#music-toggle {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 1000;
cursor: pointer;
background-color: rgba(16, 16, 32, 0.8);
padding: 1rem;
border-radius: 50%;
border: 1px solid #00BFFF;
box-shadow: 0 0 15px #00BFFF;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
}
#music-toggle i {
font-size: 20px;
color: #FFFFFF;
text-shadow: 0 0 5px #FFFFFF, 0 0 10px #00BFFF;
}

33
index.php
View File

@ -8,11 +8,18 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js/public/assets/styles/choices.min.css"/>
</head>
<body>
<div id="music-toggle">
<i class="fas fa-play"></i>
</div>
<audio id="background-music" loop>
<source src="https://archive.org/download/DIADJ-002/DIADJ-002-01.mp3" type="audio/mpeg">
</audio>
<nav class="navbar navbar-expand-lg navbar-dark fixed-top">
<div class="container">
@ -120,7 +127,7 @@
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="8">8</.option>
<option value="9">9</option>
<option value="10">10</option>
</select>
@ -142,6 +149,7 @@
<footer class="py-4 text-center text-muted">
<div class="container">
<p>&copy; 2025 Digital Museum. All rights reserved.</p>
<p style="font-size: 0.8rem; color: #888;">Music by <a href="https://archive.org/details/DIADJ-002" target="_blank" rel="noopener noreferrer">DIADJ on Internet Archive</a></p>
</div>
</footer>
@ -149,5 +157,28 @@
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script src="https://cdn.jsdelivr.net/npm/choices.js/public/assets/scripts/choices.min.js"></script>
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
const audio = document.getElementById('background-music');
const toggleButton = document.getElementById('music-toggle');
const icon = toggleButton.querySelector('i');
if (audio && toggleButton && icon) {
audio.volume = 0.5;
toggleButton.addEventListener('click', () => {
if (audio.paused) {
audio.play().catch(error => console.error("Audio play failed:", error));
icon.classList.remove('fa-play');
icon.classList.add('fa-pause');
} else {
audio.pause();
icon.classList.remove('fa-pause');
icon.classList.add('fa-play');
}
});
}
});
</script>
</body>
</html>