updates on the changes

src/pages/nearle/deliveries/deliveries.js

@@ -1345,7 +1345,7 @@ const Deliveries = () => {
         <Table density="compact" dividers="rows">
           <TableHeader>
             <TableRow>
-              <TableHeaderCell>#</TableHeaderCell>
+              <TableHeaderCell style={{ minWidth: 40, width: 40, maxWidth: 40 }}>#</TableHeaderCell>
               <TableHeaderCell>Item</TableHeaderCell>
               <TableHeaderCell>Category</TableHeaderCell>
               <TableHeaderCell style={{ textAlign: 'right' }}>Weight</TableHeaderCell>
@@ -1545,7 +1545,7 @@ const Deliveries = () => {
                 hasDivider={false}
               />
               <HStack gap={2} vAlign="center">
-                <VStack width={260} padding={0} gap={0}>
+                <VStack maxWidth={260} width="100%" padding={0} gap={0}>
                   <DebounceSearchBar value={searchword} onChange={setSearchword} onDebouncedChange={setDebouncedSearch} />
                 </VStack>
 
@@ -1781,7 +1781,7 @@ const Deliveries = () => {
                                 key={header.id}
                                 scope="col"
                                 aria-sort={sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : canSort ? 'none' : undefined}
-                                style={{ width: header.getSize(), textAlign: align, position: 'relative' }}
+                                style={{ width: header.getSize(), minWidth: header.column.columnDef.minSize, maxWidth: header.column.columnDef.maxSize || header.getSize(), textAlign: align, position: 'relative' }}
                               >
                                 <HStack
                                   gap={1}