swapped some gray colors with neutral

pages/choose-username.tsx

@@ -60,7 +60,7 @@ export default function ChooseUsername() {
             />
           </div>
           <div>
-            <p className="text-md text-gray-500 dark:text-gray-400 mt-1">
+            <p className="text-md text-neutral mt-1">
               Feel free to reach out to us at{" "}
               <a
                 className="font-semibold underline"
@@ -81,7 +81,7 @@ export default function ChooseUsername() {
 
           <div
             onClick={() => signOut()}
-            className="w-fit mx-auto cursor-pointer text-gray-500 dark:text-gray-400 font-semibold "
+            className="w-fit mx-auto cursor-pointer text-neutral font-semibold "
           >
             Sign Out
           </div>

pages/collections/[id].tsx

@@ -132,7 +132,7 @@ export default function Index() {
                   <FontAwesomeIcon
                     icon={faSort}
                     id="sort-dropdown"
-                    className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                    className="w-5 h-5 text-neutral"
                   />
                 </div>
 
@@ -154,7 +154,7 @@ export default function Index() {
                     icon={faEllipsis}
                     id="expand-dropdown"
                     title="More"
-                    className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                    className="w-5 h-5 text-neutral"
                   />
                 </div>
                 {expandDropdown ? (

pages/collections/index.tsx

@@ -56,7 +56,7 @@ export default function Collections() {
                 <FontAwesomeIcon
                   icon={faEllipsis}
                   id="expand-dropdown"
-                  className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                  className="w-5 h-5 text-neutral"
                 />
               </div>
 
@@ -95,7 +95,7 @@ export default function Collections() {
               <FontAwesomeIcon
                 icon={faSort}
                 id="sort-dropdown"
-                className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                className="w-5 h-5 text-neutral"
               />
             </div>
 

pages/dashboard.tsx

@@ -186,7 +186,7 @@ export default function Dashboard() {
               <p className="text-center text-2xl">
                 View Your Recently Added Links Here!
               </p>
-              <p className="text-center mx-auto max-w-96 w-fit text-gray-500 dark:text-gray-300 text-sm mt-2">
+              <p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
                 This section will view your latest added Links across every
                 Collections you have access to.
               </p>
@@ -323,7 +323,7 @@ export default function Dashboard() {
               <p className="text-center text-2xl">
                 Pin Your Favorite Links Here!
               </p>
-              <p className="text-center mx-auto max-w-96 w-fit text-gray-500 dark:text-gray-300 text-sm mt-2">
+              <p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
                 You can Pin your favorite Links by clicking on the three dots on
                 each Link and clicking{" "}
                 <span className="font-semibold">Pin to Dashboard</span>.

pages/forgot.tsx

@@ -56,7 +56,7 @@ export default function Forgot() {
               account. Make sure to change your password in the profile settings
               afterwards.
             </p>
-            <p className="text-sm text-gray-500 dark:text-gray-400">
+            <p className="text-sm text-neutral">
               You wont get logged in if you haven&apos;t created an account yet.
             </p>
           </div>

pages/links/[id].tsx

@@ -185,7 +185,7 @@ export default function Index() {
                 />
               )}
 
-              <div className="flex gap-2 text-sm text-gray-500 dark:text-gray-300">
+              <div className="flex gap-2 text-sm text-neutral">
                 <p className=" min-w-fit">
                   {link?.createdAt
                     ? new Date(link?.createdAt).toLocaleString("en-US", {

pages/links/index.tsx

@@ -42,7 +42,7 @@ export default function Links() {
               <FontAwesomeIcon
                 icon={faSort}
                 id="sort-dropdown"
-                className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                className="w-5 h-5 text-neutral"
               />
             </div>
 

pages/links/pinned.tsx

@@ -42,7 +42,7 @@ export default function PinnedLinks() {
               <FontAwesomeIcon
                 icon={faSort}
                 id="sort-dropdown"
-                className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                className="w-5 h-5 text-neutral"
               />
             </div>
 
@@ -69,7 +69,7 @@ export default function PinnedLinks() {
             <p className="text-center text-2xl">
               Pin Your Favorite Links Here!
             </p>
-            <p className="text-center mx-auto max-w-96 w-fit text-gray-500 dark:text-gray-300 text-sm mt-2">
+            <p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
               You can Pin your favorite Links by clicking on the three dots on
               each Link and clicking{" "}
               <span className="font-semibold">Pin to Dashboard</span>.

pages/login.tsx

@@ -97,10 +97,7 @@ export default function Login() {
             />
             {emailEnabled && (
               <div className="w-fit ml-auto mt-1">
-                <Link
-                  href={"/forgot"}
-                  className="text-gray-500 dark:text-gray-400 font-semibold"
-                >
+                <Link href={"/forgot"} className="text-neutral font-semibold">
                   Forgot Password?
                 </Link>
               </div>
@@ -125,9 +122,7 @@ export default function Login() {
           {process.env.NEXT_PUBLIC_DISABLE_REGISTRATION ===
           "true" ? undefined : (
             <div className="flex items-baseline gap-1 justify-center">
-              <p className="w-fit text-gray-500 dark:text-gray-400">
-                New here?
-              </p>
+              <p className="w-fit text-neutral">New here?</p>
               <Link href={"/register"} className="block font-semibold">
                 Sign Up
               </Link>

pages/public/collections/[id].tsx

@@ -184,7 +184,7 @@ export default function PublicCollections() {
                 </div>
               ) : null}
 
-              <p className="ml-2 mt-1 text-gray-500 dark:text-gray-300">
+              <p className="ml-2 mt-1 text-neutral">
                 By {collectionOwner.name}
                 {collection.members.length > 0
                   ? ` and ${collection.members.length} others`
@@ -215,7 +215,7 @@ export default function PublicCollections() {
                   <FontAwesomeIcon
                     icon={faFilter}
                     id="filter-dropdown"
-                    className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                    className="w-5 h-5 text-neutral"
                   />
                 </div>
 
@@ -237,7 +237,7 @@ export default function PublicCollections() {
                   <FontAwesomeIcon
                     icon={faSort}
                     id="sort-dropdown"
-                    className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                    className="w-5 h-5 text-neutral"
                   />
                 </div>
 

pages/public/links/[id].tsx

@@ -185,7 +185,7 @@ export default function Index() {
                 />
               )}
 
-              <div className="flex gap-2 text-sm text-gray-500 dark:text-gray-300">
+              <div className="flex gap-2 text-sm text-neutral">
                 <p className=" min-w-fit">
                   {link?.createdAt
                     ? new Date(link?.createdAt).toLocaleString("en-US", {

pages/register.tsx

@@ -190,7 +190,7 @@ export default function Register() {
 
             {process.env.NEXT_PUBLIC_STRIPE ? (
               <div>
-                <p className="text-xs text-gray-500 dark:text-gray-400">
+                <p className="text-xs text-neutral">
                   By signing up, you agree to our{" "}
                   <Link
                     href="https://linkwarden.app/tos"
@@ -207,7 +207,7 @@ export default function Register() {
                   </Link>
                   .
                 </p>
-                <p className="text-xs text-gray-500 dark:text-gray-400">
+                <p className="text-xs text-neutral">
                   Need help?{" "}
                   <Link
                     href="mailto:support@linkwarden.app"
@@ -227,9 +227,7 @@ export default function Register() {
               <p className="text-center w-full font-bold">Sign Up</p>
             </button>
             <div className="flex items-baseline gap-1 justify-center">
-              <p className="w-fit text-gray-500 dark:text-gray-400">
-                Already have an account?
-              </p>
+              <p className="w-fit text-neutral">Already have an account?</p>
               <Link href={"/login"} className="block font-bold">
                 Login
               </Link>

pages/search.tsx

@@ -63,7 +63,7 @@ export default function Search() {
                 <FontAwesomeIcon
                   icon={faFilter}
                   id="filter-dropdown"
-                  className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                  className="w-5 h-5 text-neutral"
                 />
               </div>
 
@@ -85,7 +85,7 @@ export default function Search() {
                 <FontAwesomeIcon
                   icon={faSort}
                   id="sort-dropdown"
-                  className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                  className="w-5 h-5 text-neutral"
                 />
               </div>
 

pages/settings/account.tsx

@@ -178,7 +178,7 @@ export default function Account() {
                 <p className="mb-2">Email</p>
                 {user.email !== account.email &&
                 process.env.NEXT_PUBLIC_STRIPE === "true" ? (
-                  <p className="text-gray-500 dark:text-gray-400 mb-2 text-sm">
+                  <p className="text-neutral mb-2 text-sm">
                     Updating this field will change your billing email as well
                   </p>
                 ) : undefined}
@@ -327,14 +327,14 @@ export default function Account() {
             onClick={() => setUser({ ...user, isPrivate: !user.isPrivate })}
           />
 
-          <p className="text-gray-500 dark:text-gray-300 text-sm">
+          <p className="text-neutral text-sm">
             This will limit who can find and add you to new Collections.
           </p>
 
           {user.isPrivate && (
             <div className="pl-5">
               <p className="mt-2">Whitelisted Users</p>
-              <p className="text-gray-500 dark:text-gray-300 text-sm mb-3">
+              <p className="text-neutral text-sm mb-3">
                 Please provide the Username of the users you wish to grant
                 visibility to your profile. Separated by comma.
               </p>

pages/settings/delete.tsx

@@ -57,7 +57,7 @@ export default function Password() {
       <div className="p-4 mx-auto relative flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
         <Link
           href="/settings/account"
-          className="absolute top-4 left-4 gap-1 items-center select-none cursor-pointer p-2 text-gray-500 dark:text-gray-300 rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
+          className="absolute top-4 left-4 gap-1 items-center select-none cursor-pointer p-2 text-neutral rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
         >
           <FontAwesomeIcon icon={faChevronLeft} className="w-5 h-5" />
         </Link>

pages/subscribe.tsx

@@ -77,9 +77,7 @@ export default function Subscribe() {
         <div className="flex flex-col gap-2 justify-center items-center">
           <p className="text-3xl">
             ${plan === Plan.monthly ? "4" : "3"}
-            <span className="text-base text-gray-500 dark:text-gray-400">
-              /mo
-            </span>
+            <span className="text-base text-neutral">/mo</span>
           </p>
           <p className="font-semibold">
             Billed {plan === Plan.monthly ? "Monthly" : "Yearly"}
@@ -108,7 +106,7 @@ export default function Subscribe() {
 
         <div
           onClick={() => signOut()}
-          className="w-fit mx-auto cursor-pointer text-gray-500 dark:text-gray-400 font-semibold "
+          className="w-fit mx-auto cursor-pointer text-neutral font-semibold "
         >
           Sign Out
         </div>

pages/tags/[id].tsx

@@ -127,7 +127,7 @@ export default function Index() {
                       <FontAwesomeIcon
                         icon={faCheck}
                         id="expand-dropdown"
-                        className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                        className="w-5 h-5 text-neutral"
                       />
                     </div>
                     <div
@@ -138,7 +138,7 @@ export default function Index() {
                       <FontAwesomeIcon
                         icon={faXmark}
                         id="expand-dropdown"
-                        className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                        className="w-5 h-5 text-neutral"
                       />
                     </div>
                   </form>
@@ -157,7 +157,7 @@ export default function Index() {
                       <FontAwesomeIcon
                         icon={faEllipsis}
                         id="expand-dropdown"
-                        className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                        className="w-5 h-5 text-neutral"
                       />
                     </div>
 
@@ -202,7 +202,7 @@ export default function Index() {
               <FontAwesomeIcon
                 icon={faSort}
                 id="sort-dropdown"
-                className="w-5 h-5 text-gray-500 dark:text-gray-300"
+                className="w-5 h-5 text-neutral"
               />
             </div>