Drawer

A drawer is a UI element that will be used on mobile to display extra content from a menu in a collapsible overlay.

Behavior

To remove the drawer you can either use on the button inside the modal or tap outside of the screen.


Header can contain “x” to close the drawer or back button

 

The drawer has a maximum height of 80% of the screen and a minimum height of 50%. This means that if its contents are less than 50% of the screen, it will occupy 50% of the screen by default.

 

 

The background should be darker to highlight the content on the drawer