Add demo text to left navigation content

This commit is contained in:
2026-06-16 20:40:48 +02:00
parent 0204e9ec99
commit 8690a64a94
+43 -1
View File
@@ -41,8 +41,50 @@
</nav> </nav>
</aside> </aside>
<section class="sg-group-card sg-left-navigation-pattern__group-card sg-left-navigation-pattern__group-card--content" data-component="group-card" aria-hidden="true"> <section class="sg-group-card sg-left-navigation-pattern__group-card sg-left-navigation-pattern__group-card--content" data-component="group-card">
<h2 class="sg-heading-h2 sg-text-on-dark sg-group-card__heading" data-left-navigation-content-heading>Übersicht</h2> <h2 class="sg-heading-h2 sg-text-on-dark sg-group-card__heading" data-left-navigation-content-heading>Übersicht</h2>
<p class="sg-body sg-left-navigation-pattern__content-text">
Zeile 1: Überblick über die aktuelle Navigation.<br>
Zeile 2: Die Inhalte orientieren sich am aktiven Menüpunkt.<br>
Zeile 3: Jede Auswahl aktualisiert die Überschrift.<br>
Zeile 4: Die Content-Card bleibt optisch eigenständig.<br>
Zeile 5: Der Aufbau folgt dem linken Navigationsbereich.<br>
Zeile 6: Die Breite bleibt flexibel innerhalb des Layouts.<br>
Zeile 7: Lange Inhalte werden im Card-Rahmen geführt.<br>
Zeile 8: Der Text dient als Platzhalter für spätere Inhalte.<br>
Zeile 9: Die Darstellung bleibt auf Desktop und Mobile stabil.<br>
Zeile 10: Die Navigation links steuert den sichtbaren Zustand.<br>
Zeile 11: Der aktive Punkt ist visuell hervorgehoben.<br>
Zeile 12: Inaktive Punkte bleiben als klare Auswahloptionen sichtbar.<br>
Zeile 13: Die Content-Card reagiert auf den ausgewählten Eintrag.<br>
Zeile 14: Die Überschrift übernimmt den Namen des Menüpunkts.<br>
Zeile 15: Der Text kann später durch Fachinhalte ersetzt werden.<br>
Zeile 16: Die Gruppe bleibt als zusammenhängender Bereich lesbar.<br>
Zeile 17: Kartenabstände folgen den vorhandenen Styleguide-Tokens.<br>
Zeile 18: Keine lokalen Sonderregeln sind für den Demo-Text nötig.<br>
Zeile 19: Die Struktur bleibt bewusst einfach und nachvollziehbar.<br>
Zeile 20: Das Layout zeigt Navigation und Inhalt nebeneinander.<br>
Zeile 21: Der linke Bereich bleibt auf die Navigation fokussiert.<br>
Zeile 22: Der rechte Bereich zeigt den zugehörigen Inhalt.<br>
Zeile 23: Der Text dient als Füllmaterial für die Layoutprüfung.<br>
Zeile 24: Die Card-Höhe passt sich dem vorhandenen Inhalt an.<br>
Zeile 25: Scrollverhalten ist in diesem Demo-Zustand nicht nötig.<br>
Zeile 26: Die Darstellung bleibt ohne zusätzliche Interaktion verständlich.<br>
Zeile 27: Weitere Inhalte lassen sich später ergänzen oder ersetzen.<br>
Zeile 28: Die Auswahl folgt weiterhin dem Tab-Button-Verhalten.<br>
Zeile 29: Visuelle Konsistenz hat Vorrang vor dekorativen Effekten.<br>
Zeile 30: Der Demo-Text bleibt neutral und fachlich unaufgeladen.<br>
Zeile 31: Jede Zeile stützt die Prüfung der vertikalen Kartengröße.<br>
Zeile 32: Der Content-Bereich ist damit klar als gefüllte Fläche erkennbar.<br>
Zeile 33: Der Text nutzt die vorhandenen Typografie-Tokens.<br>
Zeile 34: Die Lesbarkeit bleibt auf hellem Inhaltshintergrund hoch.<br>
Zeile 35: Die Spaltenlogik wird durch den Text noch deutlicher.<br>
Zeile 36: Das Beispiel unterstützt die Wahrnehmung des Pattern-Rahmens.<br>
Zeile 37: Der Inhalt bleibt austauschbar und ohne Geschäftslogik.<br>
Zeile 38: Die Group Card dient als Container für den Demo-Inhalt.<br>
Zeile 39: Das Muster zeigt die vorgesehene Struktur des Portals.<br>
Zeile 40: Die finale Zeile schließt den Demo-Block sauber ab.
</p>
</section> </section>
</div> </div>
</section> </section>