feat: enhance user dashboards and pages with improved layout and styling

Co-authored-by: Copilot <copilot@github.com>

apps/infoalloggi/src/components/area-riservata/dashboard.tsx

@@ -66,8 +66,13 @@ export const UserDashboard = ({ userId }: { userId: UsersId }) => {
 	if (isLoading) return <LoadingPage />;
 
 	return (
-		<div className="flex w-full flex-1 flex-col items-start justify-center gap-4 overflow-auto p-2 md:gap-6">
-			<h3 className="font-bold text-2xl">Le tue ricerche</h3>
+		<div className="mx-1 mt-2 flex w-full flex-1 flex-col items-start justify-center gap-4 overflow-auto p-2 md:gap-6">
+			<h3 className="font-bold text-2xl">
+				Le tue ricerche:{" "}
+				<span className="font-normal text-xl">
+					(seleziona una per visualizzarne i dettagli)
+				</span>
+			</h3>
 
 			<div className="flex w-full flex-1 grow flex-col space-y-5">
 				<ServizioList data={data || []} isAdmin={false} userId={userId} />

apps/infoalloggi/src/components/navbar/login-button.tsx

@@ -98,7 +98,11 @@ export const UserHeaderSection = ({
 							)}
 						</Button>
 					</DropdownMenuTrigger>
-					<DropdownMenuContent align="end" className="w-56" forceMount>
+					<DropdownMenuContent
+						align="end"
+						className="w-56 border-accent"
+						forceMount
+					>
 						{user.isAdmin ? (
 							<>
 								<DropdownMenuLabel className="font-normal">
@@ -180,12 +184,21 @@ const Items = ({
 				<DropdownMenuItem className="p-0" key={item.href}>
 					<Link
 						aria-label={`Link to ${item.title}`}
-						className="flex h-full w-full items-center gap-3 px-2 py-1.5"
+						className={cn(
+							"flex h-full w-full items-center gap-3 px-2 py-1.5",
+							item.href === "/area-riservata/dashboard" &&
+								"rounded-md bg-primary font-medium text-primary-foreground",
+						)}
 						href={item.href}
 						onClick={() => setOpen(false)}
 					>
 						<IconMatrix
-							className={cn("size-6", item.icon.className)}
+							className={cn(
+								"size-6",
+								item.icon.className,
+								item.href === "/area-riservata/dashboard" &&
+									"text-primary-foreground",
+							)}
 							type={item.icon.icon}
 						/>
 

apps/infoalloggi/src/pages/area-riservata/allegati.tsx

@@ -17,7 +17,7 @@ const Allegati: NextPageWithLayout = () => {
 				<title>Allegati - Infoalloggi.it</title>
 			</Head>
 
-			<div className="grow p-4">
+			<div className="mx-1 mt-2 max-w-8xl grow p-2">
 				<AllegatiComp isAdmin={session.user.isAdmin} userId={session.user.id} />
 			</div>
 		</>

apps/infoalloggi/src/pages/area-riservata/comunicazioni.tsx

@@ -20,7 +20,7 @@ const Comunicazioni: NextPageWithLayout = () => {
 				<title>Comunicazioni - Infoalloggi.it</title>
 			</Head>
 
-			<div className="mx-auto max-w-8xl grow p-4">
+			<div className="mx-auto mt-1 max-w-8xl grow p-2">
 				<div className="p-1">
 					<h1 className="font-bold text-2xl">Comunicazioni</h1>
 				</div>

apps/infoalloggi/src/pages/test.tsx

@@ -1,5 +1,12 @@
+import OnboardingDemo from "~/components/onboarding";
+
 const Test = () => {
-	return <main className="flex flex-col gap-4 p-8">test</main>;
+	return (
+		<main className="flex flex-col gap-4 p-8">
+			test
+			<OnboardingDemo />
+		</main>
+	);
 };
 
 export default Test;