javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-15 01:03:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(modal): border radius is correctly set on card style modal (#23461)

Browse Source
This commit is contained in:
Liam DeBeasi
2021-06-17 13:36:30 -04:00
committed by GitHub
parent 0a700f9f6f
commit bccb8ad5fb
3 changed files with 10 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
core/src/components/modal/modal.ios.scss
View File

@ -68,10 +68,3 @@
box-shadow: var(--box-shadow); box-shadow: var(--box-shadow);
} }
} }
:host(.overlay-datetime) {
--width: 316px;
--height: 296px;
--background: transparent;
--border-radius: #{$modal-ios-border-radius};
}

2
core/src/components/modal/modal.ios.vars.scss
View File

@ -8,5 +8,3 @@ $modal-ios-background-color: $background-color !default;
/// @prop - Border radius for the modal /// @prop - Border radius for the modal
$modal-ios-border-radius: 10px !default; $modal-ios-border-radius: 10px !default;
$modal-ios-card-border-radius: 10px !default;

12
core/src/css/core.scss
View File

@ -63,11 +63,15 @@ html.ios ion-modal ion-toolbar {
padding-left: calc(var(--ion-safe-area-left) + 8px); padding-left: calc(var(--ion-safe-area-left) + 8px);
} }
// .ion-page needs to explicitly inherit /**
// the border radius in safari otherwise * .ion-page needs to explicitly set
// modals will not show border radius properly * the border radius in WebKit otherwise
* modals will not show border radius properly.
* Do not use inherit as that will not
* work with shadow dom in this case.
*/
html.ios ion-modal .ion-page { html.ios ion-modal .ion-page {
border-radius: inherit; border-radius: 10px 10px 0 0;
} }
/** /**