multi columns layout

src/shared/accounts/active.tsx

@@ -6,15 +6,11 @@ export default function ActiveAccount({ user }: { user: any }) {
 	const userData = JSON.parse(user.metadata);
 
 	return (
-		<button
-			type="button"
-			className="relative h-10 w-10 overflow-hidden rounded-lg"
-		>
+		<button type="button" className="relative h-11 w-11 overflow-hidden">
 			<Image
 				src={userData.picture || DEFAULT_AVATAR}
 				alt="user's avatar"
-				loading="auto"
-				className="h-10 w-10 object-cover"
+				className="h-11 w-11 rounded-md object-cover"
 			/>
 		</button>
 	);

src/shared/accounts/inactive.tsx

@@ -6,11 +6,11 @@ export default function InactiveAccount({ user }: { user: any }) {
 	const userData = JSON.parse(user.metadata);
 
 	return (
-		<div className="relative h-10 w-10 shrink rounded-lg">
+		<div className="relative h-11 w-11 shrink rounded-md">
 			<Image
 				src={userData.picture || DEFAULT_AVATAR}
 				alt="user's avatar"
-				className="h-10 w-10 rounded-lg object-cover"
+				className="h-11 w-11 rounded-lg object-cover"
 			/>
 		</div>
 	);