update note quote design

This commit is contained in:
Ren Amamiya
2023-05-06 18:33:41 +07:00
parent 473f474e20
commit 362e572768
4 changed files with 6 additions and 6 deletions

View File

@@ -12,7 +12,7 @@ export const NoteContent = ({ content }: { content: any }) => {
<ReactMarkdown <ReactMarkdown
remarkPlugins={[[remarkGfm]]} remarkPlugins={[[remarkGfm]]}
linkTarget="_blank" linkTarget="_blank"
className="prose prose-zinc max-w-none break-words dark:prose-invert prose-p:text-[15px] prose-p:leading-tight prose-a:text-[15px] prose-a:leading-tight prose-a:text-fuchsia-500 prose-a:no-underline prose-a:hover:text-fuchsia-600 prose-a:hover:underline prose-ol:mb-1 prose-ul:mb-1 prose-li:text-[15px] prose-li:leading-tight" className="prose prose-zinc max-w-none break-words dark:prose-invert prose-p:text-[15px] prose-p:leading-tight prose-a:text-[15px] prose-a:leading-tight prose-a:text-fuchsia-500 prose-a:no-underline hover:prose-a:text-fuchsia-600 hover:prose-a:underline prose-ol:mb-1 prose-ul:mb-1 prose-li:text-[15px] prose-li:leading-tight"
components={{ components={{
h5: ({ ...props }) => <NoteMentionUser pubkey={props.content} />, h5: ({ ...props }) => <NoteMentionUser pubkey={props.content} />,
h6: ({ ...props }) => <NoteQuote id={props.content} />, h6: ({ ...props }) => <NoteQuote id={props.content} />,

View File

@@ -4,7 +4,7 @@ export default function VideoPreview({ urls }: { urls: string[] }) {
return ( return (
<div <div
onClick={(e) => e.stopPropagation()} onClick={(e) => e.stopPropagation()}
className="relative mt-3 flex w-full flex-col overflow-hidden rounded-lg bg-zinc-950" className="relative mt-2 flex w-full flex-col overflow-hidden rounded-lg bg-zinc-950"
> >
<MediaPlayer src={urls[0]} poster="" controls> <MediaPlayer src={urls[0]} poster="" controls>
<MediaOutlet /> <MediaOutlet />

View File

@@ -9,8 +9,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 px-3 py-5 shadow-input shadow-black/20"> <div className="rounded-md border border-zinc-800 bg-zinc-900 shadow-input shadow-black/20">
<div className="pb-5"> <div className="rounded-t-md border-b border-zinc-800 bg-zinc-950 px-3 py-2">
<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"> <div onClick={(e) => openNote(e)} className="flex flex-col px-3 pb-5 pt-2">
<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"> <div onClick={(e) => openNote(e)} className="flex flex-col px-3 pb-5 pt-2">
{data ? ( {data ? (
<> <>
<NoteDefaultUser pubkey={data.pubkey} time={data.created_at} /> <NoteDefaultUser pubkey={data.pubkey} time={data.created_at} />