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
feat: ios card style modal for iPad should not affect routerOutlet #20700
Comments
Thanks for the issue. In the case of a split view application, you should be targeting |
Could you provide a snipped on how to target ion-split-view instead of ion-router-outlet for creating a card style modal? |
Sorry, I mean |
Yes, now also the ion-split-pane get affected. Thank you.
But this was not the intention of my feature request. Current behaviour using card style modal:Wanted behaviour using card style modal:as you can see, the second level modal is not taking the full width, but respects width and height of parent modal. for comparison, this is what you get if you:
|
Thanks for the clarification! I am going to change this to a bug since Ionic's card style modal does not follow the spec for iPad, but it should. |
@liamdebeasi i tried your dev build It works just like I thought it would!
default-modal class in
used code for parent modal:
used code for child modal:
Furthermore i think, there should still be the option to call fullscreen modals. For example, you can find these in the mail app. Heres a screenshot: also heres a link to a video of current behavior of your dev build: |
Thanks for the useful feedback!
I will work on these changes and will post another dev build for testing. Thank you! |
to your point 4:
looking forward for next dev-build! |
Thanks for the follow up. The behavior shown in the Mail app appears to be something separate than the card modal that you showed in #20700 (comment). I created a separate feature request for that here. |
Ok I fixed a couple things:
Can you try the following dev build and let me know if it resolves the issue?
|
@liamdebeasi so much wow! I've tested your dev build using iPhone and iPad view on chrome browser. also i discovered a bug, where card style modal gets incorrectly applied on iPad using
heres the sample: thank you very much for your high commitment! Updatepushing modals on android tablet view leads to overlapping backdrop background color. Update 2I've deployed it on my device. Seems like the modal wont show the stacked card view, instead taking full height. |
Thanks for the follow up.
This is the correct behavior.
If you feel this is a bug please open a separate issue as this does not appear to be related to the card modal updates.
Fixed! Here's a dev build This PR looks to be in pretty good shape, so I will get this reviewed and merged in as soon as I can. Thanks for all the testing and feedback! |
I am going to keep this issue open until I can get the PR merged in. Thanks! |
Thanks for the issue (and for all the testing and feedback!). This has been resolved via #20750 and will be available in an upcoming release of Ionic Framework. |
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out. |
Feature Request
Ionic version:
[x] 5.0.4
Describe the Feature Request
At the moment the card-style-modal only looks good on mobile view. On tablet view and especially with split-pane there is a lot of potential for improvement.
There should be an option to open a modal as usual. Subsequent nested modals should not have any influence on the routerOutlet, but only on the underlying modal
Current behaviour:
Link to video
Describe Preferred Solution
calling a child modal by using
should appear as in the picture by providing additional property like
furthermore nested modals should respect the given width/height provided by cssClass.
Additional Context
You can find this kind of card style modal in the IOS Appstore
The text was updated successfully, but these errors were encountered: