go to page added

src/components/ReactTable3/BasicTable.js

@@ -94,7 +94,27 @@ const BasicTable = () => {
         {/*  search box */}
         <GlobalFilter filter={globalFilter} setFilter={setGlobalFilter} />
         {/* pagination */}
-        <div className="border border-blue-400 rounded p-1" style={{}}>
+        <div
+          className="border border-blue-400 rounded p-1 flex flex-items-center"
+          style={{}}
+        >
+          {/* go to page */}
+          <div>
+            <input
+              className="ml-1 text-xs"
+              type="number"
+              defaultValue={pageIndex + 1}
+              onChange={(e) => {
+                const pageNumber = e.target.value
+                  ? Number(e.target.value) - 1
+                  : 0;
+                gotoPage(pageNumber);
+              }}
+              style={{ width: "50px" }}
+            />
+            <span className="text-sm"> برو به صفحه </span>
+          </div>
+          {/* arrows */}
           <button
             className="rounded py-1 px-2 mx-1 text-xs"
             style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
@@ -240,21 +260,6 @@ const BasicTable = () => {
           {""}
         </span>
 
-        <span>
-          | Go to Page:{" "}
-          <input
-            type="number"
-            defaultValue={pageIndex + 1}
-            onChange={(e) => {
-              const pageNumber = e.target.value
-                ? Number(e.target.value) - 1
-                : 0;
-              gotoPage(pageNumber);
-            }}
-            style={{ width: "50px" }}
-          />
-        </span>
-
         <select
           value={pageSize}
           onChange={(e) => setPageSize(Number(e.target.value))}

src/components/ReactTable3/index.js

@@ -3,7 +3,7 @@ import BasicTable from "./BasicTable";
 
 const ReactTable3 = ({ breadCrumbs, subTitle, title }) => {
   return (
-    <div className="my-10  w-11/12 mx-auto bg-indigo-200">
+    <div className="my-10  w-11/12 mx-auto">
       {/* breadCrumb */}
       <div className="flex flex-row items-center">
         {breadCrumbs.map((breadCrumb, index) => (