drowl87/hextra_mirror
1
0
Fork 1
mirror of https://github.com/imfing/hextra.git synced 2025-09-14 07:07:17 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix(navbar): menu positions (#804)

Browse Source 
* fix: menu positions

* refactor: factorize menu management and handle window resize

* chore: the placement is better with +4 then +10

* chore: the placement is better with -10 than -15
This commit is contained in:
Ludovic Fernandez
2025-08-30 00:09:23 +02:00
committed by GitHub
parent bbffff1f52
commit 82e25c0b0d
4 changed files with 60 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
assets/js/lang.js
View File

@@ -1,44 +1,18 @@
(function () {
const languageSwitchers = document.querySelectorAll('.hextra-language-switcher');
languageSwitchers.forEach((switcher) => {
switcher.addEventListener('click', (e) => {
e.preventDefault();
switcher.dataset.state = switcher.dataset.state === 'open' ? 'closed' : 'open';
const optionsElement = switcher.nextElementSibling;
optionsElement.classList.toggle('hx:hidden');
// Calculate the position of a language options element.
const switcherRect = switcher.getBoundingClientRect();
// Must be called before optionsElement.clientWidth.
optionsElement.style.minWidth = `${Math.max(switcherRect.width, 50)}px`;
const isOnTop = switcher.dataset.location === 'top';
const isRTL = document.body.dir === 'rtl'
// Stuck on the left side of the switcher.
let translateX = switcherRect.left;
if (isOnTop && !isRTL || !isOnTop && isRTL) {
// Stuck on the right side of the switcher.
translateX = switcherRect.right - optionsElement.clientWidth;
}
// Stuck on the top of the switcher.
let translateY = switcherRect.top - window.innerHeight - 15;
if (isOnTop) {
// Stuck on the bottom of the switcher.
translateY = switcherRect.top - window.innerHeight + 180;
}
optionsElement.style.transform = `translate3d(${translateX}px, ${translateY}px, 0)`;
toggleMenu(switcher);
});
});
window.addEventListener("resize", () => languageSwitchers.forEach(resizeMenu))
// Dismiss language switcher when clicking outside
document.addEventListener('click', (e) => {
if (e.target.closest('.hextra-language-switcher') === null) {