From 723d17b868743e92cde0af3b60823677d55519fa Mon Sep 17 00:00:00 2001
From: Cam Wiegert <cam@camwiegert.com>
Date: Mon, 26 Nov 2018 18:30:17 -0600
Subject: [PATCH] fix(label): move default flex and margin to item (#16461)

This moves item-specific margin and flex values out of label and into item as a slotted style to prevent those styles from leaking into labels further down the tree.

closes #15393
---
 core/src/components/item-divider/item-divider.ios.scss | 8 ++++++++
 core/src/components/item-divider/item-divider.md.scss  | 8 ++++++++
 core/src/components/item/item.ios.scss                 | 8 ++++++++
 core/src/components/item/item.md.scss                  | 9 +++++++++
 core/src/components/item/item.scss                     | 4 ++++
 core/src/components/label/label.ios.scss               | 4 ----
 core/src/components/label/label.md.scss                | 4 ----
 core/src/components/label/label.scss                   | 4 ----
 8 files changed, 37 insertions(+), 12 deletions(-)

diff --git a/core/src/components/item-divider/item-divider.ios.scss b/core/src/components/item-divider/item-divider.ios.scss
index 484cdd9238c..1bfe5431b51 100644
--- a/core/src/components/item-divider/item-divider.ios.scss
+++ b/core/src/components/item-divider/item-divider.ios.scss
@@ -38,6 +38,14 @@
 }
 
 
+// Material Design Slotted Label
+// --------------------------------------------------
+
+::slotted(ion-label) {
+  @include margin(10px, 8px, 10px, 0);
+}
+
+
 // iOS Item Divider Content
 // --------------------------------------------------
 
diff --git a/core/src/components/item-divider/item-divider.md.scss b/core/src/components/item-divider/item-divider.md.scss
index a8b9598fed1..6c9d95a5c13 100644
--- a/core/src/components/item-divider/item-divider.md.scss
+++ b/core/src/components/item-divider/item-divider.md.scss
@@ -31,6 +31,14 @@
 }
 
 
+// Material Design Slotted Label
+// --------------------------------------------------
+
+::slotted(ion-label) {
+  @include margin(13px, 0, 10px, 0);
+}
+
+
 // Material Design Slotted Icon
 // --------------------------------------------------
 
diff --git a/core/src/components/item/item.ios.scss b/core/src/components/item/item.ios.scss
index 5d4fbf9f31f..014dd47a4a8 100644
--- a/core/src/components/item/item.ios.scss
+++ b/core/src/components/item/item.ios.scss
@@ -140,6 +140,14 @@
 }
 
 
+// iOS Slotted Label
+// --------------------------------------------------
+
+::slotted(ion-label) {
+  @include margin(10px, 8px, 10px, 0);
+}
+
+
 // iOS Stacked & Floating Inputs
 // --------------------------------------------------
 
diff --git a/core/src/components/item/item.md.scss b/core/src/components/item/item.md.scss
index a798a6ff41a..0ed6fa1c2a0 100644
--- a/core/src/components/item/item.md.scss
+++ b/core/src/components/item/item.md.scss
@@ -177,6 +177,15 @@
 }
 
 
+// Material Design Slotted Label
+// --------------------------------------------------
+
+::slotted(ion-label) {
+  @include margin(13px, 0, 10px, 0);
+}
+
+
+
 // Material Design Floating/Stacked Label
 // --------------------------------------------------
 
diff --git a/core/src/components/item/item.scss b/core/src/components/item/item.scss
index 5017e6a79ef..a1d9452ae2f 100644
--- a/core/src/components/item/item.scss
+++ b/core/src/components/item/item.scss
@@ -213,6 +213,10 @@ button, a {
   z-index: 1;
 }
 
+::slotted(ion-label) {
+  flex: 1;
+}
+
 
 // Item Input
 // -----------------------------------------
diff --git a/core/src/components/label/label.ios.scss b/core/src/components/label/label.ios.scss
index f2c4a41212f..b97a1cb68c3 100644
--- a/core/src/components/label/label.ios.scss
+++ b/core/src/components/label/label.ios.scss
@@ -4,10 +4,6 @@
 // iOS Label
 // --------------------------------------------------
 
-:host-context(.item) {
-  @include margin($label-ios-margin-top, $label-ios-margin-end, $label-ios-margin-bottom, $label-ios-margin-start);
-}
-
 :host([text-wrap]) {
   font-size: $label-ios-text-wrap-font-size;
 
diff --git a/core/src/components/label/label.md.scss b/core/src/components/label/label.md.scss
index a040387b28a..5d625947539 100644
--- a/core/src/components/label/label.md.scss
+++ b/core/src/components/label/label.md.scss
@@ -4,10 +4,6 @@
 // Material Design Label
 // --------------------------------------------------
 
-:host-context(.item) {
-  @include margin($label-md-margin-top, $label-md-margin-end, $label-md-margin-bottom, $label-md-margin-start);
-}
-
 :host([text-wrap]) {
   line-height: $label-md-text-wrap-line-height;
 }
diff --git a/core/src/components/label/label.scss b/core/src/components/label/label.scss
index 86606fbd6a4..ed5baf99c9b 100644
--- a/core/src/components/label/label.scss
+++ b/core/src/components/label/label.scss
@@ -10,12 +10,8 @@
    */
   --color: initial;
 
-  @include margin(0);
-
   display: block;
 
-  flex: 1;
-
   color: var(--color);
 
   font-family: $font-family-base;