diff options
Diffstat (limited to 'frontend/src/pages/articles/Article.tsx')
| -rw-r--r-- | frontend/src/pages/articles/Article.tsx | 23 |
1 files changed, 20 insertions, 3 deletions
diff --git a/frontend/src/pages/articles/Article.tsx b/frontend/src/pages/articles/Article.tsx index 1a96ada..633e418 100644 --- a/frontend/src/pages/articles/Article.tsx +++ b/frontend/src/pages/articles/Article.tsx @@ -7,7 +7,7 @@ type article = { photoUrl: string; content: string; createdOn: string; - updateOn: string; + updatedOn: string; }; export default function Article() { @@ -28,8 +28,25 @@ export default function Article() { return ( <> - <h1>{articleData?.title}</h1> - <div>{articleData?.content}</div> + <div className="text-center pt-16 md:pt-32"> + <p className="text-sm md:text-base text-green-500 font-bold"> + {articleData?.createdOn} + </p> + <h1 className="font-bold break-normal text-3xl md:text-5xl"> + {articleData?.title} + </h1> + </div> + <div + className="container w-full max-w-6xl mx-auto bg-white bg-cover mt-8 rounded" + style={{ background: `url('${articleData?.photoUrl}'); height: 75vh;` }} + ></div> + <div className="container max-w-5xl mx-auto -mt-32"> + <div className="mx-0 sm:mx-6"> + <div className="bg-white w-full p-8 md:p-24 text-xl md:text-2xl text-gray-800 leading-normal"> + <div>{articleData?.content}</div> + </div> + </div> + </div> </> ); } |