hj/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

visually combine subject and content into one input

Browse source
This commit is contained in:
Henry Jameson 2025-08-14 12:59:51 +03:00
commit 6e479d246b
3 changed files with 69 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/emoji_input/emoji_input.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div <div
ref="root" ref="root"
class="input emoji-input" class="emoji-input"
:class="{ 'with-picker': !hideEmojiButton }" :class="{ 'with-picker': !hideEmojiButton }"
> >
<slot <slot

4
src/components/post_status_form/post_status_form.scss
View file

@ -216,6 +216,10 @@
position: relative; position: relative;
} }
.subject-input {
border-bottom: 1px solid var(--border);
}
.character-counter { .character-counter {
position: absolute; position: absolute;
bottom: 0; bottom: 0;

7
src/components/post_status_form/post_status_form.vue
View file

@ -156,12 +156,13 @@
class="preview-status" class="preview-status"
/> />
</div> </div>
<div class="input">
<EmojiInput <EmojiInput
v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)" v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
v-model="newStatus.spoilerText" v-model="newStatus.spoilerText"
enable-emoji-picker enable-emoji-picker
:suggest="emojiSuggestor" :suggest="emojiSuggestor"
class="input form-control" class="input form-control subject-input unstyled"
> >
<template #default="inputProps"> <template #default="inputProps">
<input <input
@ -180,7 +181,7 @@
v-model="newStatus.status" v-model="newStatus.status"
:suggest="emojiUserSuggestor" :suggest="emojiUserSuggestor"
:placement="emojiPickerPlacement" :placement="emojiPickerPlacement"
class="input form-control main-input" class="input form-control main-input unstyled"
enable-sticker-picker enable-sticker-picker
enable-emoji-picker enable-emoji-picker
hide-emoji-button hide-emoji-button
@ -217,6 +218,7 @@
</p> </p>
</template> </template>
</EmojiInput> </EmojiInput>
</div>
<div <div
v-if="!disableScopeSelector" v-if="!disableScopeSelector"
class="visibility-tray" class="visibility-tray"
@ -238,6 +240,7 @@
v-model="newStatus.contentType" v-model="newStatus.contentType"
class="input form-control" class="input form-control"
:attrs="{ 'aria-label': $t('post_status.content_type_selection') }" :attrs="{ 'aria-label': $t('post_status.content_type_selection') }"
unstyled="true"
> >
<option <option
v-for="postFormat in postFormats" v-for="postFormat in postFormats"