Skip to content

Allow using different icons for the help popover

What does this MR do and why?

Allows using different icons for the help popover. The need for the change comes from the MR widget designs, which uses a i icon instead of ? as shown in the design:

image

This MR uses the question-o as the default value, so it should have no impact on the existing usage, but adds the possibility to use a different icon when needed.

Screenshots or screen recordings

Here's how it looks like when used an information-o icon:

image

How to set up and validate locally

Apply the following patch and visit /admin/runners. Check the help popover next to the owners column.

diff --git a/app/assets/javascripts/ci/runner/components/runner_list.vue b/app/assets/javascripts/ci/runner/components/runner_list.vue
index e895537dcdc7..521ea6068890 100644
--- a/app/assets/javascripts/ci/runner/components/runner_list.vue
+++ b/app/assets/javascripts/ci/runner/components/runner_list.vue
@@ -163,7 +163,7 @@ export default {
 
       <template #head(owner)="{ label }">
         {{ label }}
-        <help-popover>
+        <help-popover icon="information-o">
           {{
             s__(
               'Runners|The project, group or instance where the runner was registered. Instance runners are always owned by Administrator.',

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #381529 (closed)

Merge request reports