Changes in UI of Directory Notes Tabs and all the popups.

src/components/Directory/BucketForm.jsx

@@ -38,7 +38,7 @@ const BucketForm = ({ selectedBucket, mode, onSubmit, onCancel, isPending }) =>
 
       {(isCreateMode || isEditMode) ? (
         <form onSubmit={handleSubmit(onSubmit)}>
-          <div className="mb-3">
+          <div className="mb-3 mt-5">
             <Label htmlFor="Name" className="text-start" required>
               Name
             </Label>
@@ -65,10 +65,10 @@ const BucketForm = ({ selectedBucket, mode, onSubmit, onCancel, isPending }) =>
             )}
           </div>
 
-          <div className="mt-4 d-flex gap-3 justify-content-end">
+          <div className="mt-4 mb-3 d-flex gap-3 justify-content-end">
             <button
               type="button"
-              className="btn btn-sm btn-secondary"
+              className="btn btn-sm btn-label-secondary"
               onClick={onCancel}
               disabled={isPending}
             >

src/components/Directory/ContactProfile.jsx

@@ -25,7 +25,7 @@ const ContactProfile = ({ contactId }) => {
   return (
     <div className="p-1">
       <div className="text-center m-0 p-0">
-        <p className="fw-semibold fs-6 m-0">Contact Profile</p>
+        <p className="fw-semibold fs-5 m-0">Contact Profile</p>
       </div>
       <div>
         <div className="d-flex align-items-center mb-2">
@@ -65,11 +65,10 @@ const ContactProfile = ({ contactId }) => {
                           {email.emailAddress}
                         </span>
                         <i
-                          className={`bx bx-copy-alt cursor-pointer bx-xs text-start ${
-                            copiedIndex === idx
+                          className={`bx bx-copy-alt cursor-pointer bx-xs text-start ${copiedIndex === idx
                               ? "text-secondary"
                               : "text-primary"
-                          }`}
+                            }`}
                           title={copiedIndex === idx ? "Copied!" : "Copy Email"}
                           style={{ flexShrink: 0 }}
                           onClick={() => handleCopy(email.emailAddress, idx)}

src/components/Directory/ManageBucket1.jsx

@@ -43,7 +43,7 @@ const ManageBucket1 = () => {
   return (
     <div className="container m-0 p-0" style={{ minHeight: "00px" }}>
       <div className="d-flex justify-content-center">
-        <p className="fs-6 fw-semibold m-0">Manage Buckets</p>
+        <p className="fs-5 fw-semibold m-0">Manage Buckets</p>
       </div>
       {action ? (
         <>

src/components/Directory/ManageContact.jsx

@@ -181,10 +181,10 @@ const ManageContact = ({ contactId, closeModal }) => {
   return (
     <FormProvider {...methods}>
       <form className="p-2 p-sm-0" onSubmit={handleSubmit(onSubmit)}>
-        <div className="d-flex justify-content-center align-items-center">
-          <h6 className="m-0 fw-18">
+        <div className="d-flex justify-content-center align-items-center mb-4">
+          <h5 className="m-0 fw-18">
             {contactId ? "Edit Contact" : "Create New Contact"}
-          </h6>
+          </h5>
         </div>
 
         {/* Name + Organization */}
@@ -473,7 +473,7 @@ const ManageContact = ({ contactId, closeModal }) => {
         {/* Actions */}
         <div className="d-flex justify-content-end gap-3 py-2">
            <button
-            className="btn btn-sm btn-secondary"
+            className="btn btn-sm btn-label-secondary"
             type="button"
             onClick={handleClosed}
             disabled={isPending}

src/components/Directory/NoteCardDirectoryEditable.jsx

@@ -67,7 +67,7 @@ const NoteCardDirectoryEditable = ({
 
   return (
     <>
-      
+
       <div
         className="card shadow-sm border-1 mb-3 p-4 rounded"
         style={{
@@ -162,20 +162,25 @@ const NoteCardDirectoryEditable = ({
               theme="snow"
               className="compact-editor"
             />
-            <div className="d-flex justify-content-end gap-3 mt-2">
-              <span
-                className="text-secondary cursor-pointer"
+            <div className="d-flex justify-content-end gap-0 mt-2">
+              <button
+                type="button"
+                className="btn btn-sm btn-label-secondary me-2 px-2 py-1"
                 onClick={() => setEditing(false)}
               >
                 Cancel
-              </span>
-              <span
-                className="text-primary cursor-pointer"
+              </button>
+
+              <button
+                type="button"
+                className="btn btn-sm btn-primary px-2 py-1"
                 onClick={handleUpdateNote}
+                disabled={isUpatingNote}
               >
                 {isUpatingNote ? "Saving..." : "Submit"}
-              </span>
+              </button>
             </div>
+
           </>
         ) : (
           <div

src/components/common/TextEditor/Editor.jsx

@@ -74,7 +74,7 @@ const Editor = ({
       {/* Right: Submit + Cancel Buttons */}
       <div className="d-flex justify-content-end  gap-2 p-1">
         <span
-          className="btn btn-xs btn-secondary"
+          className="btn btn-xs btn-label-secondary"
           aria-disabled={loading}
           onClick={onCancel}
         >