mleku/smesh
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: adjust the style of NoteStats (#222)

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/Note/index.tsx
View File

@@ -6,6 +6,7 @@ import { Event } from 'nostr-tools'
import { useMemo } from 'react'
import Content from '../Content'
import { FormattedTimestamp } from '../FormattedTimestamp'
import NoteOptions from '../NoteOptions'
import NoteStats from '../NoteStats'
import ParentNotePreview from '../ParentNotePreview'
import UserAvatar from '../UserAvatar'
@@ -36,25 +37,28 @@ export default function Note({
return (
<div className={className}>
<div className="flex items-center space-x-2">
<UserAvatar userId={event.pubkey} size={size === 'small' ? 'small' : 'normal'} />
<div
className={`flex-1 w-0 ${size === 'small' ? 'flex space-x-2 items-center overflow-hidden' : ''}`}
>
<div className="flex gap-2 items-center">
<Username
userId={event.pubkey}
className={`font-semibold flex truncate ${size === 'small' ? 'text-sm' : ''}`}
skeletonClassName={size === 'small' ? 'h-3' : 'h-4'}
/>
{usingClient && size === 'normal' && (
<div className="text-xs text-muted-foreground shrink-0">using {usingClient}</div>
)}
</div>
<div className="text-xs text-muted-foreground shrink-0">
<FormattedTimestamp timestamp={event.created_at} />
<div className="flex justify-between items-start gap-2">
<div className="flex items-center space-x-2 flex-1">
<UserAvatar userId={event.pubkey} size={size === 'small' ? 'small' : 'normal'} />
<div
className={`flex-1 w-0 ${size === 'small' ? 'flex space-x-2 items-center overflow-hidden' : ''}`}
>
<div className="flex gap-2 items-center">
<Username
userId={event.pubkey}
className={`font-semibold flex truncate ${size === 'small' ? 'text-sm' : ''}`}
skeletonClassName={size === 'small' ? 'h-3' : 'h-4'}
/>
{usingClient && size === 'normal' && (
<div className="text-xs text-muted-foreground shrink-0">using {usingClient}</div>
)}
</div>
<div className="text-xs text-muted-foreground shrink-0">
<FormattedTimestamp timestamp={event.created_at} />
</div>
</div>
</div>
{size === 'normal' && <NoteOptions event={event} className="shrink-0 [&_svg]:size-5" />}
</div>
{parentEventId && (
<ParentNotePreview