fix(comments) : remove extra spacing from replies
This commit is contained in:
@@ -594,7 +594,8 @@ export function CommentCard({
|
|||||||
tabIndex={highlighted ? -1 : undefined}
|
tabIndex={highlighted ? -1 : undefined}
|
||||||
className={cn(
|
className={cn(
|
||||||
"scroll-mt-36",
|
"scroll-mt-36",
|
||||||
inbox ? "max-md:block" : "flex flex-col gap-2 py-2",
|
inbox ? "max-md:block" : "flex flex-col gap-2",
|
||||||
|
!inbox && !item.rootId && "py-2",
|
||||||
inboxReply && "relative",
|
inboxReply && "relative",
|
||||||
highlighted && "rounded-lg bg-accent ring-2 ring-ring",
|
highlighted && "rounded-lg bg-accent ring-2 ring-ring",
|
||||||
expanded &&
|
expanded &&
|
||||||
@@ -823,7 +824,7 @@ export function CommentCard({
|
|||||||
<AccordionContent
|
<AccordionContent
|
||||||
keepMounted
|
keepMounted
|
||||||
panelClassName="data-open:overflow-visible"
|
panelClassName="data-open:overflow-visible"
|
||||||
className="[&_p]:mb-0"
|
className="pb-0 [&_p:not(:last-child)]:mb-0"
|
||||||
>
|
>
|
||||||
{hasOpenedReplies && (
|
{hasOpenedReplies && (
|
||||||
<div className="flex flex-col gap-3">
|
<div className="flex flex-col gap-3">
|
||||||
@@ -854,7 +855,7 @@ export function CommentCard({
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<ChevronUpIcon data-icon="inline-start" />
|
<ChevronUpIcon data-icon="inline-start" />
|
||||||
Show less
|
แสดงน้อยลง
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -990,7 +991,7 @@ function CommentReplies({
|
|||||||
} else if (page.nextCursor) void more();
|
} else if (page.nextCursor) void more();
|
||||||
}, [focusReplyId, busy, error, page, more]);
|
}, [focusReplyId, busy, error, page, more]);
|
||||||
return (
|
return (
|
||||||
<div id={`replies-${rootId}`} className="flex flex-col gap-3 pt-2">
|
<div id={`replies-${rootId}`} className="flex flex-col gap-3">
|
||||||
{feed.error && (
|
{feed.error && (
|
||||||
<Alert variant="destructive">
|
<Alert variant="destructive">
|
||||||
<AlertDescription>{feed.error}</AlertDescription>
|
<AlertDescription>{feed.error}</AlertDescription>
|
||||||
@@ -1064,7 +1065,7 @@ function CommentReplyTree({
|
|||||||
<div
|
<div
|
||||||
key={reply.id}
|
key={reply.id}
|
||||||
className={cn(
|
className={cn(
|
||||||
"relative flex min-w-0 flex-col gap-3 before:absolute before:-left-8 before:top-0 before:h-6 before:w-6 before:rounded-bl-2xl before:border-b before:border-l before:border-border",
|
"relative flex min-w-0 flex-col gap-3 before:absolute before:-left-8 before:top-0 before:h-4 before:w-6 before:rounded-bl-2xl before:border-b before:border-l before:border-border",
|
||||||
parent !== null &&
|
parent !== null &&
|
||||||
index < siblings.length - 1 &&
|
index < siblings.length - 1 &&
|
||||||
"after:absolute after:-bottom-3 after:-left-8 after:top-0 after:border-l after:border-border",
|
"after:absolute after:-bottom-3 after:-left-8 after:top-0 after:border-l after:border-border",
|
||||||
@@ -1076,7 +1077,7 @@ function CommentReplyTree({
|
|||||||
className={cn(
|
className={cn(
|
||||||
!moderationDetails &&
|
!moderationDetails &&
|
||||||
groups.has(reply.id) &&
|
groups.has(reply.id) &&
|
||||||
"relative after:absolute after:-bottom-3 after:left-4 after:top-10 after:border-l after:border-border",
|
"relative after:absolute after:-bottom-3 after:left-4 after:top-8 after:border-l after:border-border",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<CommentCard
|
<CommentCard
|
||||||
|
|||||||
Reference in New Issue
Block a user