Add badge-pill to .badge in haml

app/helpers/issuables_helper.rb

@@ -168,7 +168,7 @@ module IssuablesHelper
     count = issuables_count_for_state(issuable_type, state)
     html = content_tag(:span, state_title)
-    html << " " << content_tag(:span, number_with_delimiter(count), class: 'badge')
+    html << " " << content_tag(:span, number_with_delimiter(count), class: 'badge badge-pill')
     html.html_safe
   end

app/views/admin/groups/_group.html.haml

@@ -5,7 +5,7 @@
     = link_to 'Edit', admin_group_edit_path(group), id: "edit_#{dom_id(group)}", class: 'btn'
     = link_to 'Delete', [:admin, group], data: { confirm: "Are you sure you want to remove #{group.name}?" }, method: :delete, class: 'btn btn-remove'
   .stats
-    %span.badge
+    %span.badge.badge-pill
       = storage_counter(group.storage_size)
     %span

app/views/admin/groups/show.html.haml

@@ -62,14 +62,14 @@
       .panel-heading
         %h3.panel-title
           Projects
-          %span.badge
+          %span.badge.badge-pill
             #{@group.projects.count}
       %ul.well-list
         - @projects.each do |project|
           %li
             %strong
               = link_to project.full_name, [:admin, project.namespace.becomes(Namespace), project]
-              %span.badge
+              %span.badge.badge-pill
                 = storage_counter(project.statistics.storage_size)
             %span.pull-right.light
               %span.monospace= project.full_path + '.git'
@@ -80,14 +80,14 @@
       .panel.panel-default
         .panel-heading
           Projects shared with #{@group.name}
-          %span.badge
+          %span.badge.badge-pill
             #{@group.shared_projects.count}
         %ul.well-list
           - @group.shared_projects.sort_by(&:name).each do |project|
             %li
               %strong
                 = link_to project.full_name, [:admin, project.namespace.becomes(Namespace), project]
-                %span.badge
+                %span.badge.badge-pill
                   = storage_counter(project.statistics.storage_size)
               %span.pull-right.light
                 %span.monospace= project.full_path + '.git'
@@ -115,7 +115,7 @@
       .panel-heading
         %strong= @group.name
         group members
-        %span.badge= @group.members.size
+        %span.badge.badge-pill= @group.members.size
         .pull-right
           = link_to icon('pencil-square-o', text: 'Manage access'), polymorphic_url([@group, :members]), class: "btn btn-xs"
       %ul.well-list.group-users-list.content-list.members-list

app/views/admin/projects/_projects.html.haml

@@ -12,7 +12,7 @@
               = s_('AdminProjects|Delete')
           .stats
-            %span.badge
+            %span.badge.badge-pill
               = storage_counter(project.statistics.storage_size)
             - if project.archived
               %span.label.label-warning archived

app/views/admin/projects/show.html.haml

@@ -162,7 +162,7 @@
         .panel-heading
           %strong= @group.name
           group members
-          %span.badge= @group_members.size
+          %span.badge.badge-pill= @group_members.size
           .pull-right
             = link_to admin_group_path(@group), class: 'btn btn-xs' do
               = icon('pencil-square-o', text: 'Manage access')
@@ -177,7 +177,7 @@
       .panel-heading
         %strong= @project.name
         project members
-        %span.badge= @project.users.size
+        %span.badge.badge-pill= @project.users.size
         .pull-right
           = link_to icon('pencil-square-o', text: 'Manage access'), polymorphic_url([@project, :members]), class: "btn btn-xs"
       %ul.well-list.project_members.content-list.members-list

app/views/admin/users/index.html.haml

@@ -42,31 +42,31 @@
         = nav_link(html_options: { class: active_when(params[:filter].nil?) }) do
           = link_to admin_users_path do
             Active
-            %small.badge= number_with_delimiter(User.active.count)
+            %small.badge.badge-pill= number_with_delimiter(User.active.count)
         = nav_link(html_options: { class: active_when(params[:filter] == 'admins') }) do
           = link_to admin_users_path(filter: "admins") do
             Admins
