diff --git a/ionic/components/card/card.scss b/ionic/components/card/card.scss index 0179319835..614c3d6786 100644 --- a/ionic/components/card/card.scss +++ b/ionic/components/card/card.scss @@ -5,11 +5,10 @@ .card { display: block; +} - img { - width: 100%; - } - +.card img { + width: 100%; } ion-card-header { @@ -18,3 +17,7 @@ ion-card-header { white-space: nowrap; text-overflow: ellipsis; } + +ion-card-content { + display: block; +} diff --git a/ionic/components/card/modes/ios.scss b/ionic/components/card/modes/ios.scss index aad4037b69..a64df34af4 100644 --- a/ionic/components/card/modes/ios.scss +++ b/ionic/components/card/modes/ios.scss @@ -7,6 +7,11 @@ $card-ios-margin-right: 16px !default; $card-ios-margin-bottom: 16px !default; $card-ios-margin-left: 16px !default; +$card-ios-padding-top: 13px !default; +$card-ios-padding-right: 16px !default; +$card-ios-padding-bottom: 14px !default; +$card-ios-padding-left: 16px !default; + $card-ios-background-color: $list-background-color !default; $card-ios-box-shadow: 0 1px 2px rgba(0,0,0,.3) !default; $card-ios-border-radius: 2px !default; @@ -57,6 +62,11 @@ $card-ios-header-color: #333 !default; color: $card-ios-header-color; } + ion-card-content { + padding: $card-ios-padding-top $card-ios-padding-right $card-ios-padding-bottom $card-ios-padding-left; + font-size: $card-ios-font-size; + } + .card-title { padding: $card-ios-title-padding; font-size: $card-ios-title-font-size; @@ -66,11 +76,13 @@ $card-ios-header-color: #333 !default; h1 { margin: 0 0 2px; font-size: 2.4rem; + font-weight: normal; } h2 { margin: 2px 0 2px; font-size: 1.6rem; + font-weight: normal; } h3, @@ -79,6 +91,7 @@ $card-ios-header-color: #333 !default; h6 { margin: 2px 0 2px; font-size: 1.4rem; + font-weight: normal; } p { diff --git a/ionic/components/card/modes/material.scss b/ionic/components/card/modes/material.scss index f98329ddc8..547bef2eb7 100644 --- a/ionic/components/card/modes/material.scss +++ b/ionic/components/card/modes/material.scss @@ -7,10 +7,16 @@ $card-md-margin-right: 8px !default; $card-md-margin-bottom: 8px !default; $card-md-margin-left: 8px !default; +$card-md-padding-top: 13px !default; +$card-md-padding-right: 16px !default; +$card-md-padding-bottom: 13px !default; +$card-md-padding-left: 16px !default; + $card-md-background-color: $list-background-color !default; $card-md-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12) !default; $card-md-border-radius: 2px !default; $card-md-font-size: 1.4rem !default; +$card-md-line-height: 1.5 !default; $card-md-text-color: #222 !default; $card-md-title-font-size: 2.4rem !default; @@ -63,6 +69,12 @@ $card-md-header-color: #222 !default; color: $card-md-header-color; } + ion-card-content { + padding: $card-md-padding-top $card-md-padding-right $card-md-padding-bottom $card-md-padding-left; + font-size: $card-md-font-size; + line-height: $card-md-line-height; + } + .card-title { padding: $card-md-title-padding; font-size: $card-md-title-font-size; diff --git a/ionic/components/card/test/advanced/main.html b/ionic/components/card/test/advanced/main.html index 40c542515c..bfa92b2077 100644 --- a/ionic/components/card/test/advanced/main.html +++ b/ionic/components/card/test/advanced/main.html @@ -9,19 +9,15 @@ -
- Keep close to Nature's heart... and break clear away, - once in awhile, and climb a mountain. I am within a paragraph element. -
-+ Keep close to Nature's heart... and break clear away, + once in awhile, and climb a mountain. I am within a paragraph element. +
+