diff options
author | Paul Tirk <paultirk@paultirk.com> | 2023-10-28 22:45:35 +0200 |
---|---|---|
committer | Sean Molenaar <SMillerDev@users.noreply.github.com> | 2023-11-07 20:01:54 +0100 |
commit | 940bcb3dcc3bfe2fcbb048d145e383b15343cb4f (patch) | |
tree | 4935ed10e9b65cd01f27bc61f5fd6d0b05fdd73a /src | |
parent | 4844e1da4950f40ac1224dee25f92eb76e310a64 (diff) |
use favicon as link to feed item
Signed-off-by: Paul Tirk <paultirk@paultirk.com>
Diffstat (limited to 'src')
-rw-r--r-- | src/components/feed-display/FeedItemRow.vue | 18 |
1 files changed, 13 insertions, 5 deletions
diff --git a/src/components/feed-display/FeedItemRow.vue b/src/components/feed-display/FeedItemRow.vue index 4bea3d45f..db467202b 100644 --- a/src/components/feed-display/FeedItemRow.vue +++ b/src/components/feed-display/FeedItemRow.vue @@ -8,10 +8,13 @@ :href="item.url" :title="t('news', 'Open website')" @click="markRead(item); $event.stopPropagation();"> - <EarthIcon /> + <span + v-if="getFeed(item.feedId).faviconLink" + class="favicon" + :style="{ 'backgroundImage': 'url(' + getFeed(item.feedId).faviconLink + ')' }" + /> + <RssIcon v-else /> </a> - <RssIcon v-if="!getFeed(item.feedId).faviconLink" /> - <span v-if="getFeed(item.feedId).faviconLink" style="width: 24px; background-size: contain;" :style="{ 'backgroundImage': 'url(' + getFeed(item.feedId).faviconLink + ')' }" /> </div> <div class="title-container" :class="{ 'unread': item.unread }"> <span style="white-space: nowrap" :dir="item.rtl && 'rtl'"> @@ -45,7 +48,6 @@ import Vue from 'vue' import { mapState } from 'vuex' -import EarthIcon from 'vue-material-design-icons/Earth.vue' import StarIcon from 'vue-material-design-icons/Star.vue' import EyeIcon from 'vue-material-design-icons/Eye.vue' import EyeCheckIcon from 'vue-material-design-icons/EyeCheck.vue' @@ -65,7 +67,6 @@ import { ACTIONS, MUTATIONS } from '../../store' export default Vue.extend({ name: 'FeedItemRow', components: { - EarthIcon, StarIcon, EyeIcon, EyeCheckIcon, @@ -171,6 +172,13 @@ export default Vue.extend({ align-self: start; } + .favicon { + height: 24px; + width: 24px; + display: inline-block; + background-size: contain; + } + .feed-item-row .title-container { color: var(--color-text-lighter); |