refactor: adjust styles for LangToggle, SiteHeader, and ThemeSwitch components

apps/infoalloggi/src/components/navbar/lang-toggle.tsx

@@ -25,18 +25,18 @@ export const LangToggle = () => {
 	return (
 		<LoadingButton
 			aria-label="Change Language"
-			className="flex w-fit items-center gap-2 text-primary"
+			className="flex h-8 w-fit items-center gap-2 px-3 text-primary"
 			loading={busy}
 			onClick={() => handleLangChange(locale === "it" ? "en" : "it")}
 			variant="outline"
 		>
 			{locale === "it" ? (
 				<>
-					<ItaFlag className="size-5" />
+					<ItaFlag className="size-4" />
 				</>
 			) : (
 				<>
-					<EngFlag className="size-5" />
+					<EngFlag className="size-4" />
 				</>
 			)}
 		</LoadingButton>

apps/infoalloggi/src/components/navbar/site-header.tsx

@@ -33,10 +33,10 @@ export function SiteHeader() {
 					userOpen={openUserMenuSidebar}
 				/>
 
-				<div className="float-end flex flex-1 items-center justify-end gap-2.5">
+				<div className="float-end flex flex-1 items-center justify-end gap-2">
 					<RicercaCommand />
 
-					<div className="hidden w-fit items-center gap-2.5 md:flex">
+					<div className="hidden w-fit items-center gap-2 md:flex">
 						<LangToggle />
 						<ThemeSwitch />
 					</div>

apps/infoalloggi/src/components/navbar/theme-toggle.tsx

@@ -37,7 +37,7 @@ const ThemeSwitchContent = () => {
 		<button
 			aria-label="Toggle Theme"
 			className={cn(
-				`flex h-9 w-16 items-center rounded-full bg-muted p-[5px] shadow-inner hover:cursor-pointer`,
+				`flex h-7 w-12 items-center rounded-full bg-muted p-[5px] shadow-inner hover:cursor-pointer`,
 				theme === "light"
 					? "place-content-end bg-sky-400 hover:bg-sky-500"
 					: "bg-sky-900 hover:bg-sky-800",
@@ -48,7 +48,7 @@ const ThemeSwitchContent = () => {
 			<motion.div
 				animate={{ opacity: 1 }}
 				className={cn(
-					"flex size-7 items-center justify-center rounded-full bg-black",
+					"flex size-5.5 items-center justify-center rounded-full bg-black",
 					theme === "light" ? "bg-yellow-300" : "bg-gray-800/60",
 				)}
 				initial={{ opacity: 0 }}

apps/infoalloggi/src/pages/annunci.tsx

@@ -323,7 +323,7 @@ const RicercaHeader = () => {
 				<div className="flex w-full items-center justify-between gap-2 sm:justify-between">
 					<div className="relative z-35 flex w-full gap-1 sm:w-auto">
 						<CodiceBox
-							className="h-9 w-full border-0"
+							className="h-9 w-full"
 							inputId="annunci-search"
 							optionBoxClassName="top-11 "
 						/>