From 85ec5f7b2cac56858052f2f23a0b72a0e57eaa36 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Ferreira?=
 <60441552+JoaoFerreira-FrontEnd@users.noreply.github.com>
Date: Wed, 16 Oct 2024 11:59:58 +0100
Subject: [PATCH] fix(SafeAreas): fix iOS fallback (#29941)

Issue number: internal

---------
- fix ion-statusbar css var fallback;


## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
- CSS var --ion-statusbar-padding was not working because the Sass
variable was not escaped.


## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->
---
 core/src/css/ionic/core.ionic.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/core/src/css/ionic/core.ionic.scss b/core/src/css/ionic/core.ionic.scss
index 61b9023fed..a95cff2717 100644
--- a/core/src/css/ionic/core.ionic.scss
+++ b/core/src/css/ionic/core.ionic.scss
@@ -223,7 +223,7 @@ ion-toast-controller,
 
 html.plt-ios.plt-hybrid,
 html.plt-ios.plt-pwa {
-  --ion-statusbar-padding: globals.$ionic-space-m;
+  --ion-statusbar-padding: #{globals.$ionic-space-500};
 }
 
 @supports (padding-top: 20px) {