Farbe der mobilen unteren Leiste ändern

Ich sollte die Seite heute richtig live schalten, E-Mails versenden und die Leute dazu bringen, die PWA zu installieren :rofl::rofl::rofl:

Ich verstehe Ihren Frust, aber das ist keine sehr hilfreiche Antwort.

Alles, was ich im Moment sagen kann, ist, dass es so aussieht, als ob etwas das normale Verhalten modifiziert.

Können Sie überprüfen, welche Plugins oder Theme-Komponenten Sie installiert haben? Haben Sie weitere Anpassungen vorgenommen?

Es ist nicht nur meine Seite. Es ist jede Discourse-Seite???

Ich habe bereits erklärt, warum dies bei Discourse der Fall ist, aber nicht bei anderen Seiten.

Da Sie ein Kunde sind, können wir bereits sehen, mit welcher Seite Sie verbunden sind. Die Farben der Schaltflächen sind genau die gleichen wie auf dem Screenshot, den ich zuvor geteilt habe. Sie sind nicht so hell wie Ihre.

Es ist dasselbe beim Standardthema ohne Anpassung oder Komponenten

1 „Gefällt mir“

Das Problem mit den sehr hellen Schaltflächen auf der weißen unteren Leiste ist spezifisch für Ihr Gerät/Betriebssystem. Auf anderen getesteten Geräten ist die untere Leiste im hellen Modus des Betriebssystems tatsächlich weiß, aber die Schaltflächen sind grau und bleiben sichtbar. Das von Ihnen beobachtete Verhalten ist also nicht typisch und betrifft andere Benutzer nicht.

S ultra 22

Huawei mate20 pro

Dennoch verstehen wir, dass die Erfahrung bei der Verwendung der PWA mit einem dunklen Discourse-Theme, während das Android-Betriebssystem im hellen Modus ist, nicht ideal ist. Wie bereits erwähnt, werden wir eine interne Diskussion mit unseren Entwicklern und Designern eröffnen, um zu prüfen, wie wir dieses Szenario in zukünftigen Updates verbessern können.

1 „Gefällt mir“

Das ist seltsam und widerspricht dem, was Sie gesagt haben. Es ist wie Glücksspiel, haha.

Dies ist ein Samsung S24 im hellen Modus

Dies ist ein Google Pixel im hellen Modus

Ein iPhone hat die Leiste überhaupt nicht geladen, ähnlich wie bei @chapois Problem.

Ein älteres Samsung S22 hat sich mit einer weißen unteren Leiste und korrekt dunklen Symbolen geladen. Ich habe später noch 10 Leute, die einen Test machen, und werde mehr aktualisieren.

1 „Gefällt mir“

Ich denke, der Chrome-Browser kann dies in einigen Fällen handhaben, abhängig von der Android-Version, dem Gerät usw.

In einer PWA ändert die <meta name="theme-color"> zuverlässig die Farbe der oberen Adressleiste in Chrome unter Android. Die theme_color in manifest.json beeinflusst die Statusleiste und manchmal andere UI-Teile, aber das Verhalten variiert je nach Gerät, Browser und Android-Version.

Die native untere Navigationsleiste kann normalerweise nicht von einer Webanwendung aus gesteuert werden. Einige Browser wenden möglicherweise die Theme-Farbe an, aber dies ist nicht garantiert.

:up_arrow: Dies ist einer der Gründe, warum ich meine Website in eine TWA umgewandelt habe, mit Bubblewrap, das auch die Farben der unteren Navigationsleiste handhaben kann.

Mit einer PWA können Sie also die obere Leiste gestalten, aber die Steuerung der unteren Navigationsleiste ist inkonsistent.


Das iPhone wird diese Navigationsleiste nicht laden, da dies ein natives Element des Android-Betriebssystems ist.

2 „Gefällt mir“

Es ist einfach seltsam, ich bin noch nie auf dieses Problem gestoßen. Ich habe das WordPress Super PWA auf 9 Websites verwendet und hatte nie Probleme. Nur das Discourse-Problem. Wie Sie sagen, sind Sie auf das gleiche Problem der Inkonsistenz gestoßen. Hoffentlich können sie den unteren Balken so gestalten, dass er dem oberen ähnelt, da dies auf jedem Gerät wie erwartet funktioniert.

@dax @chapoi noch bizarrer. Wenn ich die PWA auf meinem Handy über Firefox installiere, funktioniert sie perfekt. Zumindest sehe ich jetzt die unteren Schaltflächen.

Dies ist im hellen Modus

1 „Gefällt mir“

Der Grund, warum es unter Firefox funktioniert, aber nicht unter Chrome, liegt darin, wie jeder Browser PWAs unter Android behandelt. Chrome achtet nur auf die theme_color im Web App Manifest, um die Systemleiste einzufärben. Wenn das Manifest nicht von der Stammdomain der Website bereitgestellt wird oder nicht die richtige Farbe hat, greift Chrome einfach auf Weiß zurück. Firefox ist flexibler und übernimmt die Farben von der Seite selbst, sodass die Leiste auch ohne benutzerdefiniertes Manifest korrekt aussieht.

Da wir uns weiterentwickeln, habe ich eine gehostete Discourse-Site mit einer dunklen Palette. Wir haben alle anderen Paletten deaktiviert, damit Benutzer sie nicht auswählen können, was unserer Marke entspricht. Wir haben ein Theme aktiviert, das Benutzer nicht ändern können.

Wie können wir die untere Leiste in der PWA unter Chrome auf #121212 setzen, da eine installierbare App für uns wichtig ist?

Die dunkle Website und eine helle untere Leiste sind so ablenkend und sehen schrecklich aus.

Wie ich bereits sagte, habe ich eine interne Diskussion eröffnet, um mögliche Verbesserungen für dieses Szenario zu untersuchen. Da jedoch bald das globale Discourse-Treffen stattfindet, kann das Team kurzfristig keine Änderungen vornehmen, und leider gibt es derzeit keine Problemumgehung, die garantieren kann, dass die untere Leiste immer dunkel erscheint.

Kurzes Follow-up. Dies wurde nun einem Ingenieur zur Überprüfung zugewiesen. Beachten Sie jedoch, dass das jährliche Discourse-Treffen sehr bald stattfindet, daher glaube ich nicht, dass es kurzfristig (kurzfristig bedeutet „Tage“) Updates geben wird.

5 „Gefällt mir“