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

fix: top and bottom padding of small preview card on mobile (#974)

zio/stable
Ayo Ayco 2023-01-11 20:08:15 +01:00 committed by GitHub
parent c1e89582f8
commit 689ae0c701
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/status/StatusPreviewCard.vue
View File

@ -54,7 +54,7 @@ const cardTypeIconMap: Record<mastodon.v1.PreviewCardType, string> = {
flex flex-col flex flex-col
display-block of-hidden display-block of-hidden
:class="{ :class="{
'sm:(min-w-32 w-32 h-32) min-w-22 w-22 h-22': isSquare, 'sm:(min-w-32 w-32 h-32) min-w-24 w-24 h-24': isSquare,
'w-full aspect-[1.91]': !isSquare, 'w-full aspect-[1.91]': !isSquare,
'rounded-lg': root, 'rounded-lg': root,
}" }"
@ -70,13 +70,13 @@ const cardTypeIconMap: Record<mastodon.v1.PreviewCardType, string> = {
</div> </div>
<div <div
v-else v-else
min-w-22 w-22 h-22 sm="min-w-32 w-32 h-32" bg="slate-500/10" flex justify-center items-center min-w-24 w-24 h-24 sm="min-w-32 w-32 h-32" bg="slate-500/10" flex justify-center items-center
:class="[ :class="[
root ? 'rounded-lg' : '', root ? 'rounded-lg' : '',
]" ]"
> >
<div :class="cardTypeIconMap[card.type]" w="30%" h="30%" text-secondary /> <div :class="cardTypeIconMap[card.type]" w="30%" h="30%" text-secondary />
</div> </div>
<StatusPreviewCardInfo :root="root" :card="card" :provider="providerName" /> <StatusPreviewCardInfo :p="isSquare ? 'x-4' : '4'" :root="root" :card="card" :provider="providerName" />
</NuxtLink> </NuxtLink>
</template> </template>

4
components/status/StatusPreviewCardInfo.vue
View File

@ -12,12 +12,12 @@ defineProps<{
<template> <template>
<div <div
p4 max-h-2xl max-h-2xl
flex flex-col flex flex-col
my-auto
:class="[ :class="[
root ? 'flex-gap-1' : 'justify-center sm:justify-start', root ? 'flex-gap-1' : 'justify-center sm:justify-start',
]" ]"
my-auto
> >
<p text-secondary ws-pre-wrap break-all line-clamp-1> <p text-secondary ws-pre-wrap break-all line-clamp-1>
{{ provider }} {{ provider }}