aboutsummaryrefslogtreecommitdiff
path: root/scss
diff options
context:
space:
mode:
authorBrendan <[email protected]>2019-12-14 05:35:17 -0800
committerMartijn Cuppens <[email protected]>2019-12-14 14:35:17 +0100
commitdcc2ce35878432f6fd73777751ca8d2a232f34d8 (patch)
tree8c616635e8304d028dbd53aa52520a51beadc67e /scss
parent4e59997d066b26839c20bf4e54889aaadedc12e5 (diff)
downloadbootstrap-dcc2ce35878432f6fd73777751ca8d2a232f34d8.tar.xz
bootstrap-dcc2ce35878432f6fd73777751ca8d2a232f34d8.zip
Adjust card spacing variables (#29813)
Diffstat (limited to 'scss')
-rw-r--r--scss/_card.scss20
-rw-r--r--scss/_variables.scss5
2 files changed, 14 insertions, 11 deletions
diff --git a/scss/_card.scss b/scss/_card.scss
index 542220b40..510fbcea1 100644
--- a/scss/_card.scss
+++ b/scss/_card.scss
@@ -39,16 +39,16 @@
// Workaround for the image size bug in IE
// See: https://github.com/twbs/bootstrap/pull/28855
min-height: 1px;
- padding: $card-spacer-x;
+ padding: $card-spacer-y $card-spacer-x;
color: $card-color;
}
.card-title {
- margin-bottom: $card-spacer-y;
+ margin-bottom: $card-title-spacer-y;
}
.card-subtitle {
- margin-top: -$card-spacer-y / 2;
+ margin-top: -$card-title-spacer-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
index 48cdfd523..2fa04f6ce 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -936,12 +936,15 @@ $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-title-spacer-y: .75rem !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;