From 44b0eaba8514730a61a8f79561fcd4b219358155 Mon Sep 17 00:00:00 2001
From: Cam Wiegert <cam@camwiegert.com>
Date: Thu, 25 Oct 2018 16:55:54 -0500
Subject: [PATCH] fix(card): adjust styles to match MD (#16093)

* fix(card-content): remove top padding when after header

* fix(card): adjust text weight, sizes, and colors

* fix(card): adjust border-radius and box-shadow

* fix(card): make title/subtitle margin interchangeable
---
 core/src/components/card-content/card-content.md.scss       | 4 ++++
 core/src/components/card-header/card-header.md.scss         | 5 +++++
 core/src/components/card-subtitle/card-subtitle.md.scss     | 1 +
 .../src/components/card-subtitle/card-subtitle.md.vars.scss | 2 +-
 core/src/components/card-title/card-title.md.scss           | 1 +
 core/src/components/card-title/card-title.md.vars.scss      | 2 +-
 core/src/components/card/card.md.vars.scss                  | 6 +++---
 7 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/core/src/components/card-content/card-content.md.scss b/core/src/components/card-content/card-content.md.scss
index bd7924a6af..8a744309e3 100644
--- a/core/src/components/card-content/card-content.md.scss
+++ b/core/src/components/card-content/card-content.md.scss
@@ -44,3 +44,7 @@
     line-height: 1.5;
   }
 }
+
+ion-card-header + .card-content-md {
+  padding-top: 0;
+}
diff --git a/core/src/components/card-header/card-header.md.scss b/core/src/components/card-header/card-header.md.scss
index 6e64c3a0aa..eb1e27c6d6 100644
--- a/core/src/components/card-header/card-header.md.scss
+++ b/core/src/components/card-header/card-header.md.scss
@@ -7,3 +7,8 @@
 :host {
   @include padding($card-md-header-padding-top, $card-md-header-padding-end, $card-md-header-padding-bottom, $card-md-header-padding-start);
 }
+
+::slotted(ion-card-title:not(:first-child)),
+::slotted(ion-card-subtitle:not(:first-child)) {
+  margin-top: 8px;
+}
diff --git a/core/src/components/card-subtitle/card-subtitle.md.scss b/core/src/components/card-subtitle/card-subtitle.md.scss
index 9100ec9bd9..1d1c8370e0 100644
--- a/core/src/components/card-subtitle/card-subtitle.md.scss
+++ b/core/src/components/card-subtitle/card-subtitle.md.scss
@@ -11,4 +11,5 @@
   @include padding($card-md-subtitle-padding-top, $card-md-subtitle-padding-end, $card-md-subtitle-padding-bottom, $card-md-subtitle-padding-start);
 
   font-size: $card-md-subtitle-font-size;
+  font-weight: 500;
 }
diff --git a/core/src/components/card-subtitle/card-subtitle.md.vars.scss b/core/src/components/card-subtitle/card-subtitle.md.vars.scss
index 4221a30e83..3e013646e1 100644
--- a/core/src/components/card-subtitle/card-subtitle.md.vars.scss
+++ b/core/src/components/card-subtitle/card-subtitle.md.vars.scss
@@ -25,7 +25,7 @@ $card-md-subtitle-margin-top:           0 !default;
 $card-md-subtitle-margin-end:           $card-md-subtitle-margin-top !default;
 
 /// @prop - Margin bottom of the card subtitle
-$card-md-subtitle-margin-bottom:        8px !default;
+$card-md-subtitle-margin-bottom:        0 !default;
 
 /// @prop - Margin start of the card subtitle
 $card-md-subtitle-margin-start:         $card-md-subtitle-margin-end !default;
diff --git a/core/src/components/card-title/card-title.md.scss b/core/src/components/card-title/card-title.md.scss
index ea38b39e8d..6741606b96 100644
--- a/core/src/components/card-title/card-title.md.scss
+++ b/core/src/components/card-title/card-title.md.scss
@@ -11,6 +11,7 @@
   @include padding($card-md-title-padding-top, $card-md-title-padding-end, $card-md-title-padding-bottom, $card-md-title-padding-start);
 
   font-size: $card-md-title-font-size;
+  font-weight: 500;
 
   line-height: 1.2;
 }
diff --git a/core/src/components/card-title/card-title.md.vars.scss b/core/src/components/card-title/card-title.md.vars.scss
index f805ea9635..9d92cbac74 100644
--- a/core/src/components/card-title/card-title.md.vars.scss
+++ b/core/src/components/card-title/card-title.md.vars.scss
@@ -4,7 +4,7 @@
 // --------------------------------------------------
 
 /// @prop - Font size of the card title
-$card-md-title-font-size:             24px !default;
+$card-md-title-font-size:             20px !default;
 
 /// @prop - Padding top of the card title
 $card-md-title-padding-top:           0 !default;
diff --git a/core/src/components/card/card.md.vars.scss b/core/src/components/card/card.md.vars.scss
index e0aa931cc3..8adb3f0514 100755
--- a/core/src/components/card/card.md.vars.scss
+++ b/core/src/components/card/card.md.vars.scss
@@ -19,10 +19,10 @@ $card-md-margin-start:                10px !default;
 $card-md-background-color:            $item-md-background !default;
 
 /// @prop - Box shadow of the card
-$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-box-shadow:                  0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12) !default;
 
 /// @prop - Border radius of the card
-$card-md-border-radius:               2px !default;
+$card-md-border-radius:               4px !default;
 
 /// @prop - Font size of the card
 $card-md-font-size:                   14px !default;
@@ -31,4 +31,4 @@ $card-md-font-size:                   14px !default;
 $card-md-line-height:                 1.5 !default;
 
 /// @prop - Color of the card text
-$card-md-text-color:                  $text-color-step-150 !default;
+$card-md-text-color:                  $text-color-step-450 !default;