fix: 💄 Make sure avatars never shrink in flex containers

This commit is contained in:
Jesse Wierzbinski 2024-05-02 17:28:31 -10:00
parent eb0385ab8a
commit 8eaccb31c2
No known key found for this signature in database
5 changed files with 8 additions and 7 deletions

View file

@ -1,7 +1,7 @@
<template>
<div v-if="small" class="flex flex-row">
<Skeleton :enabled="!note" shape="rect" class="!h-6 w-6">
<NuxtLink :href="accountUrl">
<NuxtLink :href="accountUrl" class="shrink-0">
<img class="h-6 w-6 rounded ring-1 ring-white/5 shrink-0" :src="note?.account.avatar"
:alt="`${note?.account.acct}'s avatar`" />
</NuxtLink>
@ -24,7 +24,7 @@
</div>
<div v-else class="flex flex-row">
<Skeleton :enabled="!note" shape="rect" class="!h-12 w-12">
<NuxtLink :href="accountUrl">
<NuxtLink :href="accountUrl" class="shrink-0">
<img class="h-12 w-12 rounded ring-1 ring-white/5" :src="note?.account.avatar"
:alt="`${note?.account.acct}'s avatar`" />
</NuxtLink>
@ -46,7 +46,7 @@
<span class="text-gray-400 text-sm line-clamp-1 break-all w-full">
<Skeleton :enabled="!note" :min-width="130" :max-width="250" shape="rect">
@{{
note?.account.acct
note?.account.acct
}}
</Skeleton>
</span>

View file

@ -8,7 +8,7 @@
<Skeleton :enabled="!loaded" shape="rect" class="!h-6" :min-width="40" :max-width="100" width-unit="%">
<Icon name="tabler:repeat" class="h-6 w-6" aria-hidden="true" />
<img v-if="reblog.avatar" :src="reblog.avatar" :alt="`${reblog.acct}'s avatar'`"
class="h-6 w-6 rounded ring-1 ring-white/10" />
class="h-6 w-6 rounded shrink-0 ring-1 ring-white/10" />
<span><strong v-html="reblogDisplayName"></strong> reblogged</span>
</Skeleton>
</div>