make edit buttons conditional on user

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>
     </>
   );
 }