fix: Optimize rendering a little

This commit is contained in:
Jesse Wierzbinski 2024-04-29 11:21:50 -10:00
parent 55ca97e936
commit ccd2307584
No known key found for this signature in database
3 changed files with 5 additions and 5 deletions

View file

@ -1,5 +1,5 @@
<template> <template>
<div class="flex flex-col p-10 gap-4"> <div class="flex flex-col p-10 gap-4 h-full">
<div <div
class="aspect-video shrink-0 w-full rounded ring-white/5 bg-dark-800 shadow overflow-hidden ring-1 hover:ring-2 duration-100"> class="aspect-video shrink-0 w-full rounded ring-white/5 bg-dark-800 shadow overflow-hidden ring-1 hover:ring-2 duration-100">
<img class="object-cover w-full h-full duration-150 hover:scale-[102%] ease-in-out" v-if="instance?.banner" <img class="object-cover w-full h-full duration-150 hover:scale-[102%] ease-in-out" v-if="instance?.banner"
@ -7,7 +7,7 @@
</div> </div>
<div class="prose prose-invert prose-sm"> <div class="prose prose-invert prose-sm">
<h2 class="text-center mb-10">{{ instance?.title }}</h2> <h1 class="text-center mb-10 mt-5">{{ instance?.title }}</h1>
<div v-html="description?.content"></div> <div v-html="description?.content"></div>
</div> </div>

View file

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

View file

@ -14,7 +14,7 @@
</div> </div>
<SocialElementsNotesHeader :note="note" :small="small" /> <SocialElementsNotesHeader :note="note" :small="small" />
<div v-if="!collapsed"> <div v-if="!collapsed">
<NuxtLink :href="url" class="mt-6 block relative"> <NuxtLink :href="url" class="mt-6 block relative" aria-label="Link to note">
<Skeleton :enabled="!props.note || !loaded" :min-width="50" :max-width="100" width-unit="%" shape="rect" <Skeleton :enabled="!props.note || !loaded" :min-width="50" :max-width="100" width-unit="%" shape="rect"
type="content"> type="content">
<div v-if="content" <div v-if="content"