Usage guidelines outline how the components should and shouldn’t be used in different user interface contexts.
Best practices
Avoid stacking multiple overlays on top of each other, especially dialogs and drawers.
This can confuse and disorient users as they lose their original context. Stacked overlays require users to dismiss each individually, creating a tedious and overwhelming experience.
Consider whether you're using the right pattern and how another pattern may improve the user's workflow.
Popovers in Overlays
Before using a Popover in an overlay, consider whether the extra hidden information is necessary. For example, perhaps you could display a simple link to Octopus docs where that information already lives.
Consider using an Accordion rather than a Popover when there is a large amount or multiple sections of optional information.
If you do need to use a Popover in an overlay, we recommend using Popover Basic Help, which delivers contextual information in an unobtrusive way.
Popover Basic Help is always available as an optional element in our form labels. See "Providing contextual help" (in the Forms UI Pattern) for more guidance.
Be mindful of how many Popovers are included in a single overlay. Avoid too many Popovers, as too many interactive layers of hidden information can lead to confusion.