minor fixes

This commit is contained in:
Ren Amamiya 2023-05-06 21:40:39 +07:00
parent 362e572768
commit 554caebb91
8 changed files with 14 additions and 12 deletions

View File

@ -20,7 +20,7 @@ export default function NoteBase({ event }: { event: any }) {
return ( return (
<div onClick={(e) => openNote(e)} className="h-min w-full select-text px-3 py-1.5"> <div onClick={(e) => openNote(e)} className="h-min w-full select-text px-3 py-1.5">
<div className="rounded-md border border-zinc-800 bg-zinc-900 px-3 py-5 shadow-input shadow-black/20"> <div className="rounded-md border border-zinc-800 bg-zinc-900 px-3 pt-3 shadow-input shadow-black/20">
{event.parent_id && event.parent_id !== event.event_id && ( {event.parent_id && event.parent_id !== event.event_id && (
<NoteParent key={event.parent_id} id={event.parent_id} /> <NoteParent key={event.parent_id} id={event.parent_id} />
)} )}

View File

@ -51,7 +51,7 @@ export default function NoteMetadata({ id, eventPubkey }: { id: string; eventPub
}); });
return ( return (
<div className="mt-5 flex items-center gap-16 border-t border-zinc-800 pt-5"> <div className="mt-4 flex h-12 items-center gap-16 border-t border-zinc-800/50">
<NoteReply id={id} replies={replies} /> <NoteReply id={id} replies={replies} />
<NoteLike id={id} pubkey={eventPubkey} likes={likes} /> <NoteLike id={id} pubkey={eventPubkey} likes={likes} />
<NoteRepost id={id} pubkey={eventPubkey} reposts={reposts} /> <NoteRepost id={id} pubkey={eventPubkey} reposts={reposts} />

View File

@ -38,7 +38,8 @@ export const NoteParent = memo(function NoteParent({ id }: { id: string }) {
const content = !error && data ? noteParser(data) : null; const content = !error && data ? noteParser(data) : null;
return ( return (
<div className="flex flex-col pb-5"> <div className="relative flex flex-col pb-6">
<div className="absolute left-[21px] top-0 h-full w-0.5 bg-gradient-to-t from-zinc-800 to-zinc-600"></div>
{data ? ( {data ? (
<> <>
<NoteDefaultUser pubkey={data.pubkey} time={data.created_at} /> <NoteDefaultUser pubkey={data.pubkey} time={data.created_at} />

View File

@ -10,7 +10,8 @@ export const NoteQuoteRepost = memo(function NoteQuoteRepost({ event }: { event:
return ( return (
<div className="h-min w-full select-text px-3 py-1.5"> <div className="h-min w-full select-text px-3 py-1.5">
<div className="rounded-md border border-zinc-800 bg-zinc-900 shadow-input shadow-black/20"> <div className="rounded-md border border-zinc-800 bg-zinc-900 shadow-input shadow-black/20">
<div className="rounded-t-md border-b border-zinc-800 bg-zinc-950 px-3 py-2"> <div className="relative px-3 pb-5 pt-3">
<div className="absolute left-[32px] top-[20px] h-[70px] w-0.5 bg-gradient-to-t from-zinc-800 to-zinc-600"></div>
<NoteRepostUser pubkey={event.pubkey} time={event.created_at} /> <NoteRepostUser pubkey={event.pubkey} time={event.created_at} />
</div> </div>
<RootNote id={rootID} fallback={event.content} /> <RootNote id={rootID} fallback={event.content} />

View File

@ -61,7 +61,7 @@ export const RootNote = memo(function RootNote({ id, fallback }: { id: string; f
const contentFallback = noteParser(parseFallback); const contentFallback = noteParser(parseFallback);
return ( return (
<div onClick={(e) => openNote(e)} className="flex flex-col px-3 pb-5 pt-2"> <div onClick={(e) => openNote(e)} className="flex flex-col px-3">
<NoteDefaultUser pubkey={parseFallback.pubkey} time={parseFallback.created_at} /> <NoteDefaultUser pubkey={parseFallback.pubkey} time={parseFallback.created_at} />
<div className="mt-1 pl-[52px]"> <div className="mt-1 pl-[52px]">
<NoteContent content={contentFallback} /> <NoteContent content={contentFallback} />
@ -72,7 +72,7 @@ export const RootNote = memo(function RootNote({ id, fallback }: { id: string; f
} }
return ( return (
<div onClick={(e) => openNote(e)} className="flex flex-col px-3 pb-5 pt-2"> <div onClick={(e) => openNote(e)} className="flex flex-col px-3">
{data ? ( {data ? (
<> <>
<NoteDefaultUser pubkey={data.pubkey} time={data.created_at} /> <NoteDefaultUser pubkey={data.pubkey} time={data.created_at} />

View File

@ -13,7 +13,7 @@ export const NoteDefaultUser = ({ pubkey, time }: { pubkey: string; time: number
return ( return (
<div className="group relative z-10 flex h-11 items-center gap-2"> <div className="group relative z-10 flex h-11 items-center gap-2">
<div className="h-11 w-11 shrink overflow-hidden rounded-md bg-zinc-900"> <div className="h-11 w-11 shrink-0 overflow-hidden rounded-md bg-zinc-900">
<Image <Image
src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`} src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`}
alt={pubkey} alt={pubkey}
@ -30,7 +30,7 @@ export const NoteDefaultUser = ({ pubkey, time }: { pubkey: string; time: number
<div className="flex items-baseline gap-1.5 text-sm leading-none text-zinc-500"> <div className="flex items-baseline gap-1.5 text-sm leading-none text-zinc-500">
<span>{user?.nip05 || shortenKey(pubkey)}</span> <span>{user?.nip05 || shortenKey(pubkey)}</span>
<span></span> <span></span>
<span>{dayjs().to(dayjs.unix(time))}</span> <span>{dayjs().to(dayjs.unix(time), true)}</span>
</div> </div>
</div> </div>
</div> </div>

View File

@ -13,7 +13,7 @@ export default function NoteReplyUser({ pubkey, time }: { pubkey: string; time:
return ( return (
<div className="group flex items-start gap-3"> <div className="group flex items-start gap-3">
<div className="relative h-9 w-9 shrink rounded-md"> <div className="relative h-9 w-9 shrink-0 rounded-md">
<Image <Image
src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`} src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`}
alt={pubkey} alt={pubkey}
@ -26,7 +26,7 @@ export default function NoteReplyUser({ pubkey, time }: { pubkey: string; time:
{user?.display_name || user?.name || shortenKey(pubkey)} {user?.display_name || user?.name || shortenKey(pubkey)}
</span> </span>
<span className="leading-none text-zinc-500">·</span> <span className="leading-none text-zinc-500">·</span>
<span className="leading-none text-zinc-500">{dayjs().to(dayjs.unix(time))}</span> <span className="leading-none text-zinc-500">{dayjs().to(dayjs.unix(time), true)}</span>
</div> </div>
</div> </div>
</div> </div>

View File

@ -13,7 +13,7 @@ export const NoteRepostUser = ({ pubkey, time }: { pubkey: string; time: number
return ( return (
<div className="group flex items-center gap-2"> <div className="group flex items-center gap-2">
<div className="relative h-11 w-11 shrink overflow-hidden rounded-md bg-zinc-900"> <div className="relative h-11 w-11 shrink-0 overflow-hidden rounded-md bg-zinc-900">
<Image <Image
src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`} src={`${IMGPROXY_URL}/rs:fit:100:100/plain/${user?.picture ? user.picture : DEFAULT_AVATAR}`}
alt={pubkey} alt={pubkey}
@ -28,7 +28,7 @@ export const NoteRepostUser = ({ pubkey, time }: { pubkey: string; time: number
</span> </span>
</h5> </h5>
<span className="leading-tight text-zinc-500">·</span> <span className="leading-tight text-zinc-500">·</span>
<span className="text-zinc-500">{dayjs().to(dayjs.unix(time))}</span> <span className="text-zinc-500">{dayjs().to(dayjs.unix(time), true)}</span>
</div> </div>
</div> </div>
); );