This commit is contained in:
Ren Amamiya
2023-10-10 11:51:01 +07:00
parent 043c1b1220
commit bc4c3b9803
39 changed files with 411 additions and 216 deletions

View File

@@ -28,33 +28,16 @@ export function NoteActions({
return (
<Tooltip.Provider>
<div className="-ml-1 mt-3 inline-flex w-full items-center">
<div className="inline-flex items-center gap-2">
<div className="-ml-1 mt-4 inline-flex w-full items-center">
<div className="inline-flex items-center gap-8">
<NoteReply id={id} pubkey={pubkey} root={root} />
<NoteReaction id={id} pubkey={pubkey} />
<NoteRepost id={id} pubkey={pubkey} />
<NoteZap id={id} pubkey={pubkey} />
</div>
{extraButtons && (
<>
<div className="mx-2 block h-4 w-px bg-white/10 backdrop-blur-xl" />
<div className="inline-flex items-center gap-2">
<Tooltip.Root delayDuration={150}>
<Tooltip.Trigger asChild>
<Link
to={`/notes/text/${id}`}
className="group inline-flex h-7 w-7 items-center justify-center"
>
<FocusIcon className="h-5 w-5 text-white/80 group-hover:text-blue-400" />
</Link>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="-left-10 select-none rounded-md bg-black px-3.5 py-1.5 text-sm leading-none text-white will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade">
Focus
<Tooltip.Arrow className="fill-black" />
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
<div className="ml-auto">
<div className="inline-flex items-center gap-3">
<Tooltip.Root delayDuration={150}>
<Tooltip.Trigger asChild>
<button
@@ -66,22 +49,22 @@ export function NoteActions({
content: id,
})
}
className="group inline-flex h-7 w-7 items-center justify-center"
className="group inline-flex h-7 w-7 items-center justify-center text-neutral-500 dark:text-neutral-300"
>
<ThreadIcon className="h-5 w-5 text-white/80 group-hover:text-blue-400" />
<ThreadIcon className="h-5 w-5 group-hover:text-blue-500" />
</button>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="-left-10 select-none rounded-md bg-black px-3.5 py-1.5 text-sm leading-none text-white will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade">
<Tooltip.Content className="-left-10 inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-200 px-3.5 text-sm text-neutral-900 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade dark:bg-neutral-800 dark:text-neutral-100">
Open thread
<Tooltip.Arrow className="fill-black" />
<Tooltip.Arrow className="fill-neutral-200 dark:fill-neutral-800" />
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
<MoreActions id={id} pubkey={pubkey} />
</div>
</>
</div>
)}
<MoreActions id={id} pubkey={pubkey} />
</div>
</Tooltip.Provider>
);