-            %small.badge= number_with_delimiter(User.admins.count)
+            %small.badge.badge-pill= number_with_delimiter(User.admins.count)
         = nav_link(html_options: { class: "#{active_when(params[:filter] == 'two_factor_enabled')} filter-two-factor-enabled" }) do
           = link_to admin_users_path(filter: 'two_factor_enabled') do
             2FA Enabled
-            %small.badge= number_with_delimiter(User.with_two_factor.count)
+            %small.badge.badge-pill= number_with_delimiter(User.with_two_factor.count)
         = nav_link(html_options: { class: "#{active_when(params[:filter] == 'two_factor_disabled')} filter-two-factor-disabled" }) do
           = link_to admin_users_path(filter: 'two_factor_disabled') do
             2FA Disabled
-            %small.badge= number_with_delimiter(User.without_two_factor.count)
+            %small.badge.badge-pill= number_with_delimiter(User.without_two_factor.count)
         = nav_link(html_options: { class: active_when(params[:filter] == 'external') }) do
           = link_to admin_users_path(filter: 'external') do
             External
-            %small.badge= number_with_delimiter(User.external.count)
+            %small.badge.badge-pill= number_with_delimiter(User.external.count)
         = nav_link(html_options: { class: active_when(params[:filter] == 'blocked') }) do
           = link_to admin_users_path(filter: "blocked") do
             Blocked
-            %small.badge= number_with_delimiter(User.blocked.count)
+            %small.badge.badge-pill= number_with_delimiter(User.blocked.count)
         = nav_link(html_options: { class: active_when(params[:filter] == 'wop') }) do
           = link_to admin_users_path(filter: "wop") do
             Without projects
-            %small.badge= number_with_delimiter(User.without_projects.count)
+            %small.badge.badge-pill= number_with_delimiter(User.without_projects.count)
   %ul.flex-list.content-list
     - if @users.empty?

app/views/dashboard/todos/index.html.haml

@@ -9,13 +9,13 @@
         = link_to todos_filter_path(state: 'pending') do
           %span
             Todos
-          %span.badge
+          %span.badge.badge-pill
             = number_with_delimiter(todos_pending_count)
       %li.todos-done{ class: active_when(params[:state] == 'done') }>
         = link_to todos_filter_path(state: 'done') do
           %span
             Done
-          %span.badge
+          %span.badge.badge-pill
             = number_with_delimiter(todos_done_count)
     .nav-controls

app/views/discussions/_notes.html.haml

@@ -11,7 +11,7 @@
     - if discussion.try(:on_image?) && show_toggle
       %button.diff-notes-collapse.js-diff-notes-toggle{ type: 'button' }
         = sprite_icon('collapse', css_class: 'collapse-icon')
-      %button.btn-transparent.badge.js-diff-notes-toggle{ type: 'button' }
+      %button.btn-transparent.badge.badge-pill.js-diff-notes-toggle{ type: 'button' }
         = badge_counter
     = render partial: "shared/notes/note", collection: discussion.notes, as: :note, locals: { badge_counter: badge_counter, show_image_comment_badge: show_image_comment_badge }

app/views/groups/group_members/index.html.haml

@@ -26,7 +26,7 @@
     .panel-heading
       Members with access to
       %strong= @group.name
-      %span.badge= @members.total_count
+      %span.badge.badge-pill= @members.total_count
     %ul.content-list.members-list
       = render partial: 'shared/members/member', collection: @members, as: :member
     = paginate @members, theme: 'gitlab'

app/views/groups/projects.html.haml

@@ -18,7 +18,7 @@
         .pull-right
           - if project.archived
             %span.label.label-warning archived
