Updated badges to the Pajamas compliant component

app/views/projects/branches/_branch.html.haml

@@ -8,14 +8,11 @@
       = link_to project_tree_path(@project, branch.name), class: 'item-title str-truncated-100 ref-name gl-ml-3 qa-branch-name' do
         = branch.name
       - if branch.name == @repository.root_ref
-        %span.badge.gl-badge.sm.badge-pill.badge-primary.gl-ml-2 default
+        = gl_badge_tag s_('DefaultBranchLabel|default'), { variant: :info, size: :sm }, { class: 'gl-ml-2' }
       - elsif merged
-        %span.badge.gl-badge.sm.badge-pill.badge-info.has-tooltip.gl-ml-2{ title: s_('Branches|Merged into %{default_branch}') % { default_branch: @repository.root_ref } }
-          = s_('Branches|merged')
-
+        = gl_badge_tag s_('Branches|merged'), { variant: :info, size: :sm }, { class: 'gl-ml-2', title: s_('Branches|Merged into %{default_branch}') % { default_branch: @repository.root_ref }, data: { toggle: 'tooltip', container: 'body' } }
       - if protected_branch?(@project, branch)
-        %span.badge.gl-badge.sm.badge-pill.badge-success.gl-ml-2
-          = s_('Branches|protected')
+        = gl_badge_tag s_('Branches|protected'), { variant: :success, size: :sm }, { class: 'gl-ml-2' }
 
       = render_if_exists 'projects/branches/diverged_from_upstream', branch: branch