From 60f4a220f2407c09bbe91b733d4278e758bfee8d Mon Sep 17 00:00:00 2001
From: VineeTagarwaL-code <vineetagarwal.now@gmail.com>
Date: Tue, 21 Nov 2023 19:07:00 +0530
Subject: [PATCH] fixed edit button ui bug and improved the UI  #9406

---
 .env.example                  | 22 -----------------
 components/user/UserLink.js   |  4 +--
 pages/account/manage/links.js | 46 ++++++++++++++++++++---------------
 3 files changed, 28 insertions(+), 44 deletions(-)
 delete mode 100644 .env.example

diff --git a/.env.example b/.env.example
deleted file mode 100644
index 69fc5b62fad..00000000000
--- a/.env.example
+++ /dev/null
@@ -1,22 +0,0 @@
-BIODROP_MONGO_CONNECTION_STRING="mongodb://localhost:27017/biodrop"
-NEXT_PUBLIC_BASE_URL="http://localhost:3000"
-NODE_ENV="development"
-
-GITHUB_ID=""
-GITHUB_SECRET=""
-NEXTAUTH_SECRET="123456"
-NEXTAUTH_URL="http://localhost:3000"
-
-BIODROP_API_SECRET="development"
-GITHUB_API_TOKEN=""
-RANDOM_USERS="eddiejaoude,sarajaoude"
-ADMIN_USERS="eddiejaoude,SaraJaoude,_test-admin-user"
-
-STRIPE_SECRET_KEY=""
-STRIPE_PREMIUM_PRICING_ID=""
-STRIPE_WEBHOOK_SECRET=""
-NEXT_PUBLIC_PREMIUM_SUPPORT_URL=""
-
-VERCEL_PROJECT_ID=""
-VERCEL_TEAM_ID=""
-VERCEL_AUTH_TOKEN=""
diff --git a/components/user/UserLink.js b/components/user/UserLink.js
index 4a1d014ba10..ead09000eff 100644
--- a/components/user/UserLink.js
+++ b/components/user/UserLink.js
@@ -46,7 +46,7 @@ export default function UserLink({
         animations[link.animation] !== animations.glow &&
           "dark:hover:bg-secondary-low/40 hover:bg-secondary-low/40",
         isEnabled && getLinkAnimation.get(animations[link.animation]),
-        "relative rounded-full border border-primary-medium-low dark:border-primary-medium-low dark:hover:border-[color:var(--hover-color)] hover:border-[color:var(--hover-color)] hover:shadow-xl p-4 my-2 w-full content-start flex flex-row gap-4 items-center dark:bg-primary-medium grow",
+        "relative rounded-full border border-primary-medium-low dark:border-primary-medium-low dark:hover:border-[color:var(--hover-color)] hover:border-[color:var(--hover-color)] hover:shadow-xl p-4 my-2 w-full content-start flex flex-row gap-4 items-center dark:bg-primary-medium grow px-8 md:px-10",
       )}
       style={{
         "--hover-color": colors[link.icon],
@@ -99,7 +99,7 @@ export default function UserLink({
   );
 
   return (
-    <div className="flex flex-row gap-8 w-full">
+    <div className="flex flex-row gap-8 w-full ">
       {manage ? edit(link) : item(link)}
     </div>
   );
diff --git a/pages/account/manage/links.js b/pages/account/manage/links.js
index 8f5c66403c8..e1857177393 100644
--- a/pages/account/manage/links.js
+++ b/pages/account/manage/links.js
@@ -128,27 +128,33 @@ export default function ManageLinks({ BASE_URL, username, links }) {
         </div>
 
         {!linkList.length && <Alert type="info" message="No Links found" />}
+        
+        <div className="mt-2">
+
+
+          <ReactSortable
+            list={linkList}
+            setList={setLinkList}
+            disabled={!reorder}
+            ghostClass="border-2"
+            chosenClass="border-dashed"
+            dragClass="border-red-500"
+          >
+            {linkList.length &&
+              linkList.map((link) => (
+                <UserLink
+                  BASE_URL={BASE_URL}
+                  key={link._id}
+                  link={link}
+                  username={username}
+                  manage={true}
+                  isEnabled={link.isEnabled}
+                />
+              ))}
+          </ReactSortable>
+
+        </div>
 
-        <ReactSortable
-          list={linkList}
-          setList={setLinkList}
-          disabled={!reorder}
-          ghostClass="border-2"
-          chosenClass="border-dashed"
-          dragClass="border-red-500"
-        >
-          {linkList.length &&
-            linkList.map((link) => (
-              <UserLink
-                BASE_URL={BASE_URL}
-                key={link._id}
-                link={link}
-                username={username}
-                manage={true}
-                isEnabled={link.isEnabled}
-              />
-            ))}
-        </ReactSortable>
       </Page>
     </>
   );