lux-menu: Austausch von flex-layout

[patrowe]

Aus der Komponente lux-menu müssen die Befehle von Flex-Layout entfernt werden. Für den Austausch stehen die neuen lux-layout-Klassen aus dem Lux-Components-Theme bereit.

Aktzeptanzkriterium: Alle Befehle von angular/flex-layout wurden aus der Komponente entfernt.

[patrowe]

Test für lux-menu

Testvorbereitung

• Die angehängten Zweige für die lux-components und das lux-components-theme auschecken.
• Das Theme lokal bauen und mit den lux-components lokal verlinken.
• Das Demoprogramm starten und die Seite für das lux-menu öffnen.

Testdurchführung

A Für Desktop-Variante: Das Browserfenster maximieren. Default-Ansicht der Testkomponente (alle Elemente sind sichtbar, kein Trigger-Button):

- luxMaximumExtended auf den Wert 2 setzen: Zu erwartendes Ergebnis: 2 Menüeinträge und der Triggerbutton sind sichtbar. Triggerbutton öffnet ein Panel mit den weiteren 2Menüeinträgen.

-luxMaximumExtended auf den Wert 2 setzen und luxDisplayExtended auf false: Zu Erwartendes Ergebnis: 2 Menüeinträge und der Triggerbutton sind sichtbar. Der Triggerbutton befindet sich links.

-luxDisplayExtended auf false setzen: Zu erwartendes Ergebnis: Es ist nur noch der Triggerbutton sichtbar, alle Menüeinträge befinden sich im Menupanel.

B Responsives verhalten: Die Breite des Browserfensters schrittweise verringern. Die Menüeinträge in der Zeile müssen vollständig sichtbar bleiben. Erreicht der linke Menüeintrag den linken Rand, werden die Elemente von rechts anfangend nacheinander in das Panel verschoben werden.

vollständig Anzeige:

gekürzte Anzeige:

[patrowe]

@DSeifer Bitte testen!

[DSeifer]

Der Test ist in Confluence dokumentiert.