style: adjust the style of NoteStats (#222)

This commit is contained in:
Cody Tseng
2025-03-07 23:39:46 +08:00
committed by GitHub
parent 71895e3a0f
commit accf3319e7
16 changed files with 417 additions and 186 deletions

View File

@@ -6,6 +6,7 @@ import NoteStats from '../NoteStats'
import UserAvatar from '../UserAvatar'
import Username from '../Username'
import PictureContent from '../PictureContent'
import NoteOptions from '../NoteOptions'
export default function PictureNote({
event,
@@ -22,23 +23,26 @@ export default function PictureNote({
return (
<div className={className}>
<div className="px-4 flex items-center space-x-2">
<UserAvatar userId={event.pubkey} />
<div className="flex-1 w-0">
<div className="flex gap-2 items-center">
<Username
userId={event.pubkey}
className="font-semibold flex"
skeletonClassName="h-4"
/>
{usingClient && (
<div className="text-xs text-muted-foreground truncate">using {usingClient}</div>
)}
</div>
<div className="text-xs text-muted-foreground line-clamp-1">
<FormattedTimestamp timestamp={event.created_at} />
<div className="px-4 flex justify-between items-start gap-2">
<div className="flex items-center space-x-2 flex-1">
<UserAvatar userId={event.pubkey} />
<div className="flex-1 w-0">
<div className="flex gap-2 items-center">
<Username
userId={event.pubkey}
className="font-semibold flex truncate"
skeletonClassName="h-4"
/>
{usingClient && (
<div className="text-xs text-muted-foreground truncate">using {usingClient}</div>
)}
</div>
<div className="text-xs text-muted-foreground line-clamp-1">
<FormattedTimestamp timestamp={event.created_at} />
</div>
</div>
</div>
<NoteOptions event={event} className="shrink-0 [&_svg]:size-5" />
</div>
<PictureContent className="mt-2" event={event} />
{!hideStats && (