diff --git a/frontend/src/components/PostCard.tsx b/frontend/src/components/PostCard.tsx
index b6111b49..9701c63e 100644
--- a/frontend/src/components/PostCard.tsx
+++ b/frontend/src/components/PostCard.tsx
@@ -178,81 +178,73 @@ const PostCard = ({ post, onDelete, currentUser }: Props) => {
   };
 
   return (
-    <Link to={`/app/posts/${post.id}`}>
-      <div
-        key={post.id}
-        className="text-[#000435] bg-white dark:text-white dark:bg-blue-950 border border-gray-600 p-6 rounded-lg shadow-lg hover:shadow-2xl hover:border-blue-500 hover:-translate-y-2 transition-transform duration-300 ease-in-out"style={{ backgroundImage: `url(${bgHero})`, backgroundSize: 'cover', backgroundPosition: 'center' }}
-      >
-        <div className="flex justify-between items-center">
-          <h2 className="text-xl font-bold mb-3 text-[#c94aff] bg-white dark:text-[#c94aff] dark:bg-blue-950">{post.title}</h2>
-          {isFavorite ? (
-            <MdFavorite
-              onClick={handleRemoveFromFavorite}
-              size={33}
-              className="cursor-pointer text-[#fe4c4c]"
-            />
-          ) : (
-            <MdFavoriteBorder
-              onClick={handleAddToFavorite}
-              size={33}
-              className="cursor-pointer text-[#e74e4e] dark:text-white"
-            />
-          )}
-        </div>      <p className="text-[#000435] bg-white dark:text-white dark:bg-blue-950 mb-4">
-          {post.description.length > 100
-            ? `${post.description.slice(0, 100)}...`
-            : post.description}
-        </p>
-        <p className="text-[#000435] bg-white dark:text-white dark:bg-blue-950 mb-4">By : 
-          <Link to={`/app/profile/${post.author.id}`} data-tooltip-content={`View ${post.author.username} profile 👀`} data-tooltip-id="my-tooltip" className="text-base">
-          <strong className="text-sky-500">
-              {' '} @{post.author.username}{' '}
-          </strong>
-          </Link>
-        </p>
-          
-        <div className="flex flex-wrap gap-2">
-              {post.tags.map((tag, index) => (
-                <Link
-                  to={`/app/posts?tags=${tag}`}
-                  key={index}
-                  className="inline-flex items-center px-2 py-1 border-2 border-[#5f67de] text-[#5f67de] font-semibold dark:border-white dark:text-white dark:bg-transparent text-sm rounded-md transition-colors duration-300 hover:bg-[#5f67de] hover:text-white dark:hover:bg-white dark:hover:text-black"
-                >
-                  {tag}
-                </Link>
-              ))}
-            </div>
-        <div className="flex justify-between mt-1 ">
-          {/* <button>
-          <Link
-            to={`/app/posts/${post.id}`}
-            className="inline-block mt-4 text-blue-400 hover:text-blue-300 transition-colors duration-200 rounded-3xl border-2 border-blue-500 hover:border-blue-300 px-4 py-2"
-          >
-            Read More
-          </Link>
-          </button> */}
-          {currentUser && currentUser.id === post.author.id && (
-            <div className="flex space-x-2">
-              <button>
+    <Link to={`/app/posts/${post.id}`}
+      key={post.id}
+      className="text-[#000435] bg-white dark:text-white dark:bg-blue-950 border border-gray-600 p-6 rounded-lg shadow-lg hover:shadow-2xl hover:border-blue-500 hover:-translate-y-2 transition-transform duration-300 ease-in-out"style={{ backgroundImage: `url(${bgHero})`, backgroundSize: 'cover', backgroundPosition: 'center' }}
+    >
+      <div className="flex justify-between items-center">
+        <h2 className="text-xl font-bold mb-3 text-[#c94aff] bg-white dark:text-[#c94aff] dark:bg-blue-950">{post.title}</h2>
+        {isFavorite ? (
+          <MdFavorite
+            onClick={handleRemoveFromFavorite}
+            size={33}
+            className="cursor-pointer text-[#fe4c4c]"
+          />
+        ) : (
+          <MdFavoriteBorder
+            onClick={handleAddToFavorite}
+            size={33}
+            className="cursor-pointer text-[#e74e4e] dark:text-white"
+          />
+        )}
+      </div>      <p className="text-[#000435] bg-white dark:text-white dark:bg-blue-950 mb-4">
+        {post.description.length > 100
+          ? `${post.description.slice(0, 100)}...`
+          : post.description}
+      </p>
+      <p className="text-[#000435] bg-white dark:text-white dark:bg-blue-950 mb-4">By : 
+        <Link to={`/app/profile/${post.author.id}`} data-tooltip-content={`View ${post.author.username} profile 👀`} data-tooltip-id="my-tooltip" className="text-base">
+        <strong className="text-sky-500">
+            {' '} @{post.author.username}{' '}
+        </strong>
+        </Link>
+      </p>
+      
+      <div className="flex flex-wrap gap-2">
+            {post.tags.map((tag, index) => (
               <Link
-                to={`/app/posts/edit/${post.id}`}
-                className="justify-end mt-4 inline-block text-blue-400 hover:text-blue-300 transition-colors duration-200 border-2 border-blue-500 hover:border-blue-300 p-2 rounded-3xl"
+                to={`/app/posts?tags=${tag}`}
+                key={index}
+                className="inline-flex items-center px-2 py-1 border-2 border-[#5f67de] text-[#5f67de] font-semibold dark:border-white dark:text-white dark:bg-transparent text-sm rounded-md transition-colors duration-300 hover:bg-[#5f67de] hover:text-white dark:hover:bg-white dark:hover:text-black"
               >
-                <FaEdit size={23} />
+                {tag}
               </Link>
-              </button>
-              <button
-                onClick={handleDelete}
-                disabled={isDeleting}
-                className="" 
-              > <Link className="justify-end mt-4 inline-block text-red-500 hover:text-red-400 transition-colors duration-200 border-2 border-red-500 dark:border-red-500 hover:border-red-400 p-2 rounded-3xl" to={""}>
-                  {isDeleting ? "Deleting..." : <MdDeleteOutline  size={23} />}
-                  </Link>
-              </button>
-            </div>
-          )}
-        </div>
+            ))}
+          </div>
+      <div className="flex justify-between mt-1 ">
+        <button>
         {renderReactions()}
+        </button>
+        {currentUser && currentUser.id === post.author.id && (
+          <div className="flex space-x-2">
+            <button>
+            <Link
+              to={`/app/posts/edit/${post.id}`}
+              className="justify-end mt-4 inline-block text-blue-400 hover:text-blue-300 transition-colors duration-200 border-2 border-blue-500 hover:border-blue-300 p-2 rounded-3xl"
+            >
+              <FaEdit size={23} />
+            </Link>
+            </button>
+            <button
+              onClick={handleDelete}
+              disabled={isDeleting}
+              className="" 
+            > <Link className="justify-end mt-4 inline-block text-red-500 hover:text-red-400 transition-colors duration-200 border-2 border-red-500 dark:border-red-500 hover:border-red-400 p-2 rounded-3xl" to={""}>
+                {isDeleting ? "Deleting..." : <MdDeleteOutline  size={23} />}
+                </Link>
+            </button>
+          </div>
+        )}
       </div>
     </Link>
   );