diff --git a/Minecraft-Modern-Theme/style.css b/Minecraft-Modern-Theme/style.css index df14cfb..bca235a 100644 --- a/Minecraft-Modern-Theme/style.css +++ b/Minecraft-Modern-Theme/style.css @@ -73,7 +73,7 @@ a:hover { color: #fff; } .site-header { background-color: var(--header-bg); backdrop-filter: blur(10px); - padding: 15px 0; + padding: 30px 0; /* FIX: Mehr vertikaler Platz im Header */ position: sticky; top: 0; z-index: 1000; @@ -87,10 +87,15 @@ a:hover { color: #fff; } .header-main { display: flex; align-items: center; - justify-content: flex-start; - gap: 120px; /* Gleichmäßiger Abstand zwischen den Elementen */ + justify-content: space-between; /* FIX: Logo Links, Menü Mitte, Info Rechts */ + gap: 40px; /* Flexiblerer Abstand */ } +/* WICHTIG: Typo im Header.html korrigieren! + HTML:
+ CSS: .site-branding + Sie müssen die 'g' im HTML oder CSS angleichen, sonst ist das Layout kaputt. +*/ .site-branding { display: flex; align-items: center; @@ -117,12 +122,13 @@ a:hover { color: #fff; } /* === NEUE DROPDOWN NAVIGATION ======================================= */ /* =================================================================== */ -.main-navigation { +#site-navigation { position: relative; - flex-grow: 1; + flex-grow: 1; /* FIX: Navigation nimmt den gesamten Platz in der Mitte ein */ display: flex; - justify-content: center; /* Zentriert das Menü */ + justify-content: center; /* Zentriert das Menü innerhalb seines Raums */ align-items: center; + padding: 0 30px; /* Mindestabstand zu Logo und Socials */ } /* Hauptliste (Top Level) */ @@ -132,7 +138,7 @@ a:hover { color: #fff; } list-style: none; margin: 0; padding: 0; - gap: 25px; + gap: 20px; /* Abstand zwischen Menüpunkten horizontal */ } /* Menüpunkte */ @@ -142,12 +148,12 @@ a:hover { color: #fff; } /* Links in der Navigation */ .main-navigation a { - display: block; + display: inline-block; font-size: 15px; font-weight: 600; color: var(--text-muted); text-decoration: none; - padding: 10px 0; + padding: 20px 0; /* FIX: Mehr vertikaler Platz (Oben/Unten) ohne horizontales Padding */ transition: color 0.3s ease; position: relative; } @@ -209,6 +215,12 @@ a:hover { color: #fff; } border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 14px; white-space: nowrap; + + /* FIX: Vollständige Hintergrund-Markierung */ + display: block; + width: 100%; + box-sizing: border-box; /* Padding wird zur Breite hinzugezählt */ + transition: background-color 0.2s ease, color 0.2s ease, padding-left 0.2s ease; } .sub-menu li:last-child a { @@ -658,7 +670,7 @@ html.light-mode .icon-sun { opacity: 1; } } .faq-answer p { margin-bottom: 20px; font-size: 0.9rem; } .faq-item.active .faq-answer { - padding: 0 20px 20px 20px; + padding: 0 20px 20px; max-height: 1000px; transition: max-height 0.4s ease-in, padding 0.4s ease-in; } @@ -881,7 +893,7 @@ main#primary.site-main { .site-branding { flex-grow: 1; } .header-info { order: 2; } /* Social rechts */ - .main-navigation { order: 3; width: 100%; } + #site-navigation { order: 3; width: 100%; } .menu-toggle { display: block; @@ -902,13 +914,13 @@ main#primary.site-main { } /* Wenn .toggled aktiv ist, zeigen */ - .main-navigation.toggled .primary-menu { + #site-navigation.toggled .primary-menu { display: flex; animation: slideDown 0.3s ease forwards; } .menu-item { width: 100%; text-align: left; } - .main-navigation a { padding: 15px 20px; } + #site-navigation a { padding: 15px 20px; } /* Submenus mobil - Akkordeon Style */ .sub-menu { @@ -949,8 +961,8 @@ main#primary.site-main { .custom-logo-link img, .custom-logo { max-height: 50px; } /* Hero */ - .hero-title, .slider-title { font-size: 32px; } - .hero-subtitle, .slider-subtitle { font-size: 18px; } + .slider-title { font-size: 32px; } + .slider-subtitle { font-size: 18px; } .hero-buttons a { display: block; margin: 10px auto; width: 80%; } /* Footer Responsive */