fix: missing ripple effect in language menu in certain condition

This commit is contained in:
KOWX712
2025-04-10 23:26:07 +08:00
parent 3b355ac5ff
commit b1a52ee173

View File

@@ -1,3 +1,5 @@
import { applyRippleEffect } from './main.js';
const languageButton = document.querySelector('.language-button'); const languageButton = document.querySelector('.language-button');
const languageMenu = document.querySelector('.language-menu'); const languageMenu = document.querySelector('.language-menu');
const languageOptions = document.querySelectorAll('.language-option'); const languageOptions = document.querySelectorAll('.language-option');
@@ -49,6 +51,7 @@ export async function loadTranslations() {
const response = await fetch(`locales/${lang}.json`); const response = await fetch(`locales/${lang}.json`);
translations = await response.json(); translations = await response.json();
applyTranslations(); applyTranslations();
applyRippleEffect();
} }
/** /**
@@ -100,17 +103,20 @@ export function setupLanguageMenu() {
} }
}); });
const closeLanguageMenu = () => { const closeLanguageMenu = () => {
languageMenu.classList.remove("show"); setTimeout(() => {
languageOverlay.style.display = 'none'; languageMenu.classList.remove("show");
languageOverlay.style.display = 'none';
}, 80)
} }
languageMenu.addEventListener("click", (e) => { languageMenu.addEventListener("click", async (e) => {
if (e.target.classList.contains("language-option")) { if (e.target.classList.contains("language-option")) {
const lang = e.target.getAttribute("data-lang"); const lang = e.target.getAttribute("data-lang");
localStorage.setItem('trickyAddonLanguage', lang); localStorage.setItem('trickyAddonLanguage', lang);
loadTranslations(lang); closeLanguageMenu();
closeLanguageMenu(); await new Promise(resolve => setTimeout(resolve, 200));
} loadTranslations(lang);
}); }
});
} }
/** /**