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

fix(popover): update placement per md spec (#17429)

Browse Source
This commit is contained in:
Asif Rahman
2019-02-27 16:45:06 -05:00
committed by Liam DeBeasi
parent 484d92cd50
commit a99d17952b
1 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
core/src/components/popover/animations/md.enter.ts
View File

@ -22,9 +22,10 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement, ev?
const targetDim = const targetDim =
ev && ev.target && (ev.target as HTMLElement).getBoundingClientRect(); ev && ev.target && (ev.target as HTMLElement).getBoundingClientRect();
// As per MD spec, by default position the popover below the target (trigger) element
const targetTop = const targetTop =
targetDim != null && 'top' in targetDim targetDim != null && 'bottom' in targetDim
? targetDim.top ? targetDim.bottom
: bodyHeight / 2 - contentHeight / 2; : bodyHeight / 2 - contentHeight / 2;
const targetLeft = const targetLeft =
@ -60,7 +61,7 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement, ev?
targetTop + targetHeight + contentHeight > bodyHeight && targetTop + targetHeight + contentHeight > bodyHeight &&
targetTop - contentHeight > 0 targetTop - contentHeight > 0
) { ) {
popoverCSS.top = targetTop - contentHeight; popoverCSS.top = targetTop - contentHeight - targetHeight;
baseEl.className = baseEl.className + ' popover-bottom'; baseEl.className = baseEl.className + ' popover-bottom';
originY = 'bottom'; originY = 'bottom';
// If there isn't room for it to pop up above the target cut it off // If there isn't room for it to pop up above the target cut it off