Remove .card-title from .card-header for BS4 migration

Replaces .card-header > hX.card-title with hX.card-header to remove
.card-title. At a occurrence where bold styling is not necessary,
div.card-header is used instead.
By full removal of .card-title at the moment, all workarounds for
BS4's card-title are removed as well.

More information: https://getbootstrap.com/docs/4.0/migration/#panels

Signed-off-by: Takuya Noguchi <takninnovationresearch@gmail.com>

14 files changed, 39 insertions, 66 deletions

diff --git a/app/assets/stylesheets/bootstrap_migration.scss b/app/assets/stylesheets/bootstrap_migration.scss
index af73954bd2e..1e00aa4ff7e 100644
--- a/app/assets/stylesheets/bootstrap_migration.scss
+++ b/app/assets/stylesheets/bootstrap_migration.scss
@@ -238,10 +238,6 @@ h3.popover-header {
 }
 
 .card {
-  .card-title {
-    margin-bottom: 0;
-  }
-
   &.card-without-border {
     @extend .border-0;
   }
@@ -255,13 +251,6 @@ h3.popover-header {
   }
 }
 
-.card-header {
-  h3.card-title,
-  h4.card-title {
-    margin-top: 0;
-  }
-}
-
 .nav-tabs {
   // Override bootstrap's default border
   border-bottom: 0;
diff --git a/app/assets/stylesheets/framework/panels.scss b/app/assets/stylesheets/framework/panels.scss
index 5ca4d944d73..3a117106cff 100644
--- a/app/assets/stylesheets/framework/panels.scss
+++ b/app/assets/stylesheets/framework/panels.scss
@@ -53,8 +53,3 @@
     margin-top: $gl-padding;
   }
 }
-
-.card-title {
-  font-size: inherit;
-  line-height: inherit;
-}
diff --git a/app/assets/stylesheets/framework/terms.scss b/app/assets/stylesheets/framework/terms.scss
index 7cda674e5c8..3f4be8829d7 100644
--- a/app/assets/stylesheets/framework/terms.scss
+++ b/app/assets/stylesheets/framework/terms.scss
@@ -19,17 +19,12 @@
       justify-content: space-between;
       line-height: $line-height-base;
 
