From 794c3d4e9608968d8d5ef8b77f9b024fa0131572 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Date: Wed, 25 Mar 2020 12:14:26 -0400
Subject: [PATCH] fix(title): large title now inherits global color styling
 during nav transition (#20862)

---
 core/src/components/header/header.tsx    | 3 ++-
 core/src/components/title/title.ios.scss | 4 ++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/core/src/components/header/header.tsx b/core/src/components/header/header.tsx
index 17376a2e56..bbdff3f2ce 100644
--- a/core/src/components/header/header.tsx
+++ b/core/src/components/header/header.tsx
@@ -126,7 +126,8 @@ export class Header implements ComponentInterface {
     this.scrollEl!.addEventListener('scroll', this.contentScrollCallback);
 
     writeTask(() => {
-      cloneElement('ion-title');
+      const title = cloneElement('ion-title') as HTMLIonTitleElement;
+      title.size = 'large';
       cloneElement('ion-back-button');
 
       if (this.collapsibleMainHeader !== undefined) {
diff --git a/core/src/components/title/title.ios.scss b/core/src/components/title/title.ios.scss
index f7285fdf5f..63897c6d76 100644
--- a/core/src/components/title/title.ios.scss
+++ b/core/src/components/title/title.ios.scss
@@ -55,3 +55,7 @@
 
   text-align: start;
 }
+
+:host(.title-large.ion-cloned-element) {
+  --color: #{$text-color};
+}