diff --git a/core/src/components/menu/menu.scss b/core/src/components/menu/menu.scss index f5aa07aaa7..3beef6959c 100644 --- a/core/src/components/menu/menu.scss +++ b/core/src/components/menu/menu.scss @@ -66,15 +66,12 @@ ion-backdrop { .menu-content-open { cursor: pointer; touch-action: manipulation; -} -.menu-content-open { // the containing element itself should be clickable but // everything inside of it should not clickable when menu is open pointer-events: none; } - @media (max-width: 340px) { .menu-inner { diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx index 230580f43a..68c4c23ce5 100644 --- a/core/src/components/menu/menu.tsx +++ b/core/src/components/menu/menu.tsx @@ -214,11 +214,16 @@ export class Menu { @Listen('body:click', { enabled: false, capture: true }) onBackdropClick(ev: any) { - const path = ev.path; - if (path && !path.includes(this.menuInnerEl) && this.lastOnEnd < ev.timeStamp - 100) { - ev.preventDefault(); - ev.stopPropagation(); - this.close(); + if (this.lastOnEnd < ev.timeStamp - 100) { + const shouldClose = (ev.composedPath) + ? !ev.composedPath().includes(this.menuInnerEl) + : false; + + if (shouldClose) { + ev.preventDefault(); + ev.stopPropagation(); + this.close(); + } } } @@ -481,7 +486,6 @@ export class Menu { , diff --git a/core/src/components/split-pane/split-pane.ios.scss b/core/src/components/split-pane/split-pane.ios.scss index d338fcdbee..6d5d273611 100644 --- a/core/src/components/split-pane/split-pane.ios.scss +++ b/core/src/components/split-pane/split-pane.ios.scss @@ -5,7 +5,7 @@ // Split Pane // -------------------------------------------------- -.split-pane-ios.split-pane-visible > .split-pane-side[side=start] { +.split-pane-ios.split-pane-visible > .split-pane-side { min-width: $split-pane-ios-side-min-width; max-width: $split-pane-ios-side-max-width; diff --git a/core/src/components/split-pane/split-pane.md.scss b/core/src/components/split-pane/split-pane.md.scss index fed364db08..49121cf37b 100644 --- a/core/src/components/split-pane/split-pane.md.scss +++ b/core/src/components/split-pane/split-pane.md.scss @@ -4,7 +4,7 @@ // Split Pane // -------------------------------------------------- -.split-pane-md.split-pane-visible > .split-pane-side[side=start] { +.split-pane-md.split-pane-visible > .split-pane-side { min-width: $split-pane-md-side-min-width; max-width: $split-pane-md-side-max-width; diff --git a/core/src/components/split-pane/split-pane.scss b/core/src/components/split-pane/split-pane.scss index c639a7a510..fbaf9a977d 100644 --- a/core/src/components/split-pane/split-pane.scss +++ b/core/src/components/split-pane/split-pane.scss @@ -39,7 +39,7 @@ display: none; } -.split-pane-visible > .split-pane-side[side=start] { +.split-pane-visible > .split-pane-side { order: -1; } diff --git a/core/src/components/split-pane/test/basic/index.html b/core/src/components/split-pane/test/basic/index.html index 8e6f2b173d..449262ed95 100644 --- a/core/src/components/split-pane/test/basic/index.html +++ b/core/src/components/split-pane/test/basic/index.html @@ -13,7 +13,7 @@ - +