fix: wrong scrolling behavior in dialog (#313)

This commit is contained in:
Ayaka Rizumu 2022-12-04 14:27:08 +08:00 committed by GitHub
parent aab6eb6752
commit 218aefeec1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 43 additions and 32 deletions

View file

@ -159,7 +159,8 @@ const { isOverDropZone } = useDropZone(dropZoneRef, onDrop)
<div border="b dashed gray/40" />
</template>
<div flex gap-4>
<!-- The h-0 flex-1 here is to avoid the scrolling failure problem that occurs with flex layouts, so don't remove it unless you know what you're doing -->
<div flex gap-4 h-0 flex-1>
<NuxtLink w-12 h-12 :to="getAccountRoute(currentUser.account)">
<AccountAvatar :account="currentUser.account" f-full h-full />
</NuxtLink>
@ -179,11 +180,12 @@ const { isOverDropZone } = useDropZone(dropZoneRef, onDrop)
>
</div>
<div relative>
<!-- The h-0 flex-1 here is to avoid the scrolling failure problem that occurs with flex layouts, so don't remove it unless you know what you're doing -->
<div relative h-0 flex-1 flex flex-col>
<EditorContent
:editor="editor"
flex
:class="shouldExpanded ? 'min-h-120px max-h-720px of-y-auto' : ''"
:class="shouldExpanded ? 'min-h-30 md:max-h-[calc(100vh-200px)] sm:max-h-[calc(100vh-400px)] max-h-35 of-y-auto overscroll-contain' : ''"
/>
<div v-if="shouldExpanded" absolute right-0 bottom-0 pointer-events-none text-sm text-secondary-light>
{{ characterLimit - editor?.storage.characterCount.characters() }}