[resumes][fix] left-align all comments

pull/363/head
Terence Ho 3 years ago
parent ffd7539179
commit 6ebc5154de

@ -11,7 +11,7 @@ type CommentProps = {
export default function Comment({ comment, userId }: CommentProps) { export default function Comment({ comment, userId }: CommentProps) {
const isCommentOwner = userId === comment.user.userId; const isCommentOwner = userId === comment.user.userId;
return ( return (
<CommentCard isCommentOwner={isCommentOwner}> <CommentCard>
<CommentBody comment={comment} isCommentOwner={isCommentOwner} /> <CommentBody comment={comment} isCommentOwner={isCommentOwner} />
</CommentCard> </CommentCard>
); );

@ -2,20 +2,11 @@ import type { ReactNode } from 'react';
type CommentCardProps = { type CommentCardProps = {
children: ReactNode; children: ReactNode;
isCommentOwner?: boolean;
}; };
export default function CommentCard({ export default function CommentCard({ children }: CommentCardProps) {
isCommentOwner, return (
children, <div className="border-primary-300 w-3/4 rounded-md border-2 bg-white p-2 drop-shadow-md">
}: CommentCardProps) {
// Used two different <div> to allow customisation of owner comments
return isCommentOwner ? (
<div className="border-primary-300 float-right w-3/4 rounded-md border-2 bg-white p-2 drop-shadow-md">
{children}
</div>
) : (
<div className="border-primary-300 float-left w-3/4 rounded-md border-2 bg-white p-2 drop-shadow-md">
{children} {children}
</div> </div>
); );

Loading…
Cancel
Save