Wenn die Header-Untermenüs Theme-Komponente aktiv ist, verschwinden die Symbole am unteren Rand der Seitenleiste vom Bildschirm.
Wahrscheinlich gibt es eine CSS-Berechnung, die in die falsche Richtung geht?
4 „Gefällt mir“
Benutzerdefinierte Header werden überhaupt nicht in die Berechnung einbezogen. Dies kann reproduziert werden, indem dem header-Abschnitt eines Themas beliebiger Inhalt hinzugefügt wird.
Die Berechnung, die wir für die Seitenleiste und den Chat verwenden, berücksichtigt die Höhe des Discourse-Headers und legt --header-offset als Variable fest, wenn einige Höhen berechnet werden.
Die Einbeziehung benutzerdefinierter Header kann etwas knifflig sein, da benutzerdefinierte Header-Inhalte beim Scrollen nicht standardmäßig fixiert sind, wie es der Discourse-Header tut … Wenn wir ihn also standardmäßig in die Berechnung einbeziehen, ist die Höhe falsch, sobald Sie scrollen und der benutzerdefinierte Header verschwunden ist.
Wenn ich beispielsweise --header-offset manuell um die Höhe meines benutzerdefinierten Headers (standardmäßig etwa 60 Pixel) erhöhe, entsteht beim Scrollen eine Lücke über der Seitenleiste:
Wir fügen der body eine .docked-Klasse hinzu, sobald ein benutzerdefinierter Header aus dem Blickfeld gescrollt ist. Daher ist es möglich, dies zu verwenden … was besser ist, aber es gibt einen spürbaren Übergang, während die Seitenleistenhöhe zwischen den Zuständen angepasst wird … dies liegt daran, dass .docked entweder ein- oder ausgeschaltet ist.
Wenn Sie einen fixierten Header wünschen, ist dies etwas einfacher zu handhaben … da Sie --header-offset um die Höhe des benutzerdefinierten Headers erhöhen und dann den top-Wert von .d-header-wrap auf die Höhe des benutzerdefinierten Headers setzen können:
Eine Lösung, die mir für die Verbesserung des Falls des nicht fixierten Headers einfällt, ist:
- Überprüfen Sie die Höhe des benutzerdefinierten Headers
- Beziehen Sie die Höhe des benutzerdefinierten Headers in
--header-offsetein - Dekrementieren Sie die für die
--header-offset-Berechnung verwendete Höhe des benutzerdefinierten Headers basierend auf der Scroll-Position. Dies passt die Seitenleistenhöhe allmählicher an, als es die.docked-Klasse kann.
Es kann einige Experimente erfordern, um es richtig hinzubekommen …
5 „Gefällt mir“
Das ist sehr hilfreich, danke @awesomerobot
(verschoben nach UX)
4 „Gefällt mir“
Dies wurde hier implementiert (vielen Dank an @david):
Dies sollte Probleme mit der Seitenleiste, dem Chat und anderen Inhalten des benutzerdefinierten Headers lösen.
4 „Gefällt mir“