Add Pajamas-complient badge for runners

Changelog: changed

app/views/groups/runners/_runner.html.haml

@@ -3,17 +3,13 @@
     .table-mobile-header{ role: 'rowheader' }= _('Type')
     .table-mobile-content
       - if runner.group_type?
-        %span.badge.badge-pill.gl-badge.sm.badge-success
-          = s_('Runners|group')
+        = gl_badge_tag s_('Runners|group'), variant: :success, size: :sm
       - else
-        %span.badge.badge-pill.gl-badge.sm.badge-info
-          = s_('Runners|specific')
+        = gl_badge_tag s_('Runners|specific'), variant: :info, size: :sm
       - if runner.locked?
-        %span.badge.badge-pill.gl-badge.sm.badge-warning
-          = s_('Runners|locked')
+        = gl_badge_tag s_('Runners|locked'), variant: :warning, size: :sm
       - unless runner.active?
-        %span.badge.badge-pill.gl-badge.sm.badge-danger
-          = s_('Runners|paused')
+        = gl_badge_tag s_('Runners|paused'), variant: :danger, size: :sm
 
   .table-section.section-30
     .table-mobile-header{ role: 'rowheader' }= s_('Runners|Runner')
@@ -50,8 +46,7 @@
     .table-mobile-header{ role: 'rowheader' }= _('Tags')
     .table-mobile-content
       - runner.tags.map(&:name).sort.each do |tag|
-        %span.badge.badge-primary.str-truncated.has-tooltip{ title: tag }
-          = tag
+        = gl_badge_tag tag, { variant: :info }, { class: 'str-truncated has-tooltip', title: tag }
 
   .table-section.section-10
     .table-mobile-header{ role: 'rowheader' }= _('Last contact')