UI changes in Employee Profile and Project Profile.

src/components/Project/AboutProject.jsx

@@ -100,7 +100,7 @@ const AboutProject = () => {
                     <i className="bx bx-trophy"></i>
                     <span className="fw-medium mx-2">Status:</span>
                   </div>
-                  <span>{projects_Details?.projectStatus?.status.replace(/\s/g, '')}</span>
+                  <span>{projects_Details?.projectStatus?.status}</span>
                 </li>
                 <li className="d-flex mb-3">
                   <div className="d-flex align-items-center" style={{ width: '120px' }}>
@@ -124,6 +124,23 @@ const AboutProject = () => {
 
 
 
+                <li className="d-flex justify-content-center mt-4"> {/* Added mt-4 for some top margin */}
+                  {manageProject && (
+                    <button
+                      type="button"
+                      className={`btn btn-sm btn-primary ${!manageProject && "d-none"
+                        }`}
+                      data-bs-toggle="modal"
+                      data-bs-target="#edit-project-modal"
+                      onClick={() => setIsOpenModal(true)}
+                    >
+                      Modify Details
+                    </button>
+                  )}
+                </li>
+              </ul>
+
+
                 <li className="d-flex justify-content-center mt-4"> {/* Added mt-4 for some top margin */}
                   {manageProject && (
                     <button