diff --git a/src/components/Directory/CardViewContact.jsx b/src/components/Directory/CardViewContact.jsx
index 8e6c8068..010d652e 100644
--- a/src/components/Directory/CardViewContact.jsx
+++ b/src/components/Directory/CardViewContact.jsx
@@ -120,13 +120,13 @@ const CardViewContact = ({
           </div>
 
           <ul className="list-inline m-0 ps-4 d-flex align-items-start">
-            <li className="list-inline-item text-break small px-1 ms-5">
+            <li className="list-inline-item text-break small px-1 ms-3">
               {contact?.organization}
             </li>
           </ul>
         </div>
         <div
-          className={`card-footer text-start px-9 py-1 ${
+          className={`card-footer text-start px-7 py-1 ${
             IsActive && "cursor-pointer"
           }`}
           onClick={() => {
diff --git a/src/components/Directory/NoteCardDirectoryEditable.jsx b/src/components/Directory/NoteCardDirectoryEditable.jsx
index 5ef8d08f..49fbda73 100644
--- a/src/components/Directory/NoteCardDirectoryEditable.jsx
+++ b/src/components/Directory/NoteCardDirectoryEditable.jsx
@@ -77,7 +77,7 @@ const NoteCardDirectoryEditable = ({
         key={noteItem.id}
       >
         {/* Header */}
-        <div className="d-flex justify-content-between align-items-center mb-1">
+        <div className="d-flex justify-content-between ms-1 align-items-center mb-1">
           <div className="d-flex align-items-center">
             <Avatar
               size="xxs"
@@ -184,7 +184,7 @@ const NoteCardDirectoryEditable = ({
           </>
         ) : (
           <div
-            className="mx-4 px-10 text-start"
+            className="mx-4 px-8 text-start"
             dangerouslySetInnerHTML={{ __html: noteItem.note }}
           />
         )}
diff --git a/src/pages/Directory/DirectoryPage.jsx b/src/pages/Directory/DirectoryPage.jsx
index e0871446..d9b4885c 100644
--- a/src/pages/Directory/DirectoryPage.jsx
+++ b/src/pages/Directory/DirectoryPage.jsx
@@ -44,7 +44,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
   const [searchNote, setSearchNote] = useState("");
   const [activeTab, setActiveTab] = useState("notes");
   const { setActions } = useFab();
-  const [gridView, setGridView] = useState(false);
+  const [gridView, setGridView] = useState(true);
   const [isOpenBucket, setOpenBucket] = useState(false);
   const [isManageContact, setManageContact] = useState({
     isOpen: false,
@@ -167,7 +167,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                       <div className="col-8 col-md-3">
                         <input
                           type="search"
-                          className="form-control form-control-sm"
+                          className="form-control form-control-sm ms-4"
                           placeholder="Search notes..."
                           value={searchNote}
                           onChange={(e) => setSearchNote(e.target.value)}
@@ -181,14 +181,14 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                           <div className="col-7 col-md-4">
                             <input
                               type="search"
-                              className="form-control form-control-sm"
+                              className="form-control form-control-sm ms-4"
                               placeholder="Search contacts..."
                               value={searchContact}
                               onChange={(e) => setsearchContact(e.target.value)}
                             />
                           </div>
                            <button
-                            className={`btn btn-sm p-1 ${gridView ? " btn-primary" : " btn-outline-primary"
+                            className={`btn btn-sm p-1 ms-4 ${gridView ? " btn-primary" : " btn-outline-primary"
                               }`}
                             onClick={() => setGridView(true)}
                           >