New popout paradigm

Problem (the need)

Trigger users to upgrade / activate GitLab Enterprise Edition.

Solution and rationale (the what and why)

• Why:

• We want to prevent taking up too much space on the page/area.
• We want users to see the marketing message only when they are interested in. It means users approach to the feature actively.

• Solution:

• It works like the dropdown in the sidebar when clicking Edit.
• It is used for marketing GitLab EE features currently. (It might apply to other goals in the future)
• It has a CTA button in the popout.

Example(s)

A	B
From https://gitlab.com/gitlab-org/gitlab-ee/issues/2977	From https://gitlab.com/gitlab-org/gitlab-ee/issues/2946

Usage (the when and how)

• When:

• Marketing GitLab EE features.
• An explanatory message with a CTA button.

• How:

• Click the text (like Edit or description template). Then, the popout will show on the screen.
• Click x, and then the popout will disappear.

Dos and don'ts (expanding on the how)

• Don't use mousing over to trigger it.

Related patterns

It works the similar way with rich tooltip(https://gitlab.com/gitlab-org/gitlab-ce/issues/30495)

---

cc @cperessini @dimitrieh @pedroms @sarrahvesselov @sarahod @tauriedavis