feat: hecho tema de imagenes en perfil

> mamita como renegue
- arreglado modificar usuarios admin
- añadido subir pfp

src/routes/(privado)/admin/+page.ts

@@ -14,7 +14,6 @@ export async function load({}) {
 			Authorization: `Bearer ${get(sesionStore)?.accessToken}`
 		}
 	});
-
 	if (response.status === 401) {
 		throw redirect(302, '/');
 	}

src/routes/[perfil]/+page.svelte

@@ -25,6 +25,10 @@
 	import CardHeader from '@/components/ui/card/card-header.svelte';
 	import CardTitle from '@/components/ui/card/card-title.svelte';
 	import Badge from '@/components/ui/badge/badge.svelte';
+	import Pen from '@lucide/svelte/icons/pen';
+	import CardCargando from '@/components/CardCargando.svelte';
+	import CardError from '@/components/CardError.svelte';
+	import CardPerfil from '@/components/CardPerfil.svelte';
 
 	let { params } = $props();
 
@@ -79,27 +83,7 @@
 <div class="flex min-h-fit w-full items-center justify-center p-6 md:p-10">
 	<div class="w-full max-w-6xl">
 		<div class="flex gap-2">
-			<Card class="mb-2 flex w-3/4 overflow-hidden">
-				<CardContent>
-					<div class="flex justify-center">
-						<Avatar class="mt-2 scale-250 border-2 border-slate-950">
-							<AvatarImage></AvatarImage>
-							<AvatarFallback>{page.data.displayName?.[0]?.toUpperCase() || ''}</AvatarFallback>
-						</Avatar>
-					</div>
-					<h1
-						class="mt-10 scroll-m-20 text-center text-2xl font-extrabold tracking-tight lg:text-5xl"
-					>
-						{page.data.displayName}
-					</h1>
-					<h3 class="scroll-m-20 text-center text-2xl tracking-tight text-muted-foreground">
-						@{params.perfil}
-					</h3>
-					<p class="mt-4 rounded-full bg-accent p-4 text-center text-muted-foreground">
-						{page.data.bio}
-					</p>
-				</CardContent>
-			</Card>
+			<CardPerfil data={page.data} />
 			<aside class="flex w-1/4 flex-col gap-2">
 				<Card class="w-full">
 					<CardContent>
@@ -161,25 +145,9 @@
 
 		<hr class="mb-8" />
 		{#if cargando}
-			<div out:slide>
-				<Card>
-					<CardContent class="flex w-full flex-col items-center justify-center">
-						<Spinner class="size-9" />
-						<p class="leading-7 not-first:mt-6">Cargando</p>
-					</CardContent>
-				</Card>
-			</div>
+			<CardCargando />
 		{:else if mensajeError !== ''}
-			<div in:fade>
-				<Card class="border-red-500">
-					<CardContent class="flex w-full flex-col items-center justify-center">
-						<Ban class="scale-120 text-red-500"></Ban>
-						<p class="mt-2 text-lg leading-7 text-red-500">
-							{mensajeError}
-						</p>
-					</CardContent>
-				</Card>
-			</div>
+			<CardError {mensajeError} />
 		{:else}
 			<div class="flex flex-col gap-2">
 				{#each $posts as post (post.id)}