UI improvements

Author: luloxi

packages/nextjs/app/profile/_components/ProfilePictureUpload.tsx

@@ -21,7 +21,6 @@ const ProfilePictureUpload: React.FC<ProfilePictureUploadProps> = ({
   const [previewImage, setPreviewImage] = useState<string>("");
   const [dragActive, setDragActive] = useState(false);
   const [loading, setLoading] = useState(false);
-  const [hovered, setHovered] = useState(false);
 
   useEffect(() => {
     if (profilePicture) {
@@ -90,8 +89,6 @@ const ProfilePictureUpload: React.FC<ProfilePictureUploadProps> = ({
       onDragOver={handleDragOver}
       onDragLeave={handleDragLeave}
       onDrop={handleDrop}
-      onMouseEnter={() => setHovered(true)}
-      onMouseLeave={() => setHovered(false)}
     >
       <input
         type="file"
@@ -140,14 +137,6 @@ const ProfilePictureUpload: React.FC<ProfilePictureUploadProps> = ({
           height={128}
         />
       )}
-      {hovered && previewImage && (
-        <button
-          className="absolute top-5 right-5 bg-red-500 text-white w-6 h-6 flex items-center justify-center rounded-full"
-          onClick={handleRemoveImage}
-        >
-          ✕
-        </button>
-      )}
       {loading && (
         <div className="absolute inset-0 flex items-center justify-center bg-gray-700 bg-opacity-75 text-white">
           Uploading...

packages/nextjs/app/profile/_components/_bookmarked/PostCard.tsx

@@ -151,7 +151,7 @@ export const PostCard = ({ post }: { post: Post }) => {
                   src={post.image || "/path/to/default/image.png"}
                   alt="NFT Image"
                   className="w-full h-auto rounded-lg object-cover"
-                  layout="responsive"
+                  // layout="responsive"
                   width={800} // Adjust this to the desired fullscreen width
                   height={800} // Adjust this to maintain the aspect ratio of the image
                 />

packages/nextjs/app/profile/_components/_bought/PostCard.tsx

@@ -83,7 +83,7 @@ export const PostCard = ({ post }: { post: Post }) => {
                   src={post.image || "/path/to/default/image.png"}
                   alt="NFT Image"
                   className="w-full h-auto rounded-lg object-cover"
-                  layout="responsive"
+                  // layout="responsive"
                   width={800} // Adjust this to the desired fullscreen width
                   height={800} // Adjust this to maintain the aspect ratio of the image
                 />

packages/nextjs/components/punk-society/PostCard.tsx

@@ -142,7 +142,7 @@ export const PostCard = ({ post }: { post: Post }) => {
                   src={post.image || "/path/to/default/image.png"}
                   alt="NFT Image"
                   className="w-full h-auto rounded-lg object-cover"
-                  layout="responsive"
+                  // layout="responsive"
                   width={800} // Adjust this to the desired fullscreen width
                   height={800} // Adjust this to maintain the aspect ratio of the image
                 />