padreug/web-app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor Home.vue to improve composer layout and scrolling behavior

Browse source 
- Updated the composer section to include a maximum height and overflow handling, enhancing usability by allowing users to scroll through the composer content.
- Maintained the existing functionality of the NoteComposer and RideshareComposer components, ensuring a seamless user experience.

These changes contribute to a more user-friendly interface within the Home component.
This commit is contained in:
padreug 2025-09-17 02:22:56 +02:00
parent 74e443184f
commit 8c39ca3599
1 changed files with 17 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/pages/Home.vue
View file

@ -38,22 +38,24 @@
<div class="flex-1 overflow-hidden">
<!-- Collapsible Composer -->
<div v-if="showComposer || replyTo" class="border-b bg-background">
<div class="px-4 py-3 sm:px-6">
<!-- Regular Note Composer -->
<NoteComposer
v-if="composerType === 'note' || replyTo"
:reply-to="replyTo"
@note-published="onNotePublished"
@clear-reply="onClearReply"
@close="onCloseComposer"
/>
<div class="max-h-[70vh] overflow-y-auto scrollbar-thin scrollbar-thumb-border scrollbar-track-transparent">
<div class="px-4 py-3 sm:px-6">
<!-- Regular Note Composer -->
<NoteComposer
v-if="composerType === 'note' || replyTo"
:reply-to="replyTo"
@note-published="onNotePublished"
@clear-reply="onClearReply"
@close="onCloseComposer"
/>
<!-- Rideshare Composer -->
<RideshareComposer
v-else-if="composerType === 'rideshare'"
@rideshare-published="onRidesharePublished"
@close="onCloseComposer"
/>
<!-- Rideshare Composer -->
<RideshareComposer
v-else-if="composerType === 'rideshare'"
@rideshare-published="onRidesharePublished"
@close="onCloseComposer"
/>
</div>
</div>
</div>