diff --git a/src/components/AddressList.vue b/src/components/AddressList.vue index 963dfe2b985d26d2e1917971760c3dc4280c358e..4179c8443eed5124798f5dfcd5cace0d6604750a 100644 --- a/src/components/AddressList.vue +++ b/src/components/AddressList.vue @@ -2,8 +2,8 @@ <span> <template v-for="(entry, idx) in entries"> <Address :key="entry.email" :email="entry.email" :label="entry.label" /><!-- - --><span v-if="idx === entries.length - 2" :key="entry.email">{{ t('mail', 'and') }}</span><!-- - --><span v-else-if="idx + 1 < entries.length" :key="entry.email">, </span> + --><span v-if="idx === entries.length - 2" :key="'split' + entry.email">{{ t('mail', 'and') }}</span><!-- + --><span v-else-if="idx + 1 < entries.length" :key="'split' + entry.email">, </span> </template> </span> </template> diff --git a/src/components/ThreadEnvelope.vue b/src/components/ThreadEnvelope.vue index 884d2cfa2c84ef2eb10685d1f7343c6283eff5c1..ed0055604f4af43d1c1f02c8f1702feb7e13ebf4 100644 --- a/src/components/ThreadEnvelope.vue +++ b/src/components/ThreadEnvelope.vue @@ -21,7 +21,12 @@ <template> <div> - <div class="icon-mail"> + <div> + <Avatar v-if="envelope.from && envelope.from[0]" + :email="envelope.from[0].email" + :display-name="envelope.from[0].label" + :disable-tooltip="true" + :size="25" /> <router-link :to="route" event="" @@ -95,7 +100,6 @@ :data="error" /> </div> </template> - <script> import Actions from '@nextcloud/vue/dist/Components/Actions' import ActionButton from '@nextcloud/vue/dist/Components/ActionButton' @@ -105,6 +109,7 @@ import Loading from './Loading' import logger from '../logger' import Message from './Message' import Moment from './Moment' +import Avatar from './Avatar' import { buildRecipients as buildReplyRecipients } from '../ReplyBuilder' import { generateUrl } from '@nextcloud/router' @@ -117,6 +122,7 @@ export default { Loading, Moment, Message, + Avatar, }, props: { envelope: { @@ -285,25 +291,6 @@ export default { </script> <style lang="scss" scoped> -.icon-mail { - background-image: var(--icon-mail-000); - background-position: 0 center; - - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - - border-bottom: 1px solid var(--color-primary-light); - padding-left: 30px; - margin-bottom: 15px; - horiz-align: center; - opacity: 0.7; - - &:hover { - opacity: 1; - } - .sender { font-weight: bold; } @@ -321,5 +308,4 @@ export default { margin-left: 4px; } } -} </style>