-          %span.badge
+          %span.badge.badge-pill
             = storage_counter(project.statistics.storage_size)
           = link_to 'Members', project_project_members_path(project), id: "edit_#{dom_id(project)}", class: "btn btn-sm"
           = link_to 'Edit', edit_project_path(project), id: "edit_#{dom_id(project)}", class: "btn btn-sm"

app/views/layouts/header/_default.html.haml

@@ -32,20 +32,20 @@
               = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues', aria: { label: "Issues" }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
                 = sprite_icon('issues', size: 16)
                 - issues_count = assigned_issuables_count(:issues)
-                %span.badge.issues-count{ class: ('hidden' if issues_count.zero?) }
+                %span.badge.badge-pill.issues-count{ class: ('hidden' if issues_count.zero?) }
                   = number_with_delimiter(issues_count)
           - if header_link?(:merge_requests)
             = nav_link(path: 'dashboard#merge_requests', html_options: { class: "user-counter" }) do
               = link_to assigned_mrs_dashboard_path, title: 'Merge requests', class: 'dashboard-shortcuts-merge_requests', aria: { label: "Merge requests" }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
                 = sprite_icon('git-merge', size: 16)
                 - merge_requests_count = assigned_issuables_count(:merge_requests)
-                %span.badge.merge-requests-count{ class: ('hidden' if merge_requests_count.zero?) }
+                %span.badge.badge-pill.merge-requests-count{ class: ('hidden' if merge_requests_count.zero?) }
                   = number_with_delimiter(merge_requests_count)
           - if header_link?(:todos)
             = nav_link(controller: 'dashboard/todos', html_options: { class: "user-counter" }) do
               = link_to dashboard_todos_path, title: 'Todos', aria: { label: "Todos" }, class: 'shortcuts-todos', data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
                 = sprite_icon('todo-done', size: 16)
-                %span.badge.todos-count{ class: ('hidden' if todos_pending_count.zero?) }
+                %span.badge.badge-pill.todos-count{ class: ('hidden' if todos_pending_count.zero?) }
                   = todos_count_format(todos_pending_count)
           - if header_link?(:user_dropdown)
             %li.header-user.dropdown

app/views/layouts/nav/sidebar/_admin.html.haml

@@ -127,13 +127,13 @@
             = sprite_icon('slight-frown')
           %span.nav-item-name
             Abuse Reports
-          %span.badge.count= number_with_delimiter(AbuseReport.count(:all))
+          %span.badge.badge-pill.count= number_with_delimiter(AbuseReport.count(:all))
         %ul.sidebar-sub-level-items.is-fly-out-only
           = nav_link(controller: :abuse_reports, html_options: { class: "fly-out-top-item" } ) do
             = link_to admin_abuse_reports_path do
               %strong.fly-out-top-item-name
                 #{ _('Abuse Reports') }
-              %span.badge.count.merge_counter.js-merge-counter.fly-out-badge= number_with_delimiter(AbuseReport.count(:all))
+              %span.badge.badge-pill.count.merge_counter.js-merge-counter.fly-out-badge= number_with_delimiter(AbuseReport.count(:all))
       - if akismet_enabled?
         = nav_link(controller: :spam_logs) do

app/views/layouts/nav/sidebar/_group.html.haml

@@ -43,14 +43,14 @@
               = sprite_icon('issues')
             %span.nav-item-name
               Issues
-            %span.badge.count= number_with_delimiter(issues_count)
+            %span.badge.badge-pill.count= number_with_delimiter(issues_count)
           %ul.sidebar-sub-level-items
             = nav_link(path: ['groups#issues', 'labels#index', 'milestones#index'], html_options: { class: "fly-out-top-item" } ) do
               = link_to issues_group_path(@group) do
                 %strong.fly-out-top-item-name
                   #{ _('Issues') }
-                %span.badge.count.issue_counter.fly-out-badge= number_with_delimiter(issues_count)
+                %span.badge.badge-pill.count.issue_counter.fly-out-badge= number_with_delimiter(issues_count)
             %li.divider.fly-out-top-item
             = nav_link(path: 'groups#issues', html_options: { class: 'home' }) do
