Imbus/FrostByte
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Comment declutter

Browse source
This commit is contained in:
Imbus 2024-03-12 19:39:48 +01:00
parent f9ef90e61f
commit a298f63326
1 changed files with 2 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
client-solid/src/Components/Comment.tsx
View file

@ -1,8 +1,6 @@
import { JSXElement } from "solid-js"; import { JSXElement } from "solid-js";
import { EngagementIcon } from "../Util/Icons";
import { PublicComment } from "../Util/api"; import { PublicComment } from "../Util/api";
import { NewCommentInputArea } from "./NewComment";
interface CommentProps { interface CommentProps {
comment: PublicComment; comment: PublicComment;
@ -16,38 +14,11 @@ interface CommentProps {
*/ */
export function Comment({ comment }: CommentProps): JSXElement { export function Comment({ comment }: CommentProps): JSXElement {
return ( return (
<div class="flex min-w-full flex-col rounded-lg border-b-2 border-b-secondary bg-base-300 px-5 py-3 text-base-content transition-all hover:bg-base-300 "> <div class="flex px-2 min-w-full flex-col rounded-lg border-b-2 border-b-secondary bg-base-300 py-2 text-base-content transition-all hover:bg-base-300 md:px-12">
<div class="flex flex-row"> <div class="flex flex-row">
<div class="pb-2 text-xs text-gray-500">{comment.created_at}</div> <div class="pb-1 text-xs text-gray-500">{comment.created_at}</div>
</div> </div>
<div class="text-sm">{comment.content}</div> <div class="text-sm">{comment.content}</div>
<div class="flex justify-between py-5 align-baseline">
<div class="btn self-start">
{/* Placeholder icon, tbd */}
<EngagementIcon />
</div>
<section>
<ul class="timeline timeline-vertical">
<li>
<div class="timeline-start">{comment.created_at}</div>
<div class="divider timeline-middle">:</div>
<div class="timeline-end timeline-box">{comment.content}</div>
<hr />
</li>
<li>
<div class="timeline-end">{comment.created_at}</div>
<div class="timeline-middle">:</div>
<div class="timeline-start timeline-box">{comment.content}</div>
<hr />
</li>
</ul>
</section>
</div>
<NewCommentInputArea
parentCommentId={comment.parent_comment_id}
parentPostId={comment.parent_post_id}
/>
</div> </div>
); );
} }