-
Notifications
You must be signed in to change notification settings - Fork 3.2k
docs(nav): component playground for modal navigation #2463
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
docs(nav): component playground for modal navigation #2463
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
…ayground/modal-navigation
|
||
TODO: Playground Example | ||
<ModalNavigationExample /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm seeing some weird transition animations in iOS mode: https://user-images.githubusercontent.com/90629384/184921906-98e49071-f095-4424-b437-689e636d9adb.mp4
It doesn't happen in Stackblitz, so maybe this is related to the Playground component?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is a strange one... the style block that is causing this issue is:
ion-modal .ion-page:not(ion-nav.ion-page) {
position: relative;
contain: layout style;
height: 100%;
}
somehow it's stripping the space within the :not
tag, as ours is:
ion-modal .ion-page:not(ion-nav .ion-page) {
position: relative;
contain: layout style;
height: 100%;
}
We can see that issue directly from the CDN: https://cdn.jsdelivr.net/npm/@ionic/core/css/ionic.bundle.css.
I'll need to work with Liam to uncover why this is happening. I don't see this as a blocker though, as the Stackblitz examples work & when developers install the package they will not have this issue.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok, this will be resolved once: ionic-team/ionic-framework#25767 is merged, we deploy the next patch & jsDelivr cache is purged.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Word 👍
</ion-buttons> | ||
</ion-toolbar> | ||
</ion-header> | ||
<ion-content> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we add ion-padding
? screen looks a bit cramped
This PR introduces an example for modal navigation on the
ion-nav
docs page.https://ionic-docs-git-nav-playground-modal-navigation-ionic1.vercel.app/docs/api/nav#navigation-within-a-modal