Il problema dipende dal tema, Mobile7 è obsoleto e non più manutenuto, quindi ogni anno devi scriverti a mano le media query e tenerle aggiornate.
Ti consiglierei di passare l'applicazione a un tema supportato, Quadro o Ionic.
Al momento l'ultimo update di IOS ha rotto le media query di Quadro [ :( ], per cui le applicazioni sono un pò più strette, ci sto guardando adesso.
Edit:
risolto, queste sono le media query per il tema Quadro non fluid da mettere temporaneamente in custom.css ( forse sono valide anche Mobile7 a parte il background ) :
- Code: Select all
/* iPhone 13 Mini, iPhone 12 Mini, iPhone 11 Pro, iPhone XS, and iPhone X*/
/* IPhone XR and 11 */
/* iPhone 11 Pro Max and iPhone XS Max */
/* iPhone 13, iPhone 13 Pro, iPhone 12, iPhone 12 Pro, IPhone 14, IPhone 14 PRO */
/* iPhone 13 Max, iPhone 12 Pro Max, IPhone 14 MAX */
/* IPhone 14 PRO MAX */
@media only screen and (device-width : 375px) and (device-height : 812px) and (-webkit-device-pixel-ratio : 3),
only screen and (device-width : 414px) and (device-height : 896px) and (-webkit-device-pixel-ratio : 2),
only screen and (device-width : 414px) and (device-height : 896px) and (-webkit-device-pixel-ratio : 3),
only screen and (device-width : 390px) and (device-height : 844px) and (-webkit-device-pixel-ratio : 3),
only screen and (device-width : 428px) and (device-height : 926px) and (-webkit-device-pixel-ratio : 3),
only screen and (width: 430px) and (height: 839px) and (-webkit-device-pixel-ratio : 3) {
body {
background: #0081C2;
}
@supports(padding: env(safe-area-inset-top)) {
#wep {
top: env(safe-area-inset-top);
height: calc(100% - env(safe-area-inset-top) - env(safe-area-inset-bottom));
}
.tab-img-0, .selected-tab-img-0, .page-icon-0, .selected-page-icon-0 {
-webkit-mask-size: 30px 30px !important;
}
tab-caption-0, .selected-tab-caption-0, .page-header-container-0, .selected-page-header-container-0, .selected-tab-caption-tableft-0, .tab-caption-tableft-0, .selected-tab-caption-tabright-0, .tab-caption-tabright-0 {
font-size: 12px;
}
tab-caption-container-0, .selected-tab-caption-container-0 {
margin-left: 15px;
}
}
}
@media only screen and (orientation: landscape) and (device-width : 375px) and (device-height : 812px) and (-webkit-device-pixel-ratio : 3),
only screen and (orientation: landscape) and (device-width : 414px) and (device-height : 896px) and (-webkit-device-pixel-ratio : 2),
only screen and (orientation: landscape) and (device-width : 414px) and (device-height : 896px) and (-webkit-device-pixel-ratio : 3),
only screen and (orientation: landscape) and (device-width : 390px) and (device-height : 844px) and (-webkit-device-pixel-ratio : 3),
only screen and (orientation: landscape) and (device-width : 428px) and (device-height : 926px) and (-webkit-device-pixel-ratio : 3),
only screen and (orientation: landscape) and (width: 430px) and (height: 839px) and (-webkit-device-pixel-ratio : 3) {
@supports(padding: env(safe-area-inset-top)) {
body {
background: #777777;
}
#wep {
left: 44px;
width: calc(100% - 88px);
height: calc(100% - env(safe-area-inset-bottom));
}
.tab-img-0, .selected-tab-img-0, .page-icon-0, .selected-page-icon-0 {
-webkit-mask-size: 30px 30px !important;
}
tab-caption-0, .selected-tab-caption-0, .page-header-container-0, .selected-page-header-container-0, .selected-tab-caption-tableft-0, .tab-caption-tableft-0, .selected-tab-caption-tabright-0, .tab-caption-tabright-0 {
font-size: 12px;
}
tab-caption-container-0, .selected-tab-caption-container-0 {
margin-left: 15px;
}
}
}