rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-19 16:54:24 +01:00
Code Issues Actions Packages Releases 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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
scss/_card.scss
View File

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