fixed card width in core.css

public/assets/vendor/css/core.css

@@ -2553,7 +2553,7 @@ progress {
 }
 
 .table-responsive {
-  /* overflow-x: auto; */
+  overflow-x: auto;
   -webkit-overflow-scrolling: touch;
 }
 

src/pages/Directory/Directory.jsx

@@ -260,7 +260,7 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
   }, [prefernceContacts]);
 
   return (
-    <div className="container-fluid">
+    <div className={IsPage ? "container-fluid":""}>
       {IsPage && (
         <Breadcrumb
           data={[

src/pages/project/ProjectList.jsx

@@ -265,12 +265,12 @@ const ProjectList = () => {
 
         {listView ? (
           <div className="card cursor-pointer">
-    <div className="card-body p-2" style={{ minHeight: "200px" }}>
+            <div className="card-body p-2">
-      <div className="table-responsive text-nowrap py-2">
+              <div className="table-responsive text-nowrap py-2 " style={{minHeight:"400px"}}>
                 <table className="table m-3">
                   <thead>
                     <tr>
-              <th className="text-start" colSpan={5}>
+                      <th className="text-start" colSpan={5} >
                         Project Name
                       </th>
                       <th className="mx-2 text-start">Contact Person</th>
@@ -293,6 +293,10 @@ const ProjectList = () => {
                                 id: "b74da4c2-d07e-46f2-9919-e75e49b12731",
                                 label: "Active",
                               },
+                              {
+                                id: "cdad86aa-8a56-4ff4-b633-9c629057dfef",
+                                label:"In Progress"
+                               },
                               {
                                 id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
                                 label: "On Hold",
@@ -309,12 +313,14 @@ const ProjectList = () => {
                               <li key={id}>
                                 <div className="form-check">
                                   <input
-                            className="form-check-input"
+                                    className="form-check-input  "
                                     type="checkbox"
                                     checked={selectedStatuses.includes(id)}
                                     onChange={() => handleStatusChange(id)}
                                   />
-                          <label className="form-check-label">{label}</label>
+                                  <label className="form-check-label">
+                                    {label}
+                                  </label>
                                 </div>
                               </li>
                             ))}
@@ -330,22 +336,11 @@ const ProjectList = () => {
                       </th>
                     </tr>
                   </thead>
-          <tbody className="table-border-bottom-0" style={{ height: "200px" }}>
+                  <tbody className="table-border-bottom-0 overflow-auto ">
                     {currentItems.length === 0 ? (
-              <tr>
+                      <tr className="text-center">
-                <td
+                        <td colSpan="12" rowSpan='12'style={{height:"200px"}} >
-                  colSpan="12"
+                          No projects found
-                  className="text-center"
-                  style={{
-                    verticalAlign: "middle",
-                    height: "200px",
-                    paddingTop: 0,
-                    paddingBottom: 0,
-                  }}
-                >
-                  <div className="d-flex flex-column justify-content-center align-items-center h-100">
-                    <p className="mb-0">No projects found</p>
-                  </div>
                         </td>
                       </tr>
                     ) : (
@@ -359,10 +354,10 @@ const ProjectList = () => {
                     )}
                   </tbody>
                 </table>
+              </div>{" "}
+            </div>{" "}
           </div>
-    </div>
+        ) : (
-  </div>
-) : (
           <div className="row">
             {currentItems.map((project) => (
               <ProjectCard
@@ -372,9 +367,9 @@ const ProjectList = () => {
               />
             ))}
           </div>
-)}
+        )}
 
-{!loading && totalPages > 1 && (
+        {!loading && totalPages > 1 && (
           <nav>
             <ul className="pagination pagination-sm justify-content-end py-2">
               <li className={`page-item ${currentPage === 1 && "disabled"}`}>
@@ -398,7 +393,11 @@ const ProjectList = () => {
                   </button>
                 </li>
               ))}
-      <li className={`page-item ${currentPage === totalPages && "disabled"}`}>
+              <li
+                className={`page-item ${
+                  currentPage === totalPages && "disabled"
+                }`}
+              >
                 <button
                   className="page-link"
                   onClick={() =>
@@ -410,8 +409,7 @@ const ProjectList = () => {
               </li>
             </ul>
           </nav>
-)}
+        )}
-
       </div>
     </>
   );