feat(publish): increase input height when focused

zio/stable
三咲智子 2022-11-24 23:01:45 +08:00
parent 8283521092
commit 55aed591de
No known key found for this signature in database
GPG Key ID: 69992F2250DFD93E
2 changed files with 11 additions and 1 deletions

View File

@ -13,6 +13,6 @@ import { isPreviewHelpOpen, isPublishDialogOpen, isSigninDialogOpen, isUserSwitc
<HelpPreview />
</ModalDialog>
<ModalDialog v-model="isPublishDialogOpen">
<PublishWidget draft-key="dialog" min-w-180 p6 />
<PublishWidget draft-key="dialog" expanded min-w-180 p6 />
</ModalDialog>
</template>

View File

@ -6,12 +6,15 @@ const {
draftKey,
placeholder = 'What is on your mind?',
inReplyToId,
expanded: _expanded = false,
} = defineProps<{
draftKey: string
placeholder?: string
inReplyToId?: string
expanded?: boolean
}>()
const expanded = $ref(_expanded)
let isSending = $ref(false)
let { draft } = $(useDraft(draftKey, inReplyToId))
@ -123,9 +126,16 @@ onUnmounted(() => {
<textarea
v-model="draft.params.status"
:placeholder="placeholder"
h-80px
:class="expanded ? '!h-200px' : ''"
p2 border-rounded w-full bg-transparent
transition="height"
outline-none border="~ base"
@paste="handlePaste"
@focus="expanded = true"
@keydown.esc="expanded = false"
@keydown.ctrl.enter="publish"
@keydown.meta.enter="publish"
/>
<div flex="~ col gap-2" max-h-50vh overflow-auto>