From 71a7af0f52fe62937b1dea1ca2739e78801a2a6d Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Date: Tue, 26 Sep 2023 12:12:04 -0400
Subject: [PATCH] fix(title): large title uses custom font on transition
 (#28231)

Issue number: N/A

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

When testing Dynamic Font Scaling with a custom font I noticed that the
large title does not respect `--ion-font-family` on transition.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- The cloned large title now respect `--ion-font-family`

Note: This happens in `main` too which is why I am merging into there
instead of the Dynamic Font Scaling branch.

| `main` | branch |
| - | - |
|
![IMG_0182](https://github.com/ionic-team/ionic-framework/assets/2721089/8e09669b-5e76-4736-a1cb-bea87dc25258)
|
![IMG_0183](https://github.com/ionic-team/ionic-framework/assets/2721089/bde88ff1-6024-40ec-99ab-c71e73386dc9)
|

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
---
 core/src/components/title/title.ios.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/core/src/components/title/title.ios.scss b/core/src/components/title/title.ios.scss
index a993c94787..5a377b4e80 100644
--- a/core/src/components/title/title.ios.scss
+++ b/core/src/components/title/title.ios.scss
@@ -61,6 +61,7 @@
 
 :host(.title-large.ion-cloned-element) {
   --color: #{$text-color};
+  font-family: var(--ion-font-family);
 }
 
 :host(.title-large) .toolbar-title {