Im Desktop-Modus auf dem Handy wegen eines langen Logos gefangen

Unterstützung
1

Das könnte als Fehler betrachtet werden, bin mir aber nicht sicher.

Ich habe einen Benutzer, der auf einem mobilen Gerät im Desktop-Modus feststeckt (wer weiß, warum er den Desktop-Modus ausgewählt hat), weil das Hamburger-Menü durch unser langes Logo vom Bildschirm gedrückt wird. Ich kann dies auf Meta nicht reproduzieren, da das Logo auch im Desktop-Modus gut passt.

Ich könnte ihm sagen, die URL zu ändern, um aus dem Desktop-Modus zu kommen, aber das ist in der Discourse-App nicht möglich. Ich kann das Logo vorübergehend ausblenden, damit er zurückwechseln kann, aber eine echte langfristige Lösung wäre trotzdem schön, auch wenn es sich um einen Randfall handelt.

Ich habe alle Theme-Komponenten und Plugins deaktiviert und kann das Problem trotzdem reproduzieren.

image
image1104×1574 287 KB

2

Vielleicht könntest du den Link Nature Photographers Network in das Dropdown-Menü „Community“ aufnehmen (um zur mobilen Ansicht zurückzukehren).

Du könntest die Option „Desktop-Ansicht“ im Hamburger-Menü über eine Theme-Komponente entfernen.

Ich frage mich, ob das Entfernen des Forums aus der Discourse-App und das anschließende erneute Hinzufügen das aktuelle Problem lösen würde.

3

Ja, ich stimme zu, das muss im Kern behoben werden. Ich denke, die beste Lösung wäre, für kleine Fenstergrößen (unter 768 px) im Desktop-Layout eine maximale Breite für das Logo vorzugeben.

Der einfachste Weg, dies zu reproduzieren, besteht darin, den Modus für responsives Design in Ihrem Browser zu verwenden, jedoch KEINen mobilen User-Agent. Dadurch wird die Desktop-Website geladen, und Sie können das Fenster dann auf kleine Größen verkleinern. (Beispiel unten aus Safari.)

image
image1580×2012 324 KB

4

Danke, Penar, das hat mich auf die Idee gebracht, das Logo in der Desktop-Ansicht unter 768px gegen das mobile Logo auszutauschen. Etwas Ähnliches sollte wahrscheinlich im Kern enthalten sein. Danke!

@media only screen and (max-width: 768px) {
  body {
    .d-header #site-logo {
       content:url("https://images.naturephotographers.network/original/2X/4/45d1b54bc00a5a737fae7dfe3d79b8d8dfd71729.png");
    }
  }
}