mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-10 00:27:41 +08:00
chore(card): update core card
This commit is contained in:
@ -8,6 +8,6 @@ ion-card-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
ion-card-content.upgraded {
|
||||
ion-card-content.hydrated {
|
||||
visibility: inherit;
|
||||
}
|
||||
|
||||
@ -13,6 +13,6 @@ ion-card-header {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
ion-card-header.upgraded {
|
||||
ion-card-header.hydrated {
|
||||
visibility: inherit;
|
||||
}
|
||||
|
||||
@ -8,6 +8,6 @@ ion-card-title {
|
||||
display: block;
|
||||
}
|
||||
|
||||
ion-card-header.upgraded {
|
||||
ion-card-header.hydrated {
|
||||
visibility: inherit;
|
||||
}
|
||||
|
||||
@ -8,15 +8,16 @@
|
||||
/// @prop - Margin top of the card
|
||||
$card-ios-margin-top: 12px !default;
|
||||
|
||||
/// @prop - Margin right of the card
|
||||
// deprecated
|
||||
$card-ios-margin-right: 12px !default;
|
||||
/// @prop - Margin end of the card
|
||||
$card-ios-margin-end: $card-ios-margin-right !default;
|
||||
|
||||
/// @prop - Margin bottom of the card
|
||||
$card-ios-margin-bottom: 12px !default;
|
||||
|
||||
/// @prop - Margin left of the card
|
||||
// deprecated
|
||||
$card-ios-margin-left: 12px !default;
|
||||
|
||||
/// @prop - Margin start of the card
|
||||
$card-ios-margin-start: $card-ios-margin-left;
|
||||
|
||||
@ -46,11 +47,11 @@ $card-ios-text-color: #666 !default;
|
||||
|
||||
|
||||
.card-ios {
|
||||
margin: $card-ios-margin-top $card-ios-margin-right $card-ios-margin-bottom $card-ios-margin-left;
|
||||
@include margin($card-ios-margin-top, $card-ios-margin-end, $card-ios-margin-bottom, $card-ios-margin-start);
|
||||
@include border-radius($card-ios-border-radius);
|
||||
|
||||
width: calc(100% - #{($card-ios-margin-right + $card-ios-margin-left)});
|
||||
width: calc(100% - #{($card-ios-margin-end + $card-ios-margin-start)});
|
||||
|
||||
border-radius: $card-ios-border-radius;
|
||||
font-size: $card-ios-font-size;
|
||||
|
||||
background: $card-ios-background-color;
|
||||
@ -76,14 +77,14 @@ $card-ios-text-color: #666 !default;
|
||||
}
|
||||
|
||||
.card-ios h1 {
|
||||
margin: 0 0 2px;
|
||||
@include margin(0, 0, 2px);
|
||||
|
||||
font-size: 2.4rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.card-ios h2 {
|
||||
margin: 2px 0;
|
||||
@include margin(2px, 0);
|
||||
|
||||
font-size: 1.6rem;
|
||||
font-weight: normal;
|
||||
@ -93,14 +94,14 @@ $card-ios-text-color: #666 !default;
|
||||
.card-ios h4,
|
||||
.card-ios h5,
|
||||
.card-ios h6 {
|
||||
margin: 2px 0;
|
||||
@include margin(2px, 0);
|
||||
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.card-ios p {
|
||||
margin: 0 0 2px;
|
||||
@include margin(0, 0, 2px);
|
||||
|
||||
font-size: 1.4rem;
|
||||
color: $card-ios-text-color;
|
||||
|
||||
@ -8,15 +8,16 @@
|
||||
/// @prop - Margin top of the card
|
||||
$card-md-margin-top: 10px !default;
|
||||
|
||||
/// @prop - Margin right of the card
|
||||
// deprecated
|
||||
$card-md-margin-right: 10px !default;
|
||||
/// @prop - Margin end of the card
|
||||
$card-md-margin-end: $card-md-margin-right !default;
|
||||
|
||||
/// @prop - Margin bottom of the card
|
||||
$card-md-margin-bottom: 10px !default;
|
||||
|
||||
/// @prop - Margin left of the card
|
||||
// deprecated
|
||||
$card-md-margin-left: 10px !default;
|
||||
|
||||
/// @prop - Margin start of the card
|
||||
$card-md-margin-start: $card-md-margin-left;
|
||||
|
||||
@ -52,11 +53,11 @@ $card-md-text-color: #222 !default;
|
||||
|
||||
|
||||
.card-md {
|
||||
margin: $card-md-margin-top $card-md-margin-right $card-md-margin-bottom $card-md-margin-left;
|
||||
@include margin($card-md-margin-top, $card-md-margin-end, $card-md-margin-bottom, $card-md-margin-start);
|
||||
@include border-radius($card-md-border-radius);
|
||||
|
||||
width: calc(100% - #{($card-md-margin-right + $card-md-margin-left)});
|
||||
width: calc(100% - #{($card-md-margin-end + $card-md-margin-start)});
|
||||
|
||||
border-radius: $card-md-border-radius;
|
||||
font-size: $card-md-font-size;
|
||||
|
||||
background: $card-md-background-color;
|
||||
@ -87,7 +88,7 @@ $card-md-text-color: #222 !default;
|
||||
}
|
||||
|
||||
.card-md h1 {
|
||||
margin: 0 0 2px;
|
||||
@include margin(0, 0, 2px);
|
||||
|
||||
font-size: 2.4rem;
|
||||
font-weight: normal;
|
||||
@ -95,7 +96,7 @@ $card-md-text-color: #222 !default;
|
||||
}
|
||||
|
||||
.card-md h2 {
|
||||
margin: 2px 0;
|
||||
@include margin(2px, 0);
|
||||
|
||||
font-size: 1.6rem;
|
||||
font-weight: normal;
|
||||
@ -106,7 +107,7 @@ $card-md-text-color: #222 !default;
|
||||
.card-md h4,
|
||||
.card-md h5,
|
||||
.card-md h6 {
|
||||
margin: 2px 0;
|
||||
@include margin(2px, 0);
|
||||
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
@ -114,7 +115,7 @@ $card-md-text-color: #222 !default;
|
||||
}
|
||||
|
||||
.card-md p {
|
||||
margin: 0 0 2px;
|
||||
@include margin(0, 0, 2px);
|
||||
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
|
||||
@ -9,7 +9,7 @@ ion-card {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
ion-card.upgraded {
|
||||
ion-card.hydrated {
|
||||
visibility: inherit;
|
||||
}
|
||||
|
||||
|
||||
@ -8,15 +8,16 @@
|
||||
/// @prop - Margin top of the card
|
||||
$card-wp-margin-top: 8px !default;
|
||||
|
||||
/// @prop - Margin right of the card
|
||||
// deprecated
|
||||
$card-wp-margin-right: 8px !default;
|
||||
/// @prop - Margin end of the card
|
||||
$card-wp-margin-end: $card-wp-margin-right !default;
|
||||
|
||||
/// @prop - Margin bottom of the card
|
||||
$card-wp-margin-bottom: 8px !default;
|
||||
|
||||
/// @prop - Margin left of the card
|
||||
// deprecated
|
||||
$card-wp-margin-left: 8px !default;
|
||||
|
||||
/// @prop - Margin start of the card
|
||||
$card-wp-margin-start: $card-wp-margin-left;
|
||||
|
||||
@ -55,11 +56,11 @@ $card-wp-text-color: #222 !default;
|
||||
|
||||
|
||||
.card-wp {
|
||||
margin: $card-wp-margin-top $card-wp-margin-right $card-wp-margin-bottom $card-wp-margin-left;
|
||||
@include margin($card-wp-margin-top, $card-wp-margin-end, $card-wp-margin-bottom, $card-wp-margin-start);
|
||||
@include border-radius($card-wp-border-radius);
|
||||
|
||||
width: calc(100% - #{($card-wp-margin-right + $card-wp-margin-left)});
|
||||
width: calc(100% - #{($card-wp-margin-end + $card-wp-margin-start)});
|
||||
|
||||
border-radius: $card-wp-border-radius;
|
||||
font-size: $card-wp-font-size;
|
||||
|
||||
background: $card-wp-background-color;
|
||||
@ -90,7 +91,7 @@ $card-wp-text-color: #222 !default;
|
||||
}
|
||||
|
||||
.card-wp h1 {
|
||||
margin: 0 0 2px;
|
||||
@include margin(0, 0, 2px);
|
||||
|
||||
font-size: 2.4rem;
|
||||
font-weight: normal;
|
||||
@ -98,7 +99,7 @@ $card-wp-text-color: #222 !default;
|
||||
}
|
||||
|
||||
.card-wp h2 {
|
||||
margin: 2px 0;
|
||||
@include margin(2px, 0);
|
||||
|
||||
font-size: 1.6rem;
|
||||
font-weight: normal;
|
||||
@ -109,7 +110,7 @@ $card-wp-text-color: #222 !default;
|
||||
.card-wp h4,
|
||||
.card-wp h5,
|
||||
.card-wp h6 {
|
||||
margin: 2px 0;
|
||||
@include margin(2px, 0);
|
||||
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
@ -117,7 +118,7 @@ $card-wp-text-color: #222 !default;
|
||||
}
|
||||
|
||||
.card-wp p {
|
||||
margin: 0 0 2px;
|
||||
@include margin(0, 0, 2px);
|
||||
|
||||
font-size: 1.4rem;
|
||||
font-weight: normal;
|
||||
|
||||
Reference in New Issue
Block a user