refactor: improve status card UI (#28)
This commit is contained in:
parent
8f54b6db2e
commit
074da4768e
|
@ -46,19 +46,19 @@ const createdAt = $computed(() => {
|
|||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div text-4 text-gray-3 v-html="account.note" />
|
||||
<div text-4 text-gray v-html="account.note" />
|
||||
</div>
|
||||
<div flex flex-col gap-1>
|
||||
<div flex flex-col rounded p3 class="bg-purple/10">
|
||||
<p text-gray text-3 uppercase>
|
||||
<p text="gray/70" text-3 uppercase>
|
||||
Joined
|
||||
</p>
|
||||
<p text-3 text-gray-3>
|
||||
<p text-3 text-gray>
|
||||
{{ createdAt }}
|
||||
</p>
|
||||
</div>
|
||||
<div v-for="field in account.fields" :key="field.name" flex flex-col rounded p3 class="bg-purple/10">
|
||||
<p text-gray text-3 uppercase>
|
||||
<p text="gray/70" text-3 uppercase>
|
||||
{{ field.name }}
|
||||
</p>
|
||||
<p text-3 text-purple-3 v-html="field.value" />
|
||||
|
|
|
@ -24,8 +24,8 @@ const router = useRouter()
|
|||
|
||||
function go(e: MouseEvent) {
|
||||
const path = e.composedPath() as HTMLElement[]
|
||||
const el = path.find(el => ['A', 'BUTTON', 'P', 'IMG', 'VIDEO'].includes(el.tagName?.toUpperCase()))
|
||||
if (!el || el.tagName.toUpperCase() === 'P')
|
||||
const el = path.find(el => ['A', 'BUTTON', 'IMG', 'VIDEO'].includes(el.tagName?.toUpperCase()))
|
||||
if (!el)
|
||||
router.push(`/@${status.account.acct}/${status.id}`)
|
||||
}
|
||||
|
||||
|
@ -63,7 +63,7 @@ const timeago = useTimeAgo(() => status.createdAt, {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div ref="el" flex flex-col gap-2 my-2 px-4 @click="go">
|
||||
<div ref="el" flex flex-col gap-2 px-4 hover:bg="gray/10" transition="duration-100" cursor-pointer @click="go">
|
||||
<div v-if="rebloggedBy" pl8>
|
||||
<div flex gap-1 items-center text-gray:75 text-sm>
|
||||
<div i-ri:repeat-fill mr-1 />
|
||||
|
|
Loading…
Reference in a new issue