zio
/
elk
2
0
Fork 0
Code Packages Releases 2 Activity

fix: placeholder for broken image urls and avoid overlowing emoji alt text (#327)

zio/stable
Daniel Roe 2022-12-04 14:14:12 +00:00 committed by GitHub
parent e75cc9edf2
commit 8f32b1ce22
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/account/AccountAvatar.vue
View File

@ -6,17 +6,19 @@ defineProps<{
}>() }>()
const loaded = $ref(false) const loaded = $ref(false)
const error = $ref(false)
</script> </script>
<template> <template>
<img <img
:key="account.avatar" :key="account.avatar"
:src="account.avatar" :src="error ? 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7' : account.avatar"
:alt="$t('account.avatar_description', [account.username])" :alt="$t('account.avatar_description', [account.username])"
loading="lazy" loading="lazy"
rounded-full rounded-full
:class="loaded ? 'bg-gray' : 'bg-gray:10'" :class="loaded ? 'bg-gray' : 'bg-gray:10'"
v-bind="$attrs" v-bind="$attrs"
@load="loaded = true" @load="loaded = true"
@error="error = true"
> >
</template> </template>

1
styles/global.css
View File

@ -43,6 +43,7 @@ body {
.custom-emoji { .custom-emoji {
display: inline-block; display: inline-block;
overflow: hidden;
max-height: 1.3em; max-height: 1.3em;
max-width: 1.3em; max-width: 1.3em;
vertical-align: text-bottom; vertical-align: text-bottom;