src/components/Documents/Documents.jsx

@@ -149,11 +149,30 @@ const Documents = ({ Document_Entity, Entity }) => {
               </label>
             </div>
 
+            {/* Actions */}
             <div className="col-6 col-md-6 col-lg-8 text-end">
+              {/* <span
+              className="text-tiny text-muted p-1 border-0 bg-none lead mx-3 cursor-pointer"
+              disabled={isRefetching}
+              onClick={() => {
+                setSearchText("");
+                setFilter(DocumentFilterDefaultValues);
+                refetchFn && refetchFn();
+              }}
+            >
+              Refresh
+              <i
+                className={`bx bx-refresh ms-1 ${
+                  isRefetching ? "bx-spin" : ""
+                }`}
+              ></i>
+            </span> */}
+
               {(isSelf || canUploadDocument) && (
                 <button
-                  className="btn btn-sm btn-primary me-3"
                   type="button"
+                  title="Add New Document"
+                  className="p-1 bg-primary rounded-circle cursor-pointer"
                   onClick={() =>
                     setManageDoc({
                       document: null,
@@ -161,10 +180,7 @@ const Documents = ({ Document_Entity, Entity }) => {
                     })
                   }
                 >
-                  <i className="bx bx-plus-circle me-2"></i>
-                  <span className="d-none d-md-inline-block">
-                    Add New Document
-                  </span>
+                  <i className="bx bx-plus fs-4 text-white"></i>
                 </button>
               )}
             </div>

src/components/Project/Teams.jsx

@@ -308,7 +308,7 @@ const Teams = () => {
                   {activeEmployee ? "Active Employees" : "Inactive Employees"}
                 </label>
               </div>
-              <div className="dataTables_filter d-inline-flex align-items-center ms-2">x``
+              <div className="dataTables_filter d-inline-flex align-items-center ms-2">
                 <input
                   type="search"
                   className="form-control form-control-sm me-4"

src/pages/Expense/ExpensePage.jsx

@@ -131,8 +131,9 @@ const ExpensePage = () => {
                   <div className="col-6  text-end mt-2 mt-sm-0">
                     {IsCreatedAble && (
                       <button
-                        className="btn btn-sm btn-primary"
                         type="button"
+                        className="p-1 me-1 m-sm-0  bg-primary rounded-circle"
+                        title="Add New Expense"
                         onClick={() =>
                           setManageExpenseModal({
                             IsOpen: true,
@@ -140,10 +141,7 @@ const ExpensePage = () => {
                           })
                         }
                       >
-                        <i className="bx bx-plus-circle me-2"></i>
-                        <span className="d-none d-md-inline-block">
-                          Add New Expense
-                        </span>
+                        <i className="bx bx-plus fs-4 text-white"></i>
                       </button>
                     )}
                   </div>

src/pages/Organization/OrganizationPage.jsx

@@ -4,9 +4,9 @@ import { useOrganizationModal } from "../../hooks/useOrganization";
 import OrganizationsList from "../../components/Organization/OrganizationsList";
 
 const OrganizationPage = () => {
-  const { isOpen, orgData, startStep, onOpen, flowType } =
+    const { isOpen, orgData, startStep, onOpen, flowType  } =
     useOrganizationModal();
-  const [searchText, setSearchText] = useState("")
+  const [searchText,setSearchText] = useState("")
 
   return (
     <div className="container-fluid">
@@ -21,7 +21,7 @@ const OrganizationPage = () => {
                 <input
                   type="search"
                   value={searchText}
-                  onChange={(e) => setSearchText(e.target.value)}
+                  onChange={(e)=>setSearchText(e.target.value)}
                   className="form-control form-control-sm w-auto"
                   placeholder="Search Organization"
                   aria-describedby="search-label"
@@ -31,20 +31,18 @@ const OrganizationPage = () => {
 
             <div className="col-6  text-end mt-2 mt-sm-0">
               <button
-                className="btn btn-sm btn-primary"
                 type="button"
-                onClick={() => onOpen({ startStep: 2, flowType: "default" })}
+                className="p-1 me-1 m-sm-0   bg-primary rounded-circle"
+                title="Add New Organization"
+                onClick={()=>onOpen({ startStep: 2,flowType:"default"  })}
               >
-                 <i className="bx bx-plus-circle me-2"></i>
-                  <span className="d-none d-md-inline-block">
-                    Add New Organization
-                  </span>
+                <i className="bx bx-plus fs-4 text-white"></i>
               </button>
             </div>
           </div>
         </div>
       </div>
-      <OrganizationsList searchText={searchText} />
+      <OrganizationsList searchText={searchText}/>
 
     </div>
   );

src/pages/Tenant/TenantPage.jsx

@@ -146,20 +146,19 @@ const TenantPage = () => {
                   >
                     Refresh{" "}
                     <i
-                      className={`bx bx-refresh ms-1 ${isRefetching ? "bx-spin" : ""
-                        }`}
+                      className={`bx bx-refresh ms-1 ${
+                        isRefetching ? "bx-spin" : ""
+                      }`}
                     ></i>
                   </span>
 
                   <button
-                    className="btn btn-sm btn-primary"
                     type="button"
+                    title="Add New Tenant"
+                    className="p-1 bg-primary rounded-circle cursor-pointer"
                     onClick={handleNewTenant}
                   >
-                    <i className="bx bx-plus-circle me-2"></i>
-                  <span className="d-none d-md-inline-block">
-                    Add New Tenant
-                  </span>
+                    <i className="bx bx-plus fs-4 text-white"></i>
                   </button>
                 </div>
               </div>

src/pages/project/ProjectList.jsx

@@ -168,8 +168,9 @@ const ProjectList = () => {
                 <div className="d-flex gap-2 mb-2">
                   <button
                     type="button"
-                    className={`btn  btn-sm p-1 ${!listView ? "btn-primary" : "btn-outline-primary"
-                      }`}
+                    className={`btn  btn-sm p-1 ${
+                      !listView ? "btn-primary" : "btn-outline-primary"
+                    }`}
                     onClick={() => setListView(false)}
                     data-bs-toggle="tooltip"
                     data-bs-custom-class="tooltip"
@@ -179,8 +180,9 @@ const ProjectList = () => {
                   </button>
                   <button
                     type="button"
-                    className={`btn btn-sm p-1  ${listView ? "btn-primary" : "btn-outline-primary"
-                      }`}
+                    className={`btn btn-sm p-1  ${
+                      listView ? "btn-primary" : "btn-outline-primary"
+                    }`}
                     onClick={() => setListView(true)}
                     data-bs-toggle="tooltip"
                     data-bs-custom-class="tooltip"
@@ -190,7 +192,7 @@ const ProjectList = () => {
                   </button>
                 </div>
 
-                <div className="dropdown mt-1">
+                 <div className="dropdown mt-1">
                   <a
                     className="dropdown-toggle hide-arrow cursor-pointer p-1 mt-3 "
                     data-bs-toggle="dropdown"
@@ -241,14 +243,18 @@ const ProjectList = () => {
 
               <div>
                 <button
-                  className="btn btn-sm btn-primary"
                   type="button"
+                  data-bs-toggle="tooltip"
+                  data-bs-offset="0,8"
+                  data-bs-placement="top"
+                  data-bs-custom-class="tooltip"
+                  title="Add New Project"
+                  className={`p-1 me-2 bg-primary rounded-circle ${
+                    !HasManageProject && "d-none"
+                  }`}
                   onClick={handleShow}
                 >
-                  <i className="bx bx-plus-circle me-2"></i>
-                  <span className="d-none d-md-inline-block">
-                    Add New Project
-                  </span>
+                  <i className="bx bx-plus fs-4 text-white"></i>
                 </button>
               </div>
             </div>
@@ -327,8 +333,9 @@ const ProjectList = () => {
                         </div>
                       </th>
                       <th
-                        className={`mx-2 ${HasManageProject ? "d-sm-table-cell" : "d-none"
-                          }`}
+                        className={`mx-2 ${
+                          HasManageProject ? "d-sm-table-cell" : "d-none"
+                        }`}
                       >
                         Action
                       </th>
@@ -396,8 +403,9 @@ const ProjectList = () => {
                 </li>
               ))}
               <li
-                className={`page-item ${currentPage === totalPages && "disabled"
-                  }`}
+                className={`page-item ${
+                  currentPage === totalPages && "disabled"
+                }`}
               >
                 <button
                   className="page-link"