-      .card-title {
+      .logo-text {
+        width: 55px;
+        height: 24px;
         display: flex;
-        align-items: center;
-
-        .logo-text {
-          width: 55px;
-          height: 24px;
-          display: flex;
-          flex-direction: column;
-          justify-content: center;
-        }
+        flex-direction: column;
+        justify-content: center;
       }
 
       .navbar-collapse {
diff --git a/app/views/admin/groups/show.html.haml b/app/views/admin/groups/show.html.haml
index 21c1260e982..5f205d1bcbc 100644
--- a/app/views/admin/groups/show.html.haml
+++ b/app/views/admin/groups/show.html.haml
@@ -63,10 +63,9 @@
 
     .card
       .card-header
-        %h3.card-title
-          = _('Projects')
-          %span.badge.badge-pill
-            #{@group.projects.count}
+        = _('Projects')
+        %span.badge.badge-pill
+          #{@group.projects.count}
       %ul.content-list
         - @projects.each do |project|
           %li
diff --git a/app/views/layouts/terms.html.haml b/app/views/layouts/terms.html.haml
index 977eb350365..cdad617f006 100644
--- a/app/views/layouts/terms.html.haml
+++ b/app/views/layouts/terms.html.haml
@@ -16,19 +16,18 @@
           .content{ id: "content-body" }
             .card
               .card-header
-                .card-title
-                  = brand_header_logo
-                  - logo_text = brand_header_logo_type
-                  - if logo_text.present?
-                    %span.logo-text.prepend-left-8
-                      = logo_text
-                - if header_link?(:user_dropdown)
-                  .navbar-collapse
-                    %ul.nav.navbar-nav
-                      %li.header-user.dropdown
-                        = link_to current_user, class: user_dropdown_class, data: { toggle: "dropdown" } do
-                          = image_tag avatar_icon_for_user(current_user, 23), width: 23, height: 23, class: "header-user-avatar qa-user-avatar"
-                          = sprite_icon('angle-down', css_class: 'caret-down')
-                        .dropdown-menu.dropdown-menu-right
-                          = render 'layouts/header/current_user_dropdown'
+                = brand_header_logo
+                - logo_text = brand_header_logo_type
+                - if logo_text.present?
+                  %span.logo-text.prepend-left-8
+                    = logo_text
+              - if header_link?(:user_dropdown)
+                .navbar-collapse
+                  %ul.nav.navbar-nav
+                    %li.header-user.dropdown
+                      = link_to current_user, class: user_dropdown_class, data: { toggle: "dropdown" } do
+                        = image_tag avatar_icon_for_user(current_user, 23), width: 23, height: 23, class: "header-user-avatar qa-user-avatar"
+                        = sprite_icon('angle-down', css_class: 'caret-down')
+                      .dropdown-menu.dropdown-menu-right
+                        = render 'layouts/header/current_user_dropdown'
               = yield
diff --git a/app/views/projects/branches/_panel.html.haml b/app/views/projects/branches/_panel.html.haml
index 398f76d379a..0e4b119bb54 100644
--- a/app/views/projects/branches/_panel.html.haml
+++ b/app/views/projects/branches/_panel.html.haml
@@ -9,8 +9,7 @@
 
 .card.prepend-top-10
   .card-header
-    %h4.card-title
-      = panel_title
+    = panel_title
   %ul.content-list.all-branches
     - branches.first(overview_max_branches).each do |branch|
       = render "projects/branches/branch", branch: branch, merged: project.repository.merged_to_root_ref?(branch)
diff --git a/app/views/projects/protected_branches/shared/_branches_list.html.haml b/app/views/projects/protected_branches/shared/_branches_list.html.haml
index 9a06eca89bb..1913d06a6f8 100644
--- a/app/views/projects/protected_branches/shared/_branches_list.html.haml
+++ b/app/views/projects/protected_branches/shared/_branches_list.html.haml
@@ -1,8 +1,7 @@
 .protected-branches-list.js-protected-branches-list.qa-protected-branches-list
   - if @protected_branches.empty?
     .card-header.bg-white
-      %h3.card-title.mb-0
-        Protected branch (#{@protected_branches_count})
+      Protected branch (#{@protected_branches_count})
     %p.settings-message.text-center
       There are currently no protected branches, protect a branch with the form above.
   - else
diff --git a/app/views/projects/protected_branches/shared/_create_protected_branch.html.haml b/app/views/projects/protected_branches/shared/_create_protected_branch.html.haml
index c3b8f2f8964..d617d85afc2 100644
--- a/app/views/projects/protected_branches/shared/_create_protected_branch.html.haml
+++ b/app/views/projects/protected_branches/shared/_create_protected_branch.html.haml
@@ -2,8 +2,7 @@
   %input{ type: 'hidden', name: 'update_section', value: 'js-protected-branches-settings' }
   .card
     .card-header
-      %h3.card-title
-        Protect a branch
+      Protect a branch
     .card-body
       = form_errors(@protected_branch)
       .form-group.row
diff --git a/app/views/projects/protected_tags/shared/_create_protected_tag.html.haml b/app/views/projects/protected_tags/shared/_create_protected_tag.html.haml
index b274c73d035..cbf1938664c 100644
--- a/app/views/projects/protected_tags/shared/_create_protected_tag.html.haml
+++ b/app/views/projects/protected_tags/shared/_create_protected_tag.html.haml
@@ -2,8 +2,7 @@
   %input{ type: 'hidden', name: 'update_section', value: 'js-protected-tags-settings' }
   .card
     .card-header
-      %h3.card-title
-        Protect a tag
+      Protect a tag
     .card-body
       = form_errors(@protected_tag)
       .form-group.row
diff --git a/app/views/projects/protected_tags/shared/_tags_list.html.haml b/app/views/projects/protected_tags/shared/_tags_list.html.haml
index c3081d75fb4..382ea848243 100644
--- a/app/views/projects/protected_tags/shared/_tags_list.html.haml
+++ b/app/views/projects/protected_tags/shared/_tags_list.html.haml
@@ -1,8 +1,7 @@
 .protected-tags-list.js-protected-tags-list
   - if @protected_tags.empty?
     .card-header
-      %h3.card-title
-        Protected tag (#{@protected_tags_count})
+      Protected tag (#{@protected_tags_count})
     %p.settings-message.text-center
       There are currently no protected tags, protect a tag with the form above.
   - else
diff --git a/app/views/projects/registry/repositories/index.html.haml b/app/views/projects/registry/repositories/index.html.haml
index 0426f2215ad..db1f15f96b8 100644
--- a/app/views/projects/registry/repositories/index.html.haml
+++ b/app/views/projects/registry/repositories/index.html.haml
@@ -18,8 +18,7 @@
     .col-lg-12
       .card
         .card-header
-          %h4.card-title
-            = s_('ContainerRegistry|How to use the Container Registry')
+          = s_('ContainerRegistry|How to use the Container Registry')
         .card-body
           %p
             - link_token = link_to(_('personal access token'), help_page_path('user/profile/account/two_factor_authentication', anchor: 'personal-access-tokens'), target: '_blank')
diff --git a/app/views/projects/services/prometheus/_metrics.html.haml b/app/views/projects/services/prometheus/_metrics.html.haml
index 98d64fafe86..597c029f755 100644
--- a/app/views/projects/services/prometheus/_metrics.html.haml
+++ b/app/views/projects/services/prometheus/_metrics.html.haml
@@ -2,9 +2,8 @@
 
 .card.js-panel-monitored-metrics{ data: { active_metrics: active_common_project_prometheus_metrics_path(project, :json), metrics_help_path: help_page_path('user/project/integrations/prometheus_library/metrics') } }
   .card-header
-    %h3.card-title
-      = s_('PrometheusService|Common metrics')
-      %span.badge.badge-pill.js-monitored-count 0
+    = s_('PrometheusService|Common metrics')
+    %span.badge.badge-pill.js-monitored-count 0
   .card-body
     .loading-metrics.js-loading-metrics
       %p.prepend-top-10.prepend-left-10
@@ -17,10 +16,9 @@
 
 .card.hidden.js-panel-missing-env-vars
   .card-header
-    %h3.card-title
-      = icon('caret-right lg fw', class: 'panel-toggle js-panel-toggle', 'aria-label' => 'Toggle panel')
-      = s_('PrometheusService|Missing environment variable')
-      %span.badge.badge-pill.js-env-var-count 0
+    = icon('caret-right lg fw', class: 'panel-toggle js-panel-toggle', 'aria-label' => 'Toggle panel')
+    = s_('PrometheusService|Missing environment variable')
+    %span.badge.badge-pill.js-env-var-count 0
   .card-body.hidden
     .flash-container
       .flash-notice
diff --git a/app/views/projects/triggers/_index.html.haml b/app/views/projects/triggers/_index.html.haml
index a15bb4c4f3f..a559ce41e57 100644
--- a/app/views/projects/triggers/_index.html.haml
+++ b/app/views/projects/triggers/_index.html.haml
@@ -3,8 +3,7 @@
     = render "projects/triggers/content"
     .card
       .card-header
-        %h4.card-title
-          Manage your project's triggers
+        Manage your project's triggers
       .card-body
         = render "projects/triggers/form", btn_text: "Add trigger"
         %hr
diff --git a/changelogs/unreleased/46884-remove-card-title.yml b/changelogs/unreleased/46884-remove-card-title.yml
new file mode 100644
index 00000000000..95f08a67638
--- /dev/null
+++ b/changelogs/unreleased/46884-remove-card-title.yml
@@ -0,0 +1,5 @@
+---
+title: Remove .card-title from .card-header for BS4 migration
+merge_request: 19335
+author: Takuya Noguchi
+type: other