M_Viper/Minecraft-Modern-Theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 10 Wiki Activity

Update from Git Manager GUI

Browse Source
This commit is contained in:
M_Viper
2026-03-19 23:51:57 +01:00
parent 3d08d57d64
commit 2855fbada5
5 changed files with 193 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
Minecraft-Modern-Theme/js/navigation.js
View File

@@ -1,8 +1,11 @@
( function() {
// FIX: Null-Check – Script bricht auf Login-Seite & Seiten ohne Nav nicht mehr ab
const siteNavigation = document.getElementById( 'site-navigation' );
const menuToggle = siteNavigation.querySelector( '.menu-toggle' );
if ( ! siteNavigation ) {
return;
}
// Early exit wenn kein Toggle da ist
const menuToggle = siteNavigation.querySelector( '.menu-toggle' );
if ( ! menuToggle ) {
return;
}
@@ -10,8 +13,7 @@
// Toggle Klassen hinzufügen (Menü öffnen/schließen)
menuToggle.addEventListener( 'click', function() {
siteNavigation.classList.toggle( 'toggled' );
// Aria States aktualisieren
if ( menuToggle.getAttribute( 'aria-expanded' ) === 'true' ) {
menuToggle.setAttribute( 'aria-expanded', 'false' );
menuToggle.innerHTML = '<i class="fas fa-bars"></i>';
@@ -21,18 +23,37 @@
}
} );
// Mobile Submenu Toggle (Klick auf Parent-Item öffnet Untermenü)
// FIX: Menü bei Klick außerhalb schließen
document.addEventListener( 'click', function( e ) {
if ( siteNavigation.classList.contains( 'toggled' ) && ! siteNavigation.contains( e.target ) ) {
siteNavigation.classList.remove( 'toggled' );
menuToggle.setAttribute( 'aria-expanded', 'false' );
menuToggle.innerHTML = '<i class="fas fa-bars"></i>';
}
} );
// Mobile Submenu Toggle
const subMenuParents = siteNavigation.querySelectorAll( '.menu-item-has-children' );
subMenuParents.forEach( function( subMenuParent ) {
subMenuParent.addEventListener( 'click', function( e ) {
// Nur auf Mobil aktivieren (Media Query Check)
if ( window.innerWidth <= 992 ) {
// Optional: Verhindern, dass der Link geklickt wird, wenn man nur das Menü öffnen will
// e.preventDefault();
// FIX: Eigenen Toggle-Button erzeugen statt gesamtes <li> klickbar zu machen
const toggleBtn = document.createElement( 'button' );
toggleBtn.classList.add( 'submenu-toggle' );
toggleBtn.setAttribute( 'aria-expanded', 'false' );
toggleBtn.innerHTML = '<i class="fas fa-chevron-down"></i>';
// Klasse 'active' umschalten für das CSS Display
this.classList.toggle( 'active' );
const parentLink = subMenuParent.querySelector( 'a' );
if ( parentLink ) {
parentLink.insertAdjacentElement( 'afterend', toggleBtn );
}
toggleBtn.addEventListener( 'click', function( e ) {
e.stopPropagation();
if ( window.innerWidth <= 992 ) {
const isOpen = subMenuParent.classList.toggle( 'active' );
toggleBtn.setAttribute( 'aria-expanded', isOpen ? 'true' : 'false' );
// Icon drehen
toggleBtn.querySelector('i').style.transform = isOpen ? 'rotate(180deg)' : 'rotate(0deg)';
}
} );
} );