changed style

src/services/pmsGrid/BasicTable.jsx

@@ -216,7 +216,7 @@ const boqData = [
     id: 18,
     category: "Waterproofing Works",
     itemCode: "W-002",
-    description: "Polyurethane Waterproofing Membrane",
+    description: "Polyurethane Waterproofing Membrane Polyurethane Waterproofing Membrane",
     unit: "Sqm",
     quantity: 200,
     rate: 850,

src/services/pmsGrid/PmsGrid.jsx

@@ -256,7 +256,12 @@ export default function PmsGrid({
             <tr className="p-2">
               {features.IsNumbering && (
                 <th>
-                  <h5>#</h5>
+                  #
+                </th>
+              )}
+              {features.expand && (
+                <th className="text-center ticky-action-column">
+                  <i className='bx bx-collapse-vertical'></i>
                 </th>
               )}
               {features.selection && (
@@ -279,23 +284,7 @@ export default function PmsGrid({
                   />
                 </th>
               )}
-              {features.expand && (
+              
-                <th className="text-center ticky-action-column">
-                  <input
-                    type="checkbox"
-                    className="form-check-input mx-3"
-                    checked={
-                      currentRows.length > 0 &&
-                      currentRows.every((r) => selected.has(r[rowKey]))
-                    }
-                    onChange={(e) =>
-                      e.target.checked
-                        ? selectAllOnPage(currentRows)
-                        : deselectAllOnPage(currentRows)
-                    }
-                  />
-                </th>
-              )}
               {visibleColumns.map((col) => {
                 const style = {
                   minWidth: col.width || 120,
@@ -460,6 +449,22 @@ export default function PmsGrid({
             <td className="text-center align-middle p-2">
               <small className="text-secondry">{ind + 1}</small>
             </td>
+          )}
+            {/*  Expand toggle next to selection */}
+          {features.expand && (
+            <td className="text-center align-middle ">
+              <button
+                type="button"
+                className="btn btn-link p-0 border-none text-secondary"
+                onClick={() => toggleExpand(row[rowKey])}
+              >
+                <i
+                  className={`bx ${
+                    isExpanded ? "bxs-chevron-up" : "bxs-chevron-down"
+                  } bx-sm`}
+                ></i>
+              </button>
+            </td>
           )}
           {/*  Selection checkbox (always left) */}
           {features.selection && (
@@ -473,22 +478,7 @@ export default function PmsGrid({
             </td>
           )}
 
-          {/*  Expand toggle next to selection */}
+        
-          {features.expand && (
-            <td className="text-center align-middle p-2">
-              <button
-                type="button"
-                className="btn btn-link p-0 border-0 text-secondary"
-                onClick={() => toggleExpand(row[rowKey])}
-              >
-                <i
-                  className={`bx ${
-                    isExpanded ? "bxs-chevron-up" : "bxs-chevron-down"
-                  } bx-sm`}
-                ></i>
-              </button>
-            </td>
-          )}
 
           {/*  Data columns */}
           {visibleColumns.map((col) => {

src/services/pmsGrid/pms-grid.css

@@ -54,7 +54,13 @@
 }
 
 
-.pms-grid th,
+.pms-grid th {
+   padding: 2px 4px !important;
+  vertical-align: middle;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 .pms-grid td {
   padding: 8px 12px !important;
   vertical-align: middle;
@@ -89,7 +95,7 @@
 }
 
 /*  Always sticky first column (checkbox) */
-.pms-grid th:first-child,
+/* .pms-grid th:first-child,
 .pms-grid td:first-child {
   position: sticky;
   left: 0;
@@ -99,7 +105,7 @@
   min-width: 40px;
   text-align: center;
   box-shadow: 1px 0 1px rgba(0, 0, 0, 0.08);
-}
+} */
 
 /*  Always sticky last column (Actions) */
 .pms-grid .th-lastChild,
@@ -247,3 +253,5 @@
 .dropdown-submenu > .dropdown-menu.show {
   display: block;
 }
+
+