diff options
Diffstat (limited to 'doc/development/ux_guide/components.md')
| -rw-r--r-- | doc/development/ux_guide/components.md | 8 |
1 files changed, 6 insertions, 2 deletions
diff --git a/doc/development/ux_guide/components.md b/doc/development/ux_guide/components.md index af46a4fdd2c..081d3174ba6 100644 --- a/doc/development/ux_guide/components.md +++ b/doc/development/ux_guide/components.md @@ -56,17 +56,21 @@ A popover should be used: * When it isn’t critical for the user to act upon the information * When you want to give a user a summary of extended information and the option to switch context if they want to dive in deeper. - - ### Styling A popover can contain a header section with a different background color if that improves readability and separation of content within. + + +This example shows two sections, where each section includes an actionable element. The first section shows a summary of the content shown when clicking the "read more" link. With this information the user can decide to dive deeper or start their GitLab Enterprise Edition trial immediately. + ### Placement By default, tooltips should be placed below the referring element. However, if there isn’t enough space in the viewport or it blocks related content, the tooltip should be moved to the side or above as needed.  +In this example we let the user know more about the setting they are deciding over, without loosing context. If they want to know even more they can do so, but with the expectation of opening that content in a new view. + --- ## Anchor links |