diff --git a/core/src/components/modal/readme.md b/core/src/components/modal/readme.md index 8f8564731d..2203c9f5fa 100644 --- a/core/src/components/modal/readme.md +++ b/core/src/components/modal/readme.md @@ -173,6 +173,8 @@ export class CalendarComponentModule {} Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + If you are creating an application that uses `ion-tabs`, it is recommended that you get the parent `ion-router-outlet` using `this.routerOutlet.parentOutlet.nativeEl`, otherwise the tabbar will not scale down when the modal opens. ```javascript @@ -302,6 +304,8 @@ console.log(data); Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + ```javascript const modalElement = document.createElement('ion-modal'); modalElement.component = 'modal-page'; @@ -346,6 +350,8 @@ export const ModalExample: React.FC = () => { Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + ```tsx Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + ```tsx import { Component, Element, h } from '@stencil/core'; diff --git a/core/src/components/modal/usage/angular.md b/core/src/components/modal/usage/angular.md index 98db404510..e0c3852966 100644 --- a/core/src/components/modal/usage/angular.md +++ b/core/src/components/modal/usage/angular.md @@ -130,6 +130,8 @@ export class CalendarComponentModule {} Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + If you are creating an application that uses `ion-tabs`, it is recommended that you get the parent `ion-router-outlet` using `this.routerOutlet.parentOutlet.nativeEl`, otherwise the tabbar will not scale down when the modal opens. ```javascript diff --git a/core/src/components/modal/usage/javascript.md b/core/src/components/modal/usage/javascript.md index ce0e7a6c82..c985736c35 100644 --- a/core/src/components/modal/usage/javascript.md +++ b/core/src/components/modal/usage/javascript.md @@ -84,6 +84,8 @@ console.log(data); Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + ```javascript const modalElement = document.createElement('ion-modal'); modalElement.component = 'modal-page'; diff --git a/core/src/components/modal/usage/react.md b/core/src/components/modal/usage/react.md index 85e70ddc95..e3cfe2c9e3 100644 --- a/core/src/components/modal/usage/react.md +++ b/core/src/components/modal/usage/react.md @@ -21,6 +21,8 @@ export const ModalExample: React.FC = () => { Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + ```tsx Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + ```tsx import { Component, Element, h } from '@stencil/core';