BottomSheet: design update

This commit is contained in:
10G Meow 2025-10-19 14:05:29 +03:00
parent 47b4260761
commit afc6fb0a33
5 changed files with 48 additions and 171 deletions

View file

@ -28,8 +28,8 @@
<RoomUpgradePrompt v-if="roomUpgradeInfo" :roomId="roomId" :urgent="roomUpgradeInfo.urgent" :version="roomUpgradeInfo.version" />
<SendAttachmentsLayout
v-if="room && useFileModeNonAdmin"
<SendAttachmentsLayout
v-if="room && useFileModeNonAdmin"
:room="room"
v-on:pick-file="showAttachmentPicker(false)"
v-on:add-files="(files) => addAttachments(files)"
@ -42,24 +42,24 @@
<div v-if="!useVoiceMode && !useFileModeNonAdmin" :class="{'chat-content': true, 'flex-grow-1': true, 'flex-shrink-1': true, 'invisible': !initialLoadDone}" ref="chatContainer"
v-on:scroll="onScroll" @click="closeContextMenusIfOpen">
<div ref="messageOperationsStrut" class="message-operations-strut">
<component :is="messageOperationsComponent" ref="messageOperations" :style="opStyle"
v-if="showMessageOperations"
v-on:close="showContextMenu = false;"
:emojis="recentEmojis"
:originalEvent="selectedEvent"
<component :is="messageOperationsComponent" ref="messageOperations" :style="opStyle"
v-if="showMessageOperations"
v-on:close="showContextMenu = false;"
:emojis="recentEmojis"
:originalEvent="selectedEvent"
:timelineSet="timelineSet"
v-on:pin="pin(selectedEvent)"
v-on:unpin="unpin(selectedEvent)"
v-on:addreaction="addReaction"
v-on:addreaction="addReaction"
v-on:addquickreaction="addQuickReaction"
v-on:addreply="addReply(selectedEvent)"
v-on:edit="edit(selectedEvent)"
v-on:addreply="addReply(selectedEvent)"
v-on:edit="edit(selectedEvent)"
v-on:redact="redact(selectedEvent)"
v-on:download="download(selectedEvent)"
v-on:download="download(selectedEvent)"
v-on:more="
isEmojiQuickReaction=true;
showMoreMessageOperations({event: selectedEvent, anchor: $event.anchor})
"
"
:userCanSendReactionAndAnswerPoll="$matrix.userCanSendReactionAndAnswerPollInCurrentRoom"
:userCanSendMessage="$matrix.userCanSendMessageInCurrentRoom"
:userCanPin="canCreatePoll"
@ -75,7 +75,7 @@
<WelcomeHeaderChannelUser v-if="retentionTimer && !roomWelcomeHeader && newlyJoinedRoom" />
<div v-for="(event) in filteredEvents" :key="event.getId()" :eventId="event !== ROOM_READ_MARKER_EVENT_PLACEHOLDER ? event.getId() : undefined">
<!-- DAY Marker, shown for every new day in the timeline -->
<div v-if="!reverseOrder && showDayMarkerBeforeEvent(event) && !!event.component && event !== ROOM_READ_MARKER_EVENT_PLACEHOLDER" class="day-marker"><div class="line"></div><div class="text">{{ dayForEvent(event) }}</div><div class="line"></div></div>
@ -234,8 +234,8 @@
accept="image/*,audio/*,video/*,.mp3,.mp4,.wav,.m4a,.pdf,application/pdf,.apk,application/vnd.android.package-archive,.ipa,.zip,application/zip,application/x-zip-compressed,multipart/x-zip" class="d-none" multiple/>
</form>
<SendAttachmentsLayout
v-if="uploadBatch && uploadBatch.attachments.length > 0 && !useFileModeNonAdmin"
<SendAttachmentsLayout
v-if="uploadBatch && uploadBatch.attachments.length > 0 && !useFileModeNonAdmin"
:room="room"
v-on:pick-file="showAttachmentPicker(false)"
v-on:add-files="(files) => addAttachments(files)"
@ -244,15 +244,15 @@
:title="room.name"
/>
<BottomSheet ref="messageOperationsSheet" halfY="0.1">
<EmojiPicker ref="emojiPicker"
<BottomSheet ref="messageOperationsSheet">
<EmojiPicker ref="emojiPicker"
:native="true"
@select="emojiSelected"
:additional-groups="additionalEmojiGroups"
:group-names="emojiGroupNames"
@select="emojiSelected"
:additional-groups="additionalEmojiGroups"
:group-names="emojiGroupNames"
:group-icons="additionalEmojiGroupIcons"
:group-order="['recently_used']"
disable-skin-tones
disable-skin-tones
:static-texts="{ placeholder: $t('emoji.search')}"/>
</BottomSheet>
@ -885,7 +885,7 @@ export default {
var rectOps = this.$refs.messageOperations.$el.getBoundingClientRect();
if (this.room.displayType == ROOM_TYPE_CHANNEL) {
top = rectAnchor.top - rectChat.top;
let right = rectChat.right - rectAnchor.right;
let right = rectChat.right - rectAnchor.right;
this.opStyle = "top:" + top + "px;right:" + right + "px";
return;
} else {
@ -994,7 +994,7 @@ export default {
onRoomJoined(initialEventId) {
// If our own join event is less than a minute old, consider this a "newly joined" room.
//
//
// Previously tried to look at initialEventId, but it seems like "this.room.getEventReadUpTo(this.$matrix.currentUserId, false)"
// always returns an event id? Strange. I would expect it to be null on a fresh room.
//
@ -1101,8 +1101,8 @@ export default {
this.$navigation.push(
{
name: "Join",
params: {
roomId: util.sanitizeRoomId(this.roomAliasOrId),
params: {
roomId: util.sanitizeRoomId(this.roomAliasOrId),
join: this.$route.params.join
},
query: this.$route.query