Header-Untermenüs

Es scheint jetzt einen Fehler zu geben, wenn der feste Modus (Menü immer anzeigen, auch beim Scrollen nach unten) aktiviert ist.

Ich sehe dies mit Discourse 2.9.0.beta8 und habe es auch leicht auf der offiziellen Vorschauseite des Discourse-Themes reproduziert. Ich glaube, ich habe es zum ersten Mal vor etwa 2 Wochen bemerkt, bin mir aber nicht ganz sicher, wann es angefangen hat.

Zur Reproduktion:

  • Aktivieren Sie den festen Modus in den Einstellungen der Themenkomponente.
  • Klicken Sie auf einen Thread mit vielen Antworten.
  • (Wenn Sie den Thread zum ersten Mal lesen und ganz oben sind, scrollen Sie ein paar Antworten nach unten, gehen Sie zurück zur Thread-Liste und klicken Sie dann erneut auf den Thread, damit Sie zu dem Beitrag zurückgeleitet werden, bei dem Sie waren.)

Die benötigte Polsterung am oberen Rand der Seite wird falsch berechnet, wodurch der obere Teil des Beitrags und der Name des Verfassers unter der Kopfzeile scrollen und abgeschnitten werden.

Sie müssen jedes Mal ein wenig nach oben scrollen, wenn Sie auf einen Thread klicken, nur um zu sehen, von wem Sie gerade lesen.

Sie sehen dies beim Betreten des Threads:

Wenn Sie so etwas sehen sollten:

Was wirklich seltsam ist, ist, dass es nicht immer passiert und das Drücken von Strg+F5 behebt es oft. Aber es passiert eine Weile später wieder.

Das Bearbeiten des CSS, um die Polsterung zu erhöhen, die es zum Haupt-Outlet hinzufügt, behebt die Dinge irgendwie, aber dann gibt es viel leeren Platz am oberen Rand der Themenlisten. Es scheint, dass die Themenlisten und Threads unterschiedliche Polsterungen benötigen, oder vielleicht fügt einer von ihnen die Polsterung doppelt hinzu oder eine zusätzliche Polsterung von woanders?

(Bearbeitung: Manchmal kann die Seite nicht weit genug nach oben scrollen, um das Problem zu sehen. Wenn Sie zum Beispiel zum letzten Beitrag in einem Thread gehen und dieser kurz ist, gibt es keine Möglichkeit, dass die Kopfzeile über den Namen des Posters ragt, selbst wenn Sie so weit wie möglich manuell nach unten scrollen. Das könnte einige Situationen erklären, in denen die Dinge zu funktionieren scheinen. Testen Sie mit einem Browserfenster, das nicht sehr hoch ist, um den Fehler am zuverlässigsten zu reproduzieren.)

3 „Gefällt mir“

Gibt es eine Möglichkeit, dies auf dem Anmeldebildschirm zu verhindern? Ich kann es mit dem folgenden CSS tun, aber dies zeigt immer noch das Header-Untermenü für eine Sekunde an und blendet es dann aus.

.static-login .top-menu {
	display: none;
}
.static-login .d-header-wrap {
	display: none;
}

Gibt es eine bessere Möglichkeit, dies während der static-login-Seite zu verhindern?

1 „Gefällt mir“

Diese und andere Themen funktionieren in der Crawler-Ansicht nicht. Die Crawler-Ansicht lädt den Großteil des JavaScripts von Discourse nicht.

3 „Gefällt mir“

Hallo Kris, diese Komponente könnte ein Update für die Verwendung mit dem Chat und der Seitenleiste gebrauchen. Wenn die fixed_mode-Einstellung aktiviert ist, werden der Chat und die Seitenleiste nicht nach unten verschoben und sitzen hinter dem d-header.

Die unten stehende CSS scheint die Dinge schön zu beheben, außer dass sie nicht gut mit Category Banners funktioniert, da sie auf Kategorieseiten den #main-outlet um zusätzliche 40px nach unten zu verschieben scheint. Danke!

.sidebar-wrapper, .main-chat-outlet, .chat-drawer {
    margin-top: 40px !important;
}
2 „Gefällt mir“

Danke für den Hinweis! Ich habe hier gerade einige Korrekturen vorgenommen:

1 „Gefällt mir“

Super, danke Kris! Irgendeine Idee, warum der #main-outlet um 40px nach unten fällt?

#main-outlet {
   padding-top: calc(1.8em + 40px);
}

2 „Gefällt mir“

Ah, das habe ich übersehen – das kann entfernt werden und wird entfernt, sobald dieser PR zusammengeführt wurde: UX: remove old main-outlet adjustment by awesomerobot · Pull Request #19 · discourse/discourse-header-submenus · GitHub

