When wide tables exist, in the desktop theme there is a horizontal scroll bar that hints the visitor we can scroll left and right. However in the Mobile theme there is no such scroll bar and the wide table view is really not intuitive, with visitors not being aware that the table is wider than their screen width. Could we add a scroll bar for mobile as well?
Discussion about this matter (however regarding only Desktop theme) occurred bere
What do you think @awesomerobot?
This is a good example of where the auto-hidden scrollbars on mobile/touch browsers aren’t great…
Discourse only officially supports Chrome & Safari on mobile, which means we can style our own scrollbar using CSS like ::-webkit-scrollbar (support). Mobile Firefox users would see no change.
I think what I would prefer to do, which would support all mobile browsers, is to add a fade to the right of the table once it gets wider than the content of the post. Then at least there’s a hint to see more even if there’s no explicit scrollbar.
The problem with that is that currently we overflow: hidden anything within .cooked as a bit of a safety so post content can’t break the page layout… so we can’t style overflowed content when there’s no visible overflow.
We might not need to overflow: hidden post content anymore? I’ll take a closer look and see if it’s sane to remove it, and if not I can add a visible scrollbar for webkit on mobile.
If it works but the scroll bar is hidden, that’s good enough for now – I don’t want to turn this into a ton of work. You have a solution @Mr.X_Mr.X
Yes, it’s low priority… but somewhat related to what I was already considering to fix Letters getting cut off to the leftmost in posts
Ich mag die Idee des Fade-Effekts wirklich, sowohl auf dem Desktop als auch auf mobilen Geräten. Hat sich in der Zwischenzeit etwas geändert, das es jetzt leichter möglich macht?
Ist das eine einfache Änderung @awesomerobot? Ich unterstütze das.
Bei einer erneuten Überprüfung ist der Fade-Effekt hier wahrscheinlich keine gute Option… Dies würde das Hinzufügen eines Containers mit einem Farbverlauf-Hintergrund erfordern, der auf keinem Hintergrund außer einem einfarbigen gut funktionieren würde. Wir verwenden einen ähnlichen Fade-Hinweis an einigen anderen Stellen, aber dies sind in der Regel Bereiche, bei denen weniger wahrscheinlich ein benutzerdefinierter Hintergrund vorhanden ist (Anmeldung, Admin-Navigation).
Ich denke, es wäre besser, bei Bedarf eine Scrollleiste anzuzeigen zu erzwingen. Soweit ich weiß, ist der einzige Nachteil davon, dass die benutzerdefinierte Scrollleiste nicht mit den nativen Scrollbalken Ihres Betriebssystems übereinstimmt.
Das klingt nach einem besseren Kompromiss als keine Anzeige, dass die Tabelle horizontal scrollt.
Agh, wieder einmal gescheitert. iOS 13 hat die Möglichkeit, die Bildlaufleiste immer anzuzeigen, außer Kraft gesetzt… also funktioniert diese Idee nicht für alle Browser, wie ich gehofft hatte.
Das vorherige CSS-Override, um Bildlaufleisten auf iOS zum Erscheinen zu zwingen, erforderte die Verwendung von -webkit-overflow-scrolling: auto;, aber iOS 13 setzt -webkit-overflow-scrolling: touch; überall standardmäßig und sie scheinen -webkit-overflow-scrolling in iOS vollständig veraltet zu haben.
Jetzt, in iOS 15 in Richtung 16, scheinen breite Tabellen in Discourse auf Mobilgeräten nicht besser abzuschneiden.
FWIW, die zweite Tabelle in diesem Beitrag zu einem Fehler bei erweiterbaren Tabellen ist ein Beispiel für eine Tabelle, die auf Mobilgeräten (und auf Desktops) aufgrund fehlender horizontaler Scrollbalken fehlschlägt.
