fix mobile menu
This commit is contained in:
5
public/css/main-site.min.css
vendored
5
public/css/main-site.min.css
vendored
@@ -65,6 +65,7 @@
|
||||
--radius-md: 0.375rem;
|
||||
--radius-lg: 0.5rem;
|
||||
--radius-xl: 0.75rem;
|
||||
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
||||
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
--animate-spin: spin 1s linear infinite;
|
||||
--blur-xl: 24px;
|
||||
@@ -782,6 +783,10 @@
|
||||
--tw-ease: var(--ease-in-out);
|
||||
transition-timing-function: var(--ease-in-out);
|
||||
}
|
||||
.ease-out {
|
||||
--tw-ease: var(--ease-out);
|
||||
transition-timing-function: var(--ease-out);
|
||||
}
|
||||
.hover\:bg-blue-700 {
|
||||
&:hover {
|
||||
@media (hover: hover) {
|
||||
|
@@ -28,7 +28,11 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
'enable-status'
|
||||
];
|
||||
|
||||
|
||||
|
||||
const sections = document.querySelectorAll('.section-bg');
|
||||
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach((entry, index) => {
|
||||
if (entry.isIntersecting) {
|
||||
@@ -39,6 +43,13 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
});
|
||||
}, { threshold: 0.1 });
|
||||
|
||||
sections.forEach(section => {
|
||||
section.style.transform = 'translateY(30px)';
|
||||
section.style.opacity = '0';
|
||||
section.style.transition = 'transform 0.7s ease-out, opacity 0.7s ease-out';
|
||||
observer.observe(section);
|
||||
});
|
||||
|
||||
|
||||
function throttle(fn, wait) {
|
||||
let lastTime = 0;
|
||||
@@ -56,6 +67,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const mobileNav = document.querySelector('[data-mobile-nav]');
|
||||
const navLinks = mobileNav.querySelectorAll('a');
|
||||
|
||||
|
||||
// Debounce function to prevent rapid clicks
|
||||
function debounce(fn, wait) {
|
||||
let timeout;
|
||||
|
@@ -1,3 +1,21 @@
|
||||
const sections = document.querySelectorAll('.section-bg');
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach((entry, index) => {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.style.transform = 'translateY(0)';
|
||||
entry.target.style.opacity = '1';
|
||||
entry.target.style.transitionDelay = `${index * 0.1}s`;
|
||||
}
|
||||
});
|
||||
}, { threshold: 0.1 });
|
||||
|
||||
sections.forEach(section => {
|
||||
section.style.transform = 'translateY(30px)';
|
||||
section.style.opacity = '0';
|
||||
section.style.transition = 'transform 0.7s ease-out, opacity 0.7s ease-out';
|
||||
observer.observe(section);
|
||||
});
|
||||
|
||||
const PARTICLE_POOL_SIZE = 50;
|
||||
const particlePool = [];
|
||||
const activeParticles = new Set();
|
||||
@@ -62,23 +80,6 @@ function throttle(fn, wait) {
|
||||
};
|
||||
}
|
||||
|
||||
if (window.location.href === 'https://my-mc.link' || window.location.href === 'https://my-mc.link/') {
|
||||
const hero = document.querySelector('.hero-bg');
|
||||
if (hero) {
|
||||
const heroImg = hero.querySelector('img');
|
||||
if (heroImg) {
|
||||
window.addEventListener(
|
||||
'scroll',
|
||||
throttle(() => {
|
||||
const scrollPosition = window.pageYOffset;
|
||||
if (heroImg.style.display === 'block') {
|
||||
heroImg.style.transform = `translate(-50%, calc(-50% + ${scrollPosition * 0.3}px)) scale(1.2)`;
|
||||
}
|
||||
}, 16)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const buttons = document.querySelectorAll('.btn-minecraft');
|
||||
buttons.forEach(button => {
|
||||
@@ -125,4 +126,5 @@ document.addEventListener('click', (e) => {
|
||||
mobileNav.classList.remove('active');
|
||||
hamburger.classList.remove('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
Reference in New Issue
Block a user