🎨 add darkmode

src/lib/components/Modal.tsx

@@ -10,7 +10,7 @@ const Modal = ({ children, anchorRef, open = false }: Props) => {
   return (
     <>
       <dialog className="modal" ref={anchorRef} open={open}>
-        <div className="modal-box p-10 bg-white w-[750px] max-w-none text-gray-800">
+        <div className="modal-box p-10 bg-base-100 w-[750px] max-w-none text-base-content">
           {children}
         </div>
         <form method="dialog" className="modal-backdrop">

src/lib/components/UserCard.tsx

@@ -117,7 +117,7 @@ const UserCard = ({ user, actionMode, clickAction }: Props) => {
                   {user.displayName}
                 </a>
               </h2>
-              <p className="whitespace-nowrap w-fit break-all text-gray-500 text-sm">
+              <p className="whitespace-nowrap w-fit break-all text-gray-500 dark:text-gray-400 text-sm">
                 <a
                   href={`https://bsky.app/profile/${user.handle}`}
                   target="_blank"

src/lib/constants.ts

@@ -70,6 +70,6 @@ export const MATCH_TYPE_LABEL_AND_COLOR = {
   },
   [BSKY_USER_MATCH_TYPE.DESCRIPTION]: {
     label: "Included handle name in description",
-    color: "neutral",
+    color: "secondary",
   },
 };