changes and improvements

pages/collections/index.tsx

@@ -1,7 +1,7 @@
 import useCollectionStore from "@/store/collections";
 import {
-  faBox,
   faEllipsis,
+  faFolder,
   faPlus,
   faSort,
 } from "@fortawesome/free-solid-svg-icons";
@@ -36,7 +36,7 @@ export default function Collections() {
           <div className="flex gap-3 items-end">
             <div className="flex gap-2">
               <FontAwesomeIcon
-                icon={faBox}
+                icon={faFolder}
                 className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 drop-shadow"
               />
               <p className="sm:text-4xl text-3xl capitalize bg-gradient-to-tr from-sky-500 to-slate-400 bg-clip-text text-transparent font-bold">

pages/login.tsx

@@ -73,11 +73,20 @@ export default function Login() {
 
         <input
           type="password"
-          placeholder="*****************"
+          placeholder="***********"
           value={form.password}
           onChange={(e) => setForm({ ...form, password: e.target.value })}
           className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
         />
+        {EmailProvider && (
+          <Link
+            href={"/forgot"}
+            className="w-fit ml-auto text-gray-500 font-semibold"
+          >
+            Forgot Password?
+          </Link>
+        )}
+
         <SubmitButton
           onClick={loginUser}
           label="Login"
@@ -91,14 +100,6 @@ export default function Login() {
           Sign Up
         </Link>
       </div>
-      {EmailProvider && (
-        <div className="flex items-baseline gap-1 justify-center mb-3">
-          <p className="w-fit text-gray-500">Forgot your password?</p>
-          <Link href={"/forgot"} className="block text-sky-500 font-bold">
-            Send login link
-          </Link>
-        </div>
-      )}
     </>
   );
 }

pages/public/collections/[id].tsx

@@ -63,9 +63,9 @@ export default function PublicCollections() {
         })}
       </div>
 
-      <p className="text-center font-bold text-gray-500">
+      {/* <p className="text-center font-bold text-gray-500">
         List created with <span className="text-sky-500">Linkwarden.</span>
-      </p>
+      </p> */}
     </div>
   ) : (
     <></>

pages/register.tsx

@@ -139,41 +139,50 @@ export default function Register() {
           </>
         ) : undefined}
 
-        <p className="text-sm text-sky-500 w-fit font-semibold">Password</p>
+        <div className="flex item-center gap-5">
+          <div>
+            <p className="text-sm text-sky-500 w-fit font-semibold mb-3">
+              Password
+            </p>
 
-        <input
-          type="password"
-          placeholder="*****************"
-          value={form.password}
-          onChange={(e) => setForm({ ...form, password: e.target.value })}
-          className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
-        />
+            <input
+              type="password"
+              placeholder="***********"
+              value={form.password}
+              onChange={(e) => setForm({ ...form, password: e.target.value })}
+              className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
+            />
+          </div>
 
-        <p className="text-sm text-sky-500 w-fit font-semibold">
-          Re-enter Password
-        </p>
+          <div>
+            <p className="text-sm text-sky-500 w-fit font-semibold mb-3">
+              Confirm Password
+            </p>
 
-        <input
-          type="password"
-          placeholder="*****************"
-          value={form.passwordConfirmation}
-          onChange={(e) =>
-            setForm({ ...form, passwordConfirmation: e.target.value })
-          }
-          className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
-        />
+            <input
+              type="password"
+              placeholder="***********"
+              value={form.passwordConfirmation}
+              onChange={(e) =>
+                setForm({ ...form, passwordConfirmation: e.target.value })
+              }
+              className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
+            />
+          </div>
+        </div>
         <SubmitButton
           onClick={registerUser}
           label="Sign Up"
           className="mt-2 w-full text-center"
           loading={submitLoader}
         />
-      </div>
-      <div className="flex items-baseline gap-1 justify-center my-3">
-        <p className="w-fit text-gray-500">Already have an account?</p>
-        <Link href={"/login"} className="block w-min text-sky-500 font-bold">
-          Login
-        </Link>
+
+        <div className="flex items-baseline gap-1 justify-center">
+          <p className="w-fit text-gray-500">Already have an account?</p>
+          <Link href={"/login"} className="block w-min text-sky-500 font-bold">
+            Login
+          </Link>
+        </div>
       </div>
     </>
   );