게시판 스타일 수정

import Link from "next/link";
import { usePathname } from "next/navigation";
import React from "react";

export default function PostItem({ dpost }) {
  const dpostId = dpost.id;

  const boardNamePath = usePathname();
  const boardId = boardNamePath.substring(1);

  return (
    <Link href={`/${boardId}/${dpostId}`}>
      <div className=" mb-3 ">
        <p className="font-bold">{dpost.postTitle} </p>
        <p className="text-sm">{dpost.postContent} </p>

        <p className=" text-xs ">
          {dpost.postLike !== 0 && ( // postLike이 0이 아닌 경우에만 렌더링
            <span className="mr-3 text-red-500 font-bold">
              👍🏻 {dpost.postLike}
            </span>
          )}
          {dpost.commentCount !== 0 && ( // commentCount가 0이 아닌 경우에만 렌더링
            <span className="mr-3 text-sky-400 font-bold">
              💬 {dpost.commentCount}
            </span>
          )}
          <span className="text-gray-300">{dpost.createdAt}</span>
        </p>

        <div className="border-b mt-2"> </div>
      </div>
    </Link>
  );
}

 

좋아요와 댓글에 텍스트를 입혀 주었고 좋아요와 댓글이 없는경우는 렌더링을 시키지 않게 하였다.

그리고 좋아요는 빨간색 댓글은 하늘색을 주었는데 이모티콘과 색감이 맞지 않아 부자연스럽다.

차후 이모티콘 로고도 따로 제작을 해야겠다.