Aktive Klasse auf nav-pills > li für About, FAQs, TOS setzen

Es scheint einen kleinen Fehler beim Setzen der active-Klasse auf den nav-pills für „about“, „faqs“, „tos“ usw. zu geben. Die active-Klasse wird zwar korrekt für den untergeordneten Link <a /> gesetzt, jedoch zweimal zum Element hinzugefügt und fehlt beim übergeordneten <li />.

Das Hinzufügen der zweiten active-Klasse zum <li> würde dies für das Styling in meinem Theme beheben.

Ich bin mir nicht sicher, ob wir jemals eine „active“-Klasse auf den LI-Elementen von nav-pills unterstützt haben. Ich bin nicht dagegen, diese Unterstützung für Themes hinzuzufügen, da sie nützlich sein könnte. Allerdings müsste dafür einiges umstrukturiert werden.

@techAPJ Ich glaube, du hast das verschoben. Gibt es einen Grund für diese „active“-Klasse? Das scheint mir ein Fehler zu sein?

Was die größere Diskussion über das Hinzufügen einer „active“-Klasse zu LIs basierend auf der Route angeht, überlasse ich das @eviltrout und @awesomerobot. Momentan verwenden wir „link-to“, was uns nur automatische Unterstützung für route-basierte Klassen auf dem A-Element bietet. Wahrscheinlich bräuchten wir dafür eine neue Komponente.

Irgendwann hatten wir bei einigen li-Elementen in allen nav-pills einen aktiven Zustand, und an anderen Stellen war active auf den a-Elementen gesetzt…

Wie ich mich erinnere, wollte ich die Dinge konsistenter gestalten, also habe ich die active-Klasse überall auf a verschoben? Sie auf li zu setzen ist völlig in Ordnung, aber ich denke, @sam hat recht, und ich habe mich dafür entschieden, sie auf a zu setzen, weil es keine einfache Möglichkeit gab, sie stattdessen auf alle li-Elemente zu legen…

Gibt es eine Möglichkeit, das übergeordnete Element (li) eines a-Elements mit CSS auszuwählen? Ich konnte keine Möglichkeit finden, das übergeordnete Element basierend auf dem untergeordneten Element zu stylen.

Die li-Elemente in der Themenliste haben die Klasse active, daher habe ich angenommen, dass dies die Absicht in der Benutzernavigation war, die möglicherweise übersehen wurde.

Nein, CSS hat keinen Parent-Selektor. Um das zu erreichen, was Sie suchen, müssten wir, wie oben erwähnt, eine neue Komponente implementieren.

Ok, danke @awesomerobot!