From 117aa696eaa439bb082c7e5f77596262f48aadd9 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sun, 13 Feb 2022 16:35:53 +0900 Subject: [PATCH] =?UTF-8?q?fix(client):=20=E3=83=AA=E3=82=A2=E3=82=AF?= =?UTF-8?q?=E3=82=B7=E3=83=A7=E3=83=B3=E3=83=94=E3=83=83=E3=82=AB=E3=83=BC?= =?UTF-8?q?=E3=81=AE=E9=AB=98=E3=81=95=E3=81=8C=E4=BD=8E=E3=81=8F=E3=81=AA?= =?UTF-8?q?=E3=81=A3=E3=81=9F=E3=81=BE=E3=81=BE=E6=88=BB=E3=82=89=E3=81=AA?= =?UTF-8?q?=E3=81=84=E3=81=93=E3=81=A8=E3=81=8C=E3=81=82=E3=82=8B=E3=81=AE?= =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fix #8071 --- CHANGELOG.md | 8 +++++++ packages/client/src/components/ui/modal.vue | 23 +++++++++++++-------- 2 files changed, 22 insertions(+), 9 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 89f070909..677fb5698 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,14 @@ You should also include the user name that made the change. --> +## 12.x.x (unreleased) + +### Improvements +- + +### Bugfixes +- Client: リアクションピッカーの高さが低くなったまま戻らないことがあるのを修正 @syuilo + ## 12.107.0 (2022/02/12) ### Improvements diff --git a/packages/client/src/components/ui/modal.vue b/packages/client/src/components/ui/modal.vue index b42c0e4d4..c83453924 100644 --- a/packages/client/src/components/ui/modal.vue +++ b/packages/client/src/components/ui/modal.vue @@ -102,7 +102,6 @@ const align = () => { if (type.value === 'drawer') return; const popover = content.value!; - if (popover == null) return; const rect = props.src.getBoundingClientRect(); @@ -131,20 +130,23 @@ const align = () => { left = window.innerWidth - width; } + const underSpace = (window.innerHeight - MARGIN) - top; + const upperSpace = (rect.top - MARGIN); + // 画面から縦にはみ出る場合 if (top + height > (window.innerHeight - MARGIN)) { if (props.noOverlap) { - const underSpace = (window.innerHeight - MARGIN) - top; - const upperSpace = (rect.top - MARGIN); if (underSpace >= (upperSpace / 3)) { - maxHeight.value = underSpace; + maxHeight.value = underSpace; } else { - maxHeight.value = upperSpace; + maxHeight.value = upperSpace; top = (upperSpace + MARGIN) - height; } } else { top = (window.innerHeight - MARGIN) - height; } + } else { + maxHeight.value = underSpace; } } else { // 画面から横にはみ出る場合 @@ -152,20 +154,23 @@ const align = () => { left = window.innerWidth - width + window.pageXOffset - 1; } + const underSpace = (window.innerHeight - MARGIN) - (top - window.pageYOffset); + const upperSpace = (rect.top - MARGIN); + // 画面から縦にはみ出る場合 if (top + height - window.pageYOffset > (window.innerHeight - MARGIN)) { if (props.noOverlap) { - const underSpace = (window.innerHeight - MARGIN) - (top - window.pageYOffset); - const upperSpace = (rect.top - MARGIN); if (underSpace >= (upperSpace / 3)) { - maxHeight.value = underSpace; + maxHeight.value = underSpace; } else { - maxHeight.value = upperSpace; + maxHeight.value = upperSpace; top = window.pageYOffset + ((upperSpace + MARGIN) - height); } } else { top = (window.innerHeight - MARGIN) - height + window.pageYOffset - 1; } + } else { + maxHeight.value = underSpace; } }