@@ -83,13 +83,13 @@
               = sprite_icon('git-merge')
             %span.nav-item-name
               Merge Requests
-            %span.badge.count= number_with_delimiter(merge_requests_count)
+            %span.badge.badge-pill.count= number_with_delimiter(merge_requests_count)
           %ul.sidebar-sub-level-items.is-fly-out-only
             = nav_link(path: 'groups#merge_requests', html_options: { class: "fly-out-top-item" } ) do
               = link_to merge_requests_group_path(@group) do
                 %strong.fly-out-top-item-name
                   #{ _('Merge Requests') }
-                %span.badge.count.merge_counter.js-merge-counter.fly-out-badge= number_with_delimiter(merge_requests_count)
+                %span.badge.badge-pill.count.merge_counter.js-merge-counter.fly-out-badge= number_with_delimiter(merge_requests_count)
       - if group_sidebar_link?(:group_members)
         = nav_link(path: 'group_members#index') do

app/views/layouts/nav/sidebar/_project.html.haml

@@ -88,7 +88,7 @@
             %span.nav-item-name
               Issues
             - if @project.issues_enabled?
-              %span.badge.count.issue_counter
+              %span.badge.badge-pill.count.issue_counter
                 = number_with_delimiter(@project.open_issues_count)
           %ul.sidebar-sub-level-items
@@ -97,7 +97,7 @@
                 %strong.fly-out-top-item-name
                   #{ _('Issues') }
                 - if @project.issues_enabled?
-                  %span.badge.count.issue_counter.fly-out-badge
+                  %span.badge.badge-pill.count.issue_counter.fly-out-badge
                     = number_with_delimiter(@project.open_issues_count)
             %li.divider.fly-out-top-item
             = nav_link(controller: :issues, action: :index) do
@@ -140,14 +140,14 @@
               = sprite_icon('git-merge')
             %span.nav-item-name
               Merge Requests
-            %span.badge.count.merge_counter.js-merge-counter
+            %span.badge.badge-pill.count.merge_counter.js-merge-counter
               = number_with_delimiter(@project.open_merge_requests_count)
           %ul.sidebar-sub-level-items.is-fly-out-only
             = nav_link(controller: :merge_requests, html_options: { class: "fly-out-top-item" } ) do
               = link_to project_merge_requests_path(@project) do
                 %strong.fly-out-top-item-name
                   #{ _('Merge Requests') }
-                %span.badge.count.merge_counter.js-merge-counter.fly-out-badge
+                %span.badge.badge-pill.count.merge_counter.js-merge-counter.fly-out-badge
                   = number_with_delimiter(@project.open_merge_requests_count)
       - if project_nav_tab? :pipelines

app/views/projects/_home_panel.html.haml

@@ -24,7 +24,7 @@
             = deleted_message % { project_name: fork_source_name(@project) }
     .project-badges
-      - @project.badges.each do |badge|
+      - @project.badge.badge-pills.each do |badge|
         - badge_link_url = badge.rendered_link_url(@project)
         %a{ href: badge_link_url, target: '_blank', rel: 'noopener noreferrer' }
           %img{ src: badge.rendered_image_url(@project), alt: badge_link_url }

app/views/projects/commit/_ci_menu.html.haml

@@ -2,9 +2,9 @@
   = nav_link(path: 'commit#show') do
     = link_to project_commit_path(@project, @commit.id) do
       Changes
-      %span.badge= @diffs.size
+      %span.badge.badge-pill= @diffs.size
   - if can?(current_user, :read_pipeline, @project)
     = nav_link(path: 'commit#pipelines') do
       = link_to pipelines_project_commit_path(@project, @commit.id) do
         Pipelines
-        %span.badge.js-pipelines-mr-count= @commit.pipelines.size
+        %span.badge.badge-pill.js-pipelines-mr-count= @commit.pipelines.size

