Update the vue_shared help popover component to be Pajamas compliant

Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.

• Close this issue

The following discussion from !66165 (merged) should be addressed:

• @mrincon started a discussion: (+2 comments)

  Suggestion: Could this component help make the code simpler? app/assets/javascripts/vue_shared/components/help_popover.vue

Description

Update the shared help popover to be pajamas compliant.

Background

There is a shared help popover component located at https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/assets/javascripts/vue_shared/components/help_popover.vue

This help popover differs from the Pajamas help-popover in a few ways.

It uses the question icon, rather than the question-o icon as directed. It also should be blue rather than black.

Instructions: (from https://design.gitlab.com/usability/helping-users)

Usages

This component is currently used in Reports (in the summary row of the table), and Subscriptions (in the table row).

It will be used in Incidents in the escalation status dropdown, once it is Pajamas compliant.

Solution

1. Update vue_shared/components/help_popover.vue to be Pajamas compliant.
2. Update the Incident escalation status dropdown to use the updated component.
3. Verify that the updated design doesn't look out of place for existing usages.

Current	Desired