changed toggle nutton position for well UI

src/pages/Activities/AttendancePage.jsx

@@ -141,7 +141,7 @@ const AttendancePage = () => {
           ]}
         ></Breadcrumb>
         <div className="nav-align-top nav-tabs-shadow">
-          <ul className="nav nav-tabs" role="tablist">
+          <ul className="nav nav-tabs align-items-center" role="tablist">
             <div
               className="dataTables_length text-start py-2 px-2 d-flex "
               id="DataTables_Table_0_length"
@@ -175,6 +175,25 @@ const AttendancePage = () => {
                 </label>
               )}
             </div>
+            <li
+              className={`nav-item ms-auto ${
+                activeTab === "regularization" ? "d-none" : ""
+              }`}
+            >
+              <label className="switch switch-primary">
+                <input
+                  type="checkbox"
+                  className="switch-input"
+                  checked={showOnlyCheckout}
+                  onChange={handleToggle}
+                />
+                <span className="switch-toggle-slider">
+                  <span className="switch-on"></span>
+                  <span className="switch-off"></span>
+                </span>
+                <span className="switch-label m-2">Pending Actions</span>
+              </label>
+            </li>
           </ul>
 
           <ul className="nav nav-tabs" role="tablist">
@@ -214,27 +233,9 @@ const AttendancePage = () => {
               </button>
             </li>
 
-            <li
+            
-              className={`nav-item ms-auto ${
-                activeTab === "regularization" ? "d-none" : ""
-              }`}
-            >
-              <label className="switch switch-primary">
-                <input
-                  type="checkbox"
-                  className="switch-input"
-                  checked={showOnlyCheckout}
-                  onChange={handleToggle}
-                />
-                <span className="switch-toggle-slider">
-                  <span className="switch-on"></span>
-                  <span className="switch-off"></span>
-                </span>
-                <span className="switch-label m-2">Pending Actions</span>
-              </label>
-            </li>
           </ul>
-          <div className="tab-content attedanceTabs py-2">
+          <div className="tab-content attedanceTabs py-2 px-1 px-sm-3">
             {projectLoading && <span>Loading..</span>}
             {!projectLoading && !attendances && <span>Not Found</span>}