apps/BareRTC
1
0
Fork 0
Code Issues 12 Pull Requests Packages Projects Releases Wiki Activity

Page display bug on some iPads between the mobile and desktop layouts #47

New Issue
Closed
opened 2025-02-03 20:03:08 +00:00 by kirsle · 0 comments
kirsle commented 2025-02-03 20:03:08 +00:00
Owner
Copy Link

On some iPads that have a 1024px wide screen in landscape mode have a display bug where the chat page is "between" the mobile and desktop layouts:

  • The mobile layout is used where only one panel appears at a time, instead of the 3-panel desktop layout.
  • However, the corner buttons that are supposed to toggle and show the left/right panels do not appear, so these iPad users can't navigate to the other panels.

The bug seems to fire when the screen width is exactly 1024 pixels wide:

  • At <= 1023 pixels, you get the mobile layout with the corner buttons present.
  • At == 1024 pixels, you get the mobile layout but no corner buttons.
  • At >= 1025 pixels, the full desktop layout is used (so the corner buttons are correctly hidden).

Root cause: Bulma CSS has a .mobile-only class which is used on those corner buttons and it has this one-pixel dead zone where it is misfiring.

It should be replaced with a custom CSS class to fine-tune the screen width selector.

On some iPads that have a 1024px wide screen in landscape mode have a display bug where the chat page is "between" the mobile and desktop layouts: * The mobile layout is used where only one panel appears at a time, instead of the 3-panel desktop layout. * However, the corner buttons that are supposed to toggle and show the left/right panels do not appear, so these iPad users can't navigate to the other panels. The bug seems to fire when the screen width is exactly 1024 pixels wide: * At <= 1023 pixels, you get the mobile layout with the corner buttons present. * At == 1024 pixels, you get the mobile layout but no corner buttons. * At >= 1025 pixels, the full desktop layout is used (so the corner buttons are correctly hidden). Root cause: Bulma CSS has a `.mobile-only` class which is used on those corner buttons and it has this one-pixel dead zone where it is misfiring. It should be replaced with a custom CSS class to fine-tune the screen width selector.
kirsle added the
bug
 label 2025-02-03 20:03:08 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels   
bug

Something is not working

  
duplicate

This issue or pull request already exists

  
enhancement

New feature

  
help wanted

Need some help

  
invalid

Something is wrong

  
question

More information is needed

  
wontfix

This won't be fixed

No Label
bug
duplicate
enhancement
help wanted
invalid
question
wontfix
Milestone
Clear milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
No Assignees
1 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: apps/BareRTC#47
No description provided.
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?