|
|
@ -41,19 +41,19 @@ export default function Article() {
|
|
|
|
<main className="max-w-screen-sm min-h-screen mx-auto flex flex-col items-center text-[#000000f2] font-normal bg-white px-[18px] pt-[14px] pb-[36px]">
|
|
|
|
<main className="max-w-screen-sm min-h-screen mx-auto flex flex-col items-center text-[#000000f2] font-normal bg-white px-[18px] pt-[14px] pb-[36px]">
|
|
|
|
<h1 className="font-600 text-[22px] leading-[30.8px] text-left w-full">{articleInfo?.title}</h1>
|
|
|
|
<h1 className="font-600 text-[22px] leading-[30.8px] text-left w-full">{articleInfo?.title}</h1>
|
|
|
|
{(articleInfo?.userName || displayDate) && (
|
|
|
|
{(articleInfo?.userName || displayDate) && (
|
|
|
|
<p className="w-full flex items-center text-[12px] text-[#000000b2] leading-[16.8px] mt-[9px]">
|
|
|
|
<p className="w-full flex items-center text-[12px] text-[#000000b2] leading-[16.8px] mt-[6px]">
|
|
|
|
<span>{articleInfo?.userName}</span>
|
|
|
|
<span>{articleInfo?.userName}</span>
|
|
|
|
<span className="ml-[15px]">{displayDate}</span>
|
|
|
|
<span className="ml-[15px]">{displayDate}</span>
|
|
|
|
</p>
|
|
|
|
</p>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
{articleInfo?.image && (
|
|
|
|
{articleInfo?.image && (
|
|
|
|
<div className="relative w-[100%] aspect-square mt-[18px]">
|
|
|
|
<div className="relative w-[100%] aspect-[1/0.5015] mt-[16px]">
|
|
|
|
<Image className="rounded-[6px] object-cover" unoptimized fill src={articleInfo?.image} alt="cover" />
|
|
|
|
<Image className="rounded-[6px] object-cover" unoptimized fill src={articleInfo?.image} alt="cover" />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
{articleInfo?.content && (
|
|
|
|
{articleInfo?.content && (
|
|
|
|
<p
|
|
|
|
<p
|
|
|
|
className="mt-[12px] text-[14px] leading-[26px]"
|
|
|
|
className="mt-[12px] text-[14px] leading-[24px]"
|
|
|
|
dangerouslySetInnerHTML={{ __html: articleInfo?.content }}
|
|
|
|
dangerouslySetInnerHTML={{ __html: articleInfo?.content }}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|