Super sidebar peek on viewport edge hover

Details

Forked from discussion for collapsed state of the sidebar with the navigation redesign #378544 (comment 1260441580)

The user will be able to access the sidebar when it is collapsed by hovering over the left edge of the page which will expose the full sidebar in an overlay.

Implementation Guide

Resources

• Figma File
• Prototype (includes flows for both Fixed and Fluid layouts)

General guidelines

• Hovering over the far left of the page (8px out from edge) exposes the sidebar within an overlay.
• Only offer this hover state at breakpoint small and above.

Accessibility

• Ensure we account for users who accidentally move their mouse off the sidebar so that is doesn't immediately close
• Ensure the sidebar persists when interacting with various elements/menus within the sidebar
• Ensure the pointer can be moved to the sidebar content once it is shown by the trigger element (button and left portion of screen) without the content disappearing