diff options
| author | tess <me@thvxl.se> | 2024-11-12 22:09:37 +0100 |
|---|---|---|
| committer | tess <me@thvxl.se> | 2024-11-12 22:09:37 +0100 |
| commit | 68e5b5a84a8ea088f7375eb1056218c4bcf2b05a (patch) | |
| tree | be3354742921530ba53cd8faf098afd8200e5b66 | |
| parent | tweak popup left margin for consistency (diff) | |
| download | sharkey-68e5b5a84a8ea088f7375eb1056218c4bcf2b05a.tar.gz sharkey-68e5b5a84a8ea088f7375eb1056218c4bcf2b05a.tar.bz2 sharkey-68e5b5a84a8ea088f7375eb1056218c4bcf2b05a.zip | |
Set horizontal margin for even better consistency
| -rw-r--r-- | packages/frontend/src/components/MkUserPopup.vue | 2 | ||||
| -rw-r--r-- | packages/frontend/src/scripts/popup-position.ts | 14 |
2 files changed, 8 insertions, 8 deletions
diff --git a/packages/frontend/src/components/MkUserPopup.vue b/packages/frontend/src/components/MkUserPopup.vue index e98a8b85e9..4ae23de62c 100644 --- a/packages/frontend/src/components/MkUserPopup.vue +++ b/packages/frontend/src/components/MkUserPopup.vue @@ -119,7 +119,7 @@ onMounted(() => { } const rect = props.source.getBoundingClientRect(); - const x = Math.max(2, ((rect.left + (props.source.offsetWidth / 2)) - (300 / 2)) + window.scrollX); + const x = Math.max(1, ((rect.left + (props.source.offsetWidth / 2)) - (300 / 2)) + window.scrollX); const y = rect.top + props.source.offsetHeight + window.scrollY; top.value = y; diff --git a/packages/frontend/src/scripts/popup-position.ts b/packages/frontend/src/scripts/popup-position.ts index 187896b0e5..be49532cf8 100644 --- a/packages/frontend/src/scripts/popup-position.ts +++ b/packages/frontend/src/scripts/popup-position.ts @@ -15,7 +15,7 @@ export function calcPopupPosition(el: HTMLElement, props: { const contentWidth = el.offsetWidth; const contentHeight = el.offsetHeight; - const LEFT_MARGIN = 2; + const HORIZONTAL_MARGIN = 1; let rect: DOMRect; @@ -38,10 +38,10 @@ 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(LEFT_MARGIN, left); + left = Math.max(HORIZONTAL_MARGIN, left); return [left, top]; }; @@ -61,10 +61,10 @@ 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(LEFT_MARGIN, left); + left = Math.max(HORIZONTAL_MARGIN, left); return [left, top]; }; @@ -81,7 +81,7 @@ export function calcPopupPosition(el: HTMLElement, props: { top = props.y; } - left = Math.max(LEFT_MARGIN, left); + left = Math.max(HORIZONTAL_MARGIN, left); top -= (el.offsetHeight / 2); @@ -114,7 +114,7 @@ export function calcPopupPosition(el: HTMLElement, props: { top -= (el.offsetHeight / 2); } - left = Math.max(LEFT_MARGIN, left); + left = Math.max(HORIZONTAL_MARGIN, left); if (top + contentHeight - window.scrollY > window.innerHeight) { top = window.innerHeight - contentHeight + window.scrollY - 1; |