#29812 Introduce $card-cap-padding-y and $card-cap-padding-x

twbs · Dec 13, 2019 · a8cb6a5 · a8cb6a5
1 parent 06284fc
commit a8cb6a5
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 10 deletions.
diff --git a/scss/_card.scss b/scss/_card.scss
@@ -44,11 +44,11 @@
 }
 
 .card-title {
-  margin-bottom: $card-spacer-y / 2;
+  margin-bottom: $card-cap-padding-y;
 }
 
 .card-subtitle {
-  margin-top: -$card-spacer-y / 2;
+  margin-top: -$card-cap-padding-y / 2;
   margin-bottom: 0;
 }
 
@@ -71,7 +71,7 @@
 //
 
 .card-header {
-  padding: $card-spacer-y $card-spacer-x;
+  padding: $card-cap-padding-y $card-cap-padding-x;
   margin-bottom: 0; // Removes the default margin-bottom of <hN>
   color: $card-cap-color;
   background-color: $card-cap-bg;
@@ -89,7 +89,7 @@
 }
 
 .card-footer {
-  padding: $card-spacer-y $card-spacer-x;
+  padding: $card-cap-padding-y $card-cap-padding-x;
   background-color: $card-cap-bg;
   border-top: $card-border-width solid $card-border-color;
 
@@ -104,9 +104,9 @@
 //
 
 .card-header-tabs {
-  margin-right: -$card-spacer-x / 2;
-  margin-bottom: -$card-spacer-y;
-  margin-left: -$card-spacer-x / 2;
+  margin-right: -$card-cap-padding-x / 2;
+  margin-bottom: -$card-cap-padding-y;
+  margin-left: -$card-cap-padding-x / 2;
   border-bottom: 0;
 
   @if $nav-tabs-link-active-bg != $card-bg {
@@ -118,8 +118,8 @@
 }
 
 .card-header-pills {
-  margin-right: -$card-spacer-x / 2;
-  margin-left: -$card-spacer-x / 2;
+  margin-right: -$card-cap-padding-x / 2;
+  margin-left: -$card-cap-padding-x / 2;
 }
 
 // Card image

diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -936,12 +936,14 @@ $pagination-disabled-border-color:  $gray-300 !default;
 
 // Cards
 
-$card-spacer-y:                     .75rem !default;
+$card-spacer-y:                     1.25rem !default;
 $card-spacer-x:                     1.25rem !default;
 $card-border-width:                 $border-width !default;
 $card-border-radius:                $border-radius !default;
 $card-border-color:                 rgba($black, .125) !default;
 $card-inner-border-radius:          subtract($card-border-radius, $card-border-width) !default;
+$card-cap-padding-y:                .75rem !default;
+$card-cap-padding-x:                1.25rem !default;
 $card-cap-bg:                       rgba($black, .03) !default;
 $card-cap-color:                    null !default;
 $card-height:                       null !default;