diff options
| author | Louis Chemineau <louis@chmn.me> | 2023-04-20 10:39:08 +0200 |
|---|---|---|
| committer | Louis Chemineau <louis@chmn.me> | 2023-04-20 16:41:02 +0200 |
| commit | 91347226ae34f0152276285e85e2b885b3361785 (patch) | |
| tree | 597773fed9de74094efa9bed3dce16ae74665020 | |
| parent | 6879d1cd72e024827c684615ac1244e927a4abc3 (diff) | |
Rework reblog style
Signed-off-by: Louis Chemineau <louis@chmn.me>
| -rw-r--r-- | src/components/TimelineEntry.vue | 51 |
1 files changed, 14 insertions, 37 deletions
diff --git a/src/components/TimelineEntry.vue b/src/components/TimelineEntry.vue index 80812f1a..927e41cf 100644 --- a/src/components/TimelineEntry.vue +++ b/src/components/TimelineEntry.vue @@ -21,13 +21,12 @@ </span> </div> <template v-else-if="isBoost"> - <div class="container-icon-boost boost"> - <span class="icon-boost" /> - </div> <div class="boost"> + <Repeat :size="16" /> <router-link :to="{ name: 'profile', params: { account: item.account.acct } }"> + <img :src="item.account.avatar"> <span :title="item.account.acct" class="post-author"> - {{ item.account.display_name }} + {{ item.account.display_name }}  </span> </router-link> {{ t('social', 'boosted') }} @@ -50,7 +49,6 @@ <script> import Bell from 'vue-material-design-icons/Bell.vue' import Repeat from 'vue-material-design-icons/Repeat.vue' -import Reply from 'vue-material-design-icons/Reply.vue' import Heart from 'vue-material-design-icons/Heart.vue' import { translate } from '@nextcloud/l10n' import moment from '@nextcloud/moment' @@ -67,7 +65,6 @@ export default { UserEntry, Bell, Repeat, - Reply, Heart, }, props: { @@ -191,7 +188,6 @@ export default { width: 32px; border-radius: 50%; overflow: hidden; - margin-right: 3px; vertical-align: middle; margin-top: -1px; margin-right: 8px; @@ -228,36 +224,17 @@ export default { } } - .icon-boost { - display: inline-block; - vertical-align: middle; - } - - .icon-favorite { - display: inline-block; - vertical-align: middle; - } - - .icon-user { - display: inline-block; - vertical-align: middle; - } - - .container-icon-boost { - display: inline-block; - padding-right: 6px; - } - - .icon-boost { - display: inline-block; - width: 38px; - height: 17px; - opacity: .5; - background-position: right center; - vertical-align: middle; - } - .boost { - opacity: .5; + color: var(--color-text-lighter); + display: flex; + margin-left: 21px; // To align with status' text. + + img { + width: 16px; + border-radius: 50%; + vertical-align: middle; + margin-top: -4px; + margin-left: 4px; + } } </style> |