fix(modal): inline modals inherit ion-page styling

[sean-perkins]

Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
• Build (npm run build) was run locally and any changes were pushed
• Lint (npm run lint) has passed locally and any fixes were made for failures

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• Feature
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

Inline modals do not inherit CSS classes that are forwarded when the modal is presented. This results in implementations that make use of an ion-header, ion-content with overflow scroll, inside an inline modal, are unable to reach the end of the contents.

Issue Number: #24706

What is the new behavior?

Inline modals now inherit CSS classes that are forwarded when the modal is presented (aligning with the controller implementation).

This results in the user being able to correctly scroll to the end of the contents, when using the above scenario.

• Inline modal templates are appended to a new parent element that inherits the CSS classes
• Inline modal template is replaced with the new parent element

Does this introduce a breaking change?

• Yes
• No

Other information

This only appears to affect modal implementations (can be seen in our inline modal example when adding overflow). Was not able to replicate the same issue with popover usages.

[liamdebeasi]

One non-blocking comment