diff options
| author | Marco Ambrosini <marcoambrosini@pm.me> | 2019-10-17 17:51:14 +0300 |
|---|---|---|
| committer | Marco Ambrosini <marcoambrosini@pm.me> | 2019-10-17 19:04:14 +0300 |
| commit | ba9c2727426e3ebc7fb676bc7dc06968582cc568 (patch) | |
| tree | 40df4211366e7686f7e72b8c5ff40669e33d6810 | |
| parent | e12d1a0d4f7e4ee521af3bbf6ff04612f019ca25 (diff) | |
Fix temporary message
Signed-off-by: Marco Ambrosini <marcoambrosini@pm.me>
| -rw-r--r-- | src/assets/variables.scss | 2 | ||||
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/Message.vue | 13 | ||||
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/MessagesGroup.vue | 16 | ||||
| -rw-r--r-- | src/components/NewMessageForm/NewMessageForm.vue | 5 |
4 files changed, 17 insertions, 19 deletions
diff --git a/src/assets/variables.scss b/src/assets/variables.scss index c41b8e06d..6282c672f 100644 --- a/src/assets/variables.scss +++ b/src/assets/variables.scss @@ -57,4 +57,4 @@ $navigation-width: 300px; $breakpoint-mobile: 1024px; //message width -$message-width: 650px; +$message-width: 600px; diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.vue b/src/components/MessagesList/MessagesGroup/Message/Message.vue index 70369ea59..21138d19f 100644 --- a/src/components/MessagesList/MessagesGroup/Message/Message.vue +++ b/src/components/MessagesList/MessagesGroup/Message/Message.vue @@ -37,9 +37,9 @@ the main body of the message as well as a quote. <div class="message__main__text"> <p>{{ message }}</p> </div> - <div v-show="isTemporary" class="message__main__right icon-loading-small" /> - <div v-show="!isTemporary" class="message__main__right"> - <h6>{{ messageTime }}</h6> + <div class="message__main__right"> + <div v-show="isTemporary" class="icon-loading-small" /> + <h6 v-show="!isTemporary">{{ messageTime }}</h6> <Actions v-show="hover" class="message__main__right__actions"> <ActionButton icon="icon-delete" @click="handleDelete"> Delete @@ -148,14 +148,17 @@ export default { } } &__right { - flex: 0 0 150px; + justify-self: flex-start; + position: relative; + flex: 0 0 110px; display: flex; color: var(--color-text-maxcontrast); font-size: 13px; padding: 0 8px 0 8px; &__actions { position: absolute; - margin: -10px 0 0 60px + top: -50%; + right: 0; } } } diff --git a/src/components/MessagesList/MessagesGroup/MessagesGroup.vue b/src/components/MessagesList/MessagesGroup/MessagesGroup.vue index cd363daa0..b93ab5c72 100644 --- a/src/components/MessagesList/MessagesGroup/MessagesGroup.vue +++ b/src/components/MessagesList/MessagesGroup/MessagesGroup.vue @@ -35,7 +35,7 @@ :key="message.id" :hover="hover" :actor-display-name="actorDisplayName" - :isTemporary="isTemporary" /> + :isTemporary="message.timestamp === 0" /> </div> </div> </template> @@ -82,9 +82,6 @@ export default { */ actorDisplayName() { return this.messages[0].actorDisplayName - }, - isTemporary() { - return this.messages[0].timestamp === 0 } } } @@ -109,13 +106,10 @@ export default { padding: 8px 0 8px 0; flex-direction: column; &__avatar { - min-height: 100%; - flex: 0 0 52px; - padding: 20px 8px 10px 8px; - &__icon { - position: sticky; - top: 12px; - } + position: sticky; + top: 0px; + height: 52px; + padding: 20px 10px 10px 10px; } } </style> diff --git a/src/components/NewMessageForm/NewMessageForm.vue b/src/components/NewMessageForm/NewMessageForm.vue index 06dfd314b..6aa92f1dc 100644 --- a/src/components/NewMessageForm/NewMessageForm.vue +++ b/src/components/NewMessageForm/NewMessageForm.vue @@ -68,9 +68,10 @@ export default { const message = Object.assign({}, { id: this.createTemporaryMessageId(), actorDisplayName: OC.getCurrentUser().displayName, - actorId: OC.getCurrentUser().Id, + actorId: OC.getCurrentUser().uid, message: this.text, - token: this.token + token: this.token, + timestamp: 0 }) return message }, |