etn-ccis/blui-angular-design-patterns

Bottom sheet covers entire screen on landscape view

Closed this issue · 3 comments

Bug or feature request?

Enhancement

What is the expected behavior?

Bottom sheet to include sticky close button/link

What is the current behavior?

Bottom sheet currently covers entire screen on landscape view, user will need to scroll to touch/click close button

What are the steps to reproduce?

  1. Open complex bottom sheet on any device or simulate in browser then open bottom sheet

What is your environment?

Framework

  • Angular

Browser

  • Internet Explorer
  • Safari
  • Chrome
  • Firefox

Operating System

  • MacOS
  • Windows
  • Other

Anything else to add?

Screen Shot 2020-08-19 at 9 24 49 AM

The close button should be positioned at the bottom of the screen, at all times.

Check the react complex bottom sheet example as well.

React looks like this on Landscape iPhone SE, the smallest phone currently popular in the world. The bottomsheet is 315.9px tall, which makes this not worth fixing at the moment.

image

We can come back on this when we overhaul the design patterns to make react and angular match with each other.