app/views/projects/merge_requests/creations/_new_submit.html.haml

@@ -28,16 +28,16 @@
       %li.commits-tab.active
         = link_to url_for(params), data: {target: 'div#commits', action: 'new', toggle: 'tab'} do
           Commits
-          %span.badge= @commits.size
+          %span.badge.badge-pill= @commits.size
       - if @pipelines.any?
         %li.builds-tab
           = link_to url_for(params.merge(action: 'pipelines')), data: {target: 'div#pipelines', action: 'pipelines', toggle: 'tab'} do
             Pipelines
-            %span.badge= @pipelines.size
+            %span.badge.badge-pill= @pipelines.size
       %li.diffs-tab
         = link_to url_for(params.merge(action: 'diffs')), data: {target: 'div#diffs', action: 'diffs', toggle: 'tab'} do
           Changes
-          %span.badge= @merge_request.diff_size
+          %span.badge.badge-pill= @merge_request.diff_size
     .tab-content
       #commits.commits.tab-pane.active

app/views/projects/merge_requests/show.html.haml

@@ -35,21 +35,21 @@
               %li.notes-tab
                 = tab_link_for @merge_request, :show, force_link: @commit.present? do
                   Discussion
-                  %span.badge= @merge_request.related_notes.user.count
+                  %span.badge.badge-pill= @merge_request.related_notes.user.count
               - if @merge_request.source_project
                 %li.commits-tab
                   = tab_link_for @merge_request, :commits do
                     Commits
-                    %span.badge= @commits_count
+                    %span.badge.badge-pill= @commits_count
               - if @pipelines.any?
                 %li.pipelines-tab
                   = tab_link_for @merge_request, :pipelines do
                     Pipelines
-                    %span.badge.js-pipelines-mr-count= @pipelines.size
+                    %span.badge.badge-pill.js-pipelines-mr-count= @pipelines.size
               %li.diffs-tab
                 = tab_link_for @merge_request, :diffs do
                   Changes
-                  %span.badge= @merge_request.diff_size
+                  %span.badge.badge-pill= @merge_request.diff_size
         - if has_vue_discussions_cookie?
           #js-vue-discussion-counter

app/views/projects/pipeline_schedules/_tabs.html.haml

@@ -2,17 +2,17 @@
   %li{ class: active_when(scope.nil?) }>
     = link_to schedule_path_proc.call(nil) do
       = s_("PipelineSchedules|All")
-      %span.badge.js-totalbuilds-count
+      %span.badge.badge-pill.js-totalbuilds-count
         = number_with_delimiter(all_schedules.count(:id))
   %li{ class: active_when(scope == 'active') }>
     = link_to schedule_path_proc.call('active') do
       = s_("PipelineSchedules|Active")
-      %span.badge
+      %span.badge.badge-pill
         = number_with_delimiter(all_schedules.active.count(:id))
   %li{ class: active_when(scope == 'inactive') }>
     = link_to schedule_path_proc.call('inactive') do
       = s_("PipelineSchedules|Inactive")
-      %span.badge
+      %span.badge.badge-pill
         = number_with_delimiter(all_schedules.inactive.count(:id))

app/views/projects/pipelines/_with_tabs.html.haml

@@ -8,12 +8,12 @@
     %li.js-builds-tab-link
       = link_to builds_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-builds', action: 'builds', toggle: 'tab' }, class: 'builds-tab' do
         = _("Jobs")
-        %span.badge.js-builds-counter= pipeline.total_size
+        %span.badge.badge-pill.js-builds-counter= pipeline.total_size
     - if failed_builds.present?
       %li.js-failures-tab-link
         = link_to failures_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-failures', action: 'failures', toggle: 'tab' }, class: 'failures-tab' do
           = _("Failed Jobs")
-          %span.badge.js-failures-counter= failed_builds.count
+          %span.badge.badge-pill.js-failures-counter= failed_builds.count
 .tab-content
   #js-tab-pipeline.tab-pane