diff --git a/src/components/Directory/NotesDirectory.jsx b/src/components/Directory/NotesDirectory.jsx
index c92713c5..ba4c1b31 100644
--- a/src/components/Directory/NotesDirectory.jsx
+++ b/src/components/Directory/NotesDirectory.jsx
@@ -83,27 +83,19 @@ const NotesDirectory = ({ isLoading, contactProfile, setProfileContact }) => {
 
   return (
     <div className="text-start">
-      <div
-        className={`${
-          contactProfile?.notes?.length > 0
-            ? "d-flex justify-content-between"
-            : "d-flex justify-content-end"
-        }`}
-      >
-        {contactProfile?.notes.length > 0 && (
-          <p className="fw-semibold m-0">Notes :</p>
-        )}
-        <a
-          className="small-text m-0 cursor-pointer"
-          onClick={() => setAddNote(!addNote)}
+      <div className="d-flex align-items-center justify-content-between">
+        <p className="fw-semibold m-0">Notes :</p>
+        <span
+          className={`btn btn-xs   ${addNote ? "btn-danger" : "btn-primary"}`}
+          onClick={() => setAddNote( !addNote )}
         >
-          <u>
-            {addNote ? "" : "Add Note"}
-            <i
-              className={`bx  ${addNote ? "bx-x" : "bx-pencil"} bx-xs`}
-            ></i>{" "}
-          </u>{" "}
-        </a>
+          {/* <i
+            className={`icon-base  bx ${
+              addNote ? "bx-x bx-sm" : "bx-pencil"
+            } bx-xs `}
+          ></i> */}
+          {addNote ? "close" : "Add Note"}
+        </span>
       </div>
       {addNote && (
         <form onSubmit={handleSubmit(onSubmit)}>
@@ -119,10 +111,7 @@ const NotesDirectory = ({ isLoading, contactProfile, setProfileContact }) => {
           )}
         </form>
       )}
-      <div
-        className=" justify-content-start overflow-auto px-1"
-        style={{ maxHeight: "300px" }}
-      >
+      <div className=" justify-content-start  px-1 mt-1">
         {isLoading && (
           <div className="text-center">
             {" "}
@@ -139,7 +128,8 @@ const NotesDirectory = ({ isLoading, contactProfile, setProfileContact }) => {
                 setProfileContact={setProfileContact}
                 key={noteItem.id}
               />
-            ))}
+            ) )}
+        <p>{!isLoading && contactProfile?.notes.length == 0 && !addNote && (<p className="text-center">No Notes Found</p>) }</p>
       </div>
     </div>
   );