mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-12 08:34:08 +02:00
Code Issues Releases Wiki Activity

clean up card styles. add new vars

Browse Source
This commit is contained in:
Mark Otto
2015-05-29 01:59:54 -07:00
parent 719afd48ac
commit 587f5f8efd
1 changed files with 31 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
scss/_card.scss
View File

@@ -2,15 +2,19 @@
// Base styles // Base styles
// //
$card-spacer-x: 1.25rem; $card-spacer-x: 1.25rem;
$card-spacer-y: .75rem; $card-spacer-y: .75rem;
$card-border-width: .0625rem; $card-border-width: .0625rem;
$card-border-radius: .25rem; $card-border-radius: .25rem;
$card-border-color: #e5e5e5;
$card-border-radius-inner: ($card-border-radius - $card-border-width);
$card-cap-bg: #f5f5f5;
.card { .card {
position: relative; position: relative;
margin-bottom: $card-spacer-y; margin-bottom: $card-spacer-y;
border: $card-border-width solid #e5e5e5; border: $card-border-width solid $card-border-color;
@include border-radius($card-border-radius); @include border-radius($card-border-radius);
} }
@@ -73,19 +77,21 @@ $card-border-radius: .25rem;
.card-header { .card-header {
padding: $card-spacer-y $card-spacer-x; padding: $card-spacer-y $card-spacer-x;
border-bottom: $card-border-width solid #eee; background-color: $card-cap-bg;
border-bottom: $card-border-width solid $card-border-color;
&:first-child { &:first-child {
@include border-radius($card-border-radius $card-border-radius 0 0); @include border-radius($card-border-radius-inner $card-border-radius-inner 0 0);
} }
} }
.card-footer { .card-footer {
padding: $card-spacer-y $card-spacer-x; padding: $card-spacer-y $card-spacer-x;
border-top: $card-border-width solid #eee; background-color: $card-cap-bg;
border-top: $card-border-width solid $card-border-color;
&:last-child { &:last-child {
@include border-radius(0 0 $card-border-radius $card-border-radius); @include border-radius(0 0 $card-border-radius-inner $card-border-radius-inner);
} }
} }
@@ -233,6 +239,7 @@ $card-border-radius: .25rem;
flex: 1 0 0; flex: 1 0 0;
} @else { } @else {
display: table-cell; display: table-cell;
vertical-align: top;
} }
+ .card { + .card {
@@ -241,34 +248,31 @@ $card-border-radius: .25rem;
} }
// Handle rounded corners // Handle rounded corners
&:first-child { @if $enable-rounded {
.card-img-top { &:first-child {
@if $enable-rounded { .card-img-top {
border-top-right-radius: 0; border-top-right-radius: 0;
} }
} .card-img-bottom {
.card-img-bottom {
@if $enable-rounded {
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
} }
} &:last-child {
&:last-child { .card-img-top {
.card-img-top {
@if $enable-rounded {
border-top-left-radius: 0; border-top-left-radius: 0;
} }
} .card-img-bottom {
.card-img-bottom {
@if $enable-rounded {
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
} }
} }
}
&:not(:first-child):not(:last-child) { &:not(:first-child):not(:last-child) {
.card-img-top, border-radius: 0;
.card-img-bottom {
@include border-radius(0); .card-img-top,
.card-img-bottom {
border-radius: 0;
}
} }
} }
} }