Update: Das wurde jetzt zusammengeführt, sodass der zusätzliche Platz verschwindet, wenn Sie die Komponente aktualisieren.

2 „Gefällt mir“

Wo findet ein Mann die Symbolnamen?

3 „Gefällt mir“

Ich glaube, alles, was hier aufgelistet ist, kann verwendet werden: Find the Perfect Icon for Your Project in Font Awesome 5 | Font Awesome

Obwohl einige Icons einen zusätzlichen Schritt erfordern… für Icons, die wir in Discourse nicht standardmäßig verwenden, müssen die Icon-Namen zur Svg icons-Theme-Einstellung hinzugefügt werden.

Wenn Sie es wirklich genau wissen wollen, sind alle Icons, die wir in Discourse standardmäßig verwenden, hier aufgelistet: discourse/lib/svg_sprite.rb at da0d20d4a99aab40bd08bf133a425be413521d5a · discourse/discourse · GitHub

Und alle Icons, die in Themes verwendet werden können (über die svg icons-Einstellung), befinden sich in diesem Verzeichnis: discourse/vendor/assets/svg-icons at main · discourse/discourse · GitHub

Das Anzeigen der SVG-Dateien auf GitHub ist nicht wirklich hilfreich, da Sie eine große weiße Box sehen:

aber Sie können auf die Schaltfläche “Raw” klicken und den Seitenquelltext anzeigen. Der Icon-Name ist die id des symbol

3 „Gefällt mir“

Du bist spitze, vielen Dank

2 „Gefällt mir“

Danke Kris, das hat es behoben. Ich habe jedoch noch ein paar andere Probleme bemerkt. .topic-navigation muss um 40 Pixel nach unten verschoben werden, und .topic-post.sticky-avatar .topic-avatar scheint beim Scrollen nach unten falsch berechnet zu werden und landet hinter dem d-header. Außerdem ist es möglich, den Composer und das Chatfenster zu hoch zu erweitern und die Steuerelemente hinter dem d-header zu verlieren. Ich glaube, das deckt alles ab!

Bearbeiten: noch eine Sache, wenn Sie einen Ankerlink besuchen, ist die Überschrift ebenfalls unter dem Header.

2 „Gefällt mir“

2 Beiträge wurden in ein neues Thema aufgeteilt: Die Komponente drückt den Chat nach unten und verdeckt teilweise die Chat-Eingabe

2 Beiträge wurden in ein bestehendes Thema zusammengeführt: Die Komponente schiebt den Chat nach unten und verdeckt teilweise die Chat-Eingabe

Hat das jemand herausgefunden? Mir gefällt der Ansatz, keinen zusätzlichen Speicherplatz zu verwenden und die bereits auf dem Bildschirm vorhandenen Ressourcen wiederzuverwenden.

Es ist wirklich cool, dass man durch das Überfahren des Logos zum Blog, zu den Dokumenten oder zum Wiki navigieren kann!

2 „Gefällt mir“

FWIW kann die von Kris erwähnte Einstellung „svg icons theme setting“ derzeit unter Admin > Einstellungen > Sonstiges > ganz unten gefunden werden, dort gibt es svg icon subset (…ich glaube, das ist richtig??)

1 „Gefällt mir“

Es gibt ein kleines z-index-Problem mit dem neuen Glimmer-Lightbox, 1001 setzt es nur über den Lightbox, da der Lightbox bei 1000 liegt.

2 „Gefällt mir“

Klassisches z-index-Problem, es wird bei der nächsten Aktualisierung von Discourse behoben

4 „Gefällt mir“

Vielen Dank für dieses nette Plugin.

Ich frage mich, ob es eine Möglichkeit gibt, die Untermenüs der Kopfzeile nicht anzuzeigen, wenn man nicht angemeldet ist?

Oder (als Entwicklungsidee?) vielleicht besser, was wäre mit Menüpunkten, die auf Gruppen (Vertrauensstufen oder andere) verlinken?
Leicht zu fragen, ich weiß…

Danke
C.

3 „Gefällt mir“

Ich glaube nicht, dass dies woanders steht, Entschuldigung, falls doch. Ich liebe die Verwendung von Header-Untermenüs, aber ich habe viele Top-Header, und das sieht auf dem Handy dementsprechend ziemlich schlecht aus. Ich hätte gerne, dass meine Header nicht über den Bildschirm hinausgehen und ich scrollen muss. Ist das möglich?

2 „Gefällt mir“

Okay, ich habe mein Problem irgendwie gelöst, indem ich einfach alle wichtigsten Links als Untermenüs in eine “Navigations”-Kopfzeile auf Mobilgeräten kompiliert habe.

2 „Gefällt mir“