Added handle to resizable and some minor adjustments

Frontend/power-tracker/src/components/manageGateway.tsx

@@ -60,12 +60,12 @@ function ManageGateways() {
 
     return (
         <ResizablePanelGroup className='flex h-[100%]' direction="horizontal">
-            <ResizablePanel minSize={50}>
+            <ResizablePanel minSize={51}>
                 {/* Title and search bar */}
 				<div className="w-[100%] h-[40px] flex justify-between content-center">
 					<h1 className="scroll-m-20 text-2xl font-semibold tracking-tight">Buildings and Departments</h1>
 					<Input 
-						className="h-[30px] w-[200px]" 
+						className="h-[30px] w-[200px] mr-[10px]" 
 						type="text" 
 						value={search} 
 						onChange={(event) => setSearch(event.target.value) } 
@@ -110,7 +110,7 @@ function ManageGateways() {
 					</AlertDialogContent>
 				</AlertDialog>		
 
-                <Table className='w-[100%]'>
+                <Table className=''>
                     <TableCaption>Gateways</TableCaption>
                     <TableHeader>
                         <TableRow>
@@ -123,7 +123,10 @@ function ManageGateways() {
                     <TableBody>
                         {gatewayData.gateway.map((gates, index) => (
                             <TableRow>
-                                <TableCell className="min-w-[200px] max-w-[400px] scroll-m-20 text-xl font-semibold tracking-tight">{gates.name}</TableCell>
+                                <TableCell className="min-w-[200px] max-w-[300px] scroll-m-20 text-xl font-semibold tracking-tight flex">
+                                    <Router className="mx-[20px]" />
+                                    <h4 className="scroll-m-20 text-xl font-semibold tracking-tight">{gates.name}</h4>
+                                </TableCell>
                                 <TableCell className="w-[400px]">{gates.eui_gate}</TableCell>
                                 <TableCell className="w-[1fr] flex justify-end">
                                     <Button className="h-[30px] w-[60px] mr-[5px]" variant="outline">Edit</Button>
@@ -136,7 +139,7 @@ function ManageGateways() {
                 
             </ResizablePanel>
 
-            <ResizableHandle />
+            <ResizableHandle withHandle className="mx-[10px]" />
             
             <ResizablePanel defaultSize={75} className="w-[400px]">