Keeping the sidebar above the keyboard on small screens

The situation

A problem occurred where the sidebar rail and its list rows were being covered by the keyboard and typing bar on small screens, both in the app and in a phone browser. This issue happened because the window did not shrink when the keyboard opened, and the rail was measured from the window's bottom edge. The goal was to find a solution that would work for both upright and sideways orientations, in the app and in a browser. The problem was identified through a picture and source lines that showed the rail running under the keyboard and the typing bar covering it.

What they weighed

• Use a value from the binder to move the sidebar above the keyboard

  Chosen

• Hide the typing bar in the app's web view

What they decided

Use a value from the binder to move the sidebar above the keyboard

Why

One value from the binder that the workspace already uses could move every window-edge sidebar part above the keyboard on every phone browser and in the app, upright and sideways. Hiding the typing bar would only fix the app and leave the rail under the keyboard itself. The chosen solution was more comprehensive and would work for all cases.

The first step

Commit the changes, deploy, and confirm the live bundle holds the new value, then test the app in the simulator

How they would know it worked

No sidebar row shows behind the keyboard or its typing bar, and the list bottom sits at the visible area's bottom

How it turned out

Not known yet. The result is added here when it comes in.