diff options
author | Marco Ambrosini <marcoambrosini@pm.me> | 2019-10-17 17:03:13 +0300 |
---|---|---|
committer | Marco Ambrosini <marcoambrosini@pm.me> | 2019-10-17 19:04:14 +0300 |
commit | e12d1a0d4f7e4ee521af3bbf6ff04612f019ca25 (patch) | |
tree | 8f8b18c99377c0005295129af7411eafa9da0702 /src/components/MessagesList/MessagesGroup/MessagesGroup.vue | |
parent | 6a79f50e1956686963c941488cc4d46ea78913d9 (diff) |
Add sticky avatar
Signed-off-by: Marco Ambrosini <marcoambrosini@pm.me>
Diffstat (limited to 'src/components/MessagesList/MessagesGroup/MessagesGroup.vue')
-rw-r--r-- | src/components/MessagesList/MessagesGroup/MessagesGroup.vue | 11 |
1 files changed, 6 insertions, 5 deletions
diff --git a/src/components/MessagesList/MessagesGroup/MessagesGroup.vue b/src/components/MessagesList/MessagesGroup/MessagesGroup.vue index b3bc0aefd..cd363daa0 100644 --- a/src/components/MessagesList/MessagesGroup/MessagesGroup.vue +++ b/src/components/MessagesList/MessagesGroup/MessagesGroup.vue @@ -29,8 +29,9 @@ </div> <div class="messages"> <Message - v-for="message of messages" + v-for="(message, index) of messages" v-bind="message" + :isFirstMessage="index === 0" :key="message.id" :hover="hover" :actor-display-name="actorDisplayName" @@ -103,17 +104,17 @@ export default { } .messages { + flex: auto; display: flex; padding: 8px 0 8px 0; flex-direction: column; &__avatar { min-height: 100%; - width: 52px; - min-width: 52px; - padding: 4px 8px 0 8px; + flex: 0 0 52px; + padding: 20px 8px 10px 8px; &__icon { position: sticky; - top: 16px; + top: 12px; } } } |