Core container/sheet component

[HadrienGardeur]

Most of our affordances will use a shared container component with:

• a sticky header containing:
  • a title
  • actions as defined in Support for actions #11
  • with the close action showing up as one of them
• and a scrollable body

In this Epic, we'll implement this component in all of its variants which include:

• a modal sheet on larger screens
• a docked/side sheet (left/right) on larger screens
• a draggable bottom sheet on smaller screens
• a full screen sheet on smaller screens

We'll use our current user settings to illustrate all of this behavior:

• with "Display settings" as a title
• and the following actions:
  • overflow menu (hidden on mobile):
    • docked left
    • docked right
    • modal
  • close

On mobile, this will show up as a draggable bottom sheet.