diff options
Diffstat (limited to 'assets/stylesheets/bootstrap/_card.scss')
| -rw-r--r-- | assets/stylesheets/bootstrap/_card.scss | 82 |
1 files changed, 18 insertions, 64 deletions
diff --git a/assets/stylesheets/bootstrap/_card.scss b/assets/stylesheets/bootstrap/_card.scss index 7c35f7e..697fe51 100644 --- a/assets/stylesheets/bootstrap/_card.scss +++ b/assets/stylesheets/bootstrap/_card.scss @@ -46,19 +46,16 @@ // Enable `flex-grow: 1` for decks and groups so that card blocks take up // as much space as possible, ensuring footers are aligned to the bottom. flex: 1 1 auto; - // 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; } @@ -67,7 +64,7 @@ } .card-link { - @include hover() { + &:hover { text-decoration: none; } @@ -81,7 +78,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; @@ -93,7 +90,7 @@ } .card-footer { - padding: $card-spacer-y $card-spacer-x; + padding: $card-cap-padding-y $card-cap-padding-x; color: $card-cap-color; background-color: $card-cap-bg; border-top: $card-border-width solid $card-border-color; @@ -109,15 +106,22 @@ // .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 { + .nav-link.active { + background-color: $card-bg; + border-bottom-color: $card-bg; + } + } } .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 @@ -134,7 +138,6 @@ .card-img, .card-img-top, .card-img-bottom { - flex-shrink: 0; // For IE: https://github.com/twbs/bootstrap/issues/29396 width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch } @@ -149,30 +152,6 @@ } -// Card deck - -.card-deck { - .card { - margin-bottom: $card-deck-margin; - } - - @include media-breakpoint-up(sm) { - display: flex; - flex-flow: row wrap; - margin-right: -$card-deck-margin; - margin-left: -$card-deck-margin; - - .card { - // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4 - flex: 1 0 0%; - margin-right: $card-deck-margin; - margin-bottom: 0; // Override the default - margin-left: $card-deck-margin; - } - } -} - - // // Card groups // @@ -237,35 +216,10 @@ // -// Columns -// - -.card-columns { - .card { - margin-bottom: $card-columns-margin; - } - - @include media-breakpoint-up(sm) { - column-count: $card-columns-count; - column-gap: $card-columns-gap; - orphans: 1; - widows: 1; - - .card { - display: inline-block; // Don't let them vertically span multiple columns - width: 100%; // Don't let their width change - } - } -} - - -// // Accordion // .accordion { - overflow-anchor: none; - > .card { overflow: hidden; |