I´ve been working with custom icons, but now I get more problems.
I have an app running on Ionic 6, with custom icons like this:
<ion-tabs #tabs>
<ion-tab-bar slot="bottom">
<ion-tab-button tab="resume">
<ion-icon src="/assets/icons/home.svg"></ion-icon>
<ion-label>
Inicio
</ion-label>
</ion-tab-button>
<ion-tab-button tab="my-appointments">
<ion-icon src="/assets/icons/calendar.svg"></ion-icon>
<ion-label>Citas</ion-label>
</ion-tab-button>
<ion-tab-button tab="report">
<ion-icon src="/assets/icons/report.svg"></ion-icon>
<ion-label>Reporte</ion-label>
</ion-tab-button>
<ion-tab-button tab="about">
<ion-icon src="/assets/icons/about.svg"></ion-icon>
<ion-label>Acerca de</ion-label>
</ion-tab-button>
</ion-tab-bar>
</ion-tabs>
But I get sometimes this:
As you can see, it´s clipped with no reason, i do not have any custom css.
But what is even worst, is that if I change the page, sometimes, it goes white.
So what I see is that this method does not work consistenly.
Any ideas?
My package looks like this:
"dependencies": {
"@angular-devkit/schematics": "^12.2.6",
"@angular/animations": "^12.2.10",
"@angular/common": "~12.2.10",
"@angular/core": "~12.2.10",
"@angular/fire": "^7.0.4",
"@angular/forms": "~12.2.10",
"@angular/platform-browser": "~12.2.10",
"@angular/platform-browser-dynamic": "~12.2.10",
"@angular/router": "~12.2.10",
"@ionic-native/calendar": "^5.36.0",
"@ionic-native/camera": "^5.36.0",
"@ionic-native/contacts": "^5.36.0",
"@ionic-native/core": "^5.36.0",
"@ionic-native/diagnostic": "^5.36.0",
"@ionic-native/in-app-browser": "^5.36.0",
"@ionic-native/onesignal": "^5.36.0",
"@ionic/angular": "^6.0.0-rc.0",
"@ionic/core": "^6.0.0-rc.0",
"chart.js": "^2.9.4",
"color-calendar": "^1.0.7",
"cordova-android": "^10.1.1",
"cordova-ios": "^6.2.0",
"cordova-plugin-androidx": "^3.0.0",
"cordova-plugin-androidx-adapter": "^1.1.3",
"cordova-plugin-calendar": "^5.1.5",
"cordova-plugin-camera": "^6.0.0",
"cordova-plugin-inappbrowser": "^5.0.0",
"cordova.plugins.diagnostic": "^6.0.3",
"faker": "^5.5.3",
"firebase": "^9.0.0",
"moment": "^2.29.1",
"ng2-charts": "^2.4.3",
"ngx-image-compress": "^11.0.3",
"ngx-image-cropper": "^4.0.1",
"ngx-material-timepicker": "^5.5.3",
"ngx-moment": "^5.0.0",
"onesignal-cordova-plugin": "^3.0.0",
"rxfire": "^6.0.0",
"rxjs": "~7.3.0",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},
It seems related to be working on an iPhone XR with iOS 15.0.1.