diff --git a/patterns/left-navigation.html b/patterns/left-navigation.html
index 476288d..755a9b0 100644
--- a/patterns/left-navigation.html
+++ b/patterns/left-navigation.html
@@ -61,8 +61,8 @@
menu.hidden = !expanded;
toggle.setAttribute('aria-expanded', String(expanded));
toggle.textContent = expanded ? 'Ausblenden' : 'Einblenden';
- toggle.classList.toggle('sg-button--active', expanded);
- toggle.classList.toggle('sg-button--inactive', !expanded);
+ toggle.classList.add('sg-button--active');
+ toggle.classList.remove('sg-button--inactive');
};
const syncMode = () => {
diff --git a/styles/29-patterns-left-navigation.css b/styles/29-patterns-left-navigation.css
index 69501b3..e10ba50 100644
--- a/styles/29-patterns-left-navigation.css
+++ b/styles/29-patterns-left-navigation.css
@@ -28,6 +28,10 @@
display: none;
}
+.sg-left-navigation-pattern__toggle {
+ display: none;
+}
+
.sg-left-navigation-pattern__group-card {
min-width: 0;
}
@@ -55,13 +59,14 @@
margin-bottom: 0;
}
+ .sg-left-navigation-pattern__toggle {
+ display: inline-flex;
+ flex: 0 0 auto;
+ }
+
.sg-left-navigation-pattern__group-card--navigation {
flex: 0 0 auto;
width: 100%;
max-width: none;
}
-
- .sg-left-navigation-pattern__toggle {
- flex: 0 0 auto;
- }
}