refac: styling

src/lib/components/admin/Users/Groups.svelte

@@ -211,11 +211,11 @@
 		{:else}
 			<div>
 				<div class=" flex items-center gap-3 justify-between text-xs uppercase px-1 font-bold">
-					<div class="w-full">Group</div>
+					<div class="w-full basis-3/5">Group</div>
 
-					<div class="w-full">Users</div>
+					<div class="w-full basis-1/5">Users</div>
 
-					<div class="w-full"></div>
+					<div class="w-full basis-1/5"></div>
 				</div>
 
 				<hr class="mt-1.5 border-gray-100 dark:border-gray-850" />

src/lib/components/admin/Users/Groups/GroupItem.svelte

@@ -61,14 +61,16 @@
 		showEdit = true;
 	}}
 >
-	<div class="flex items-center gap-1.5 w-full font-medium">
+	<div class="flex items-center gap-1.5 w-full font-medium basis-3/5">
 		<div>
 			<UserCircleSolid className="size-4" />
 		</div>
-		{group.name}
+		<div class="line-clamp-1">
+			{group.name}
+		</div>
 	</div>
 
-	<div class="flex items-center gap-1.5 w-full font-medium">
+	<div class="flex items-center gap-1.5 w-full font-medium basis-1/5">
 		{group.user_ids.length}
 
 		<div>
@@ -76,7 +78,7 @@
 		</div>
 	</div>
 
-	<div class="w-full flex justify-end">
+	<div class="w-full flex justify-end basis-1/5">
 		<div class=" rounded-lg p-1 hover:bg-gray-100 dark:hover:bg-gray-850 transition">
 			<Pencil className="size-3.5" />
 		</div>