diff options
| author | dakkar <dakkar@thenautilus.net> | 2024-11-22 10:40:55 +0000 |
|---|---|---|
| committer | dakkar <dakkar@thenautilus.net> | 2024-11-22 10:40:55 +0000 |
| commit | 9bf18546fc3688480ca66e8dfc1dffabef087748 (patch) | |
| tree | fa16049dde7ff530342f4a8a1f6ecc3da015a5d5 /packages/frontend/src/scripts | |
| parent | merge: Don't preview URLs to blocked hosts (!751) (diff) | |
| parent | Set horizontal margin for even better consistency (diff) | |
| download | sharkey-9bf18546fc3688480ca66e8dfc1dffabef087748.tar.gz sharkey-9bf18546fc3688480ca66e8dfc1dffabef087748.tar.bz2 sharkey-9bf18546fc3688480ca66e8dfc1dffabef087748.zip | |
merge: keep popup elements on screen (!744)
View MR for information: https://activitypub.software/TransFem-org/Sharkey/-/merge_requests/744
Approved-by: dakkar <dakkar@thenautilus.net>
Approved-by: Marie <github@yuugi.dev>
Approved-by: Hazelnoot <acomputerdog@gmail.com>
Diffstat (limited to 'packages/frontend/src/scripts')
| -rw-r--r-- | packages/frontend/src/scripts/popup-position.ts | 14 |
1 files changed, 12 insertions, 2 deletions
diff --git a/packages/frontend/src/scripts/popup-position.ts b/packages/frontend/src/scripts/popup-position.ts index 3dad41a8b3..be49532cf8 100644 --- a/packages/frontend/src/scripts/popup-position.ts +++ b/packages/frontend/src/scripts/popup-position.ts @@ -15,6 +15,8 @@ export function calcPopupPosition(el: HTMLElement, props: { const contentWidth = el.offsetWidth; const contentHeight = el.offsetHeight; + const HORIZONTAL_MARGIN = 1; + let rect: DOMRect; if (props.anchorElement) { @@ -36,9 +38,11 @@ export function calcPopupPosition(el: HTMLElement, props: { left -= (el.offsetWidth / 2); if (left + contentWidth - window.scrollX > window.innerWidth) { - left = window.innerWidth - contentWidth + window.scrollX - 1; + left = window.innerWidth - contentWidth + window.scrollX - HORIZONTAL_MARGIN; } + left = Math.max(HORIZONTAL_MARGIN, left); + return [left, top]; }; @@ -57,9 +61,11 @@ export function calcPopupPosition(el: HTMLElement, props: { left -= (el.offsetWidth / 2); if (left + contentWidth - window.scrollX > window.innerWidth) { - left = window.innerWidth - contentWidth + window.scrollX - 1; + left = window.innerWidth - contentWidth + window.scrollX - HORIZONTAL_MARGIN; } + left = Math.max(HORIZONTAL_MARGIN, left); + return [left, top]; }; @@ -75,6 +81,8 @@ export function calcPopupPosition(el: HTMLElement, props: { top = props.y; } + left = Math.max(HORIZONTAL_MARGIN, left); + top -= (el.offsetHeight / 2); if (top + contentHeight - window.scrollY > window.innerHeight) { @@ -106,6 +114,8 @@ export function calcPopupPosition(el: HTMLElement, props: { top -= (el.offsetHeight / 2); } + left = Math.max(HORIZONTAL_MARGIN, left); + if (top + contentHeight - window.scrollY > window.innerHeight) { top = window.innerHeight - contentHeight + window.scrollY - 1; } |