Fix "login" button text wrap on mobile (#1315)

Co-authored-by: Nathan Sarrazin <[email protected]>

src/lib/components/DisclaimerModal.svelte

@@ -54,11 +54,14 @@
 				<form action="{base}/login" target="_parent" method="POST" class="w-full">
 					<button
 						type="submit"
-						class="flex w-full items-center justify-center whitespace-nowrap rounded-full border-2 border-black bg-black px-5 py-2 text-lg font-semibold text-gray-100 transition-colors hover:bg-gray-900"
+						class="flex w-full flex-wrap items-center justify-center whitespace-nowrap rounded-full border-2 border-black bg-black px-5 py-2 text-lg font-semibold text-gray-100 transition-colors hover:bg-gray-900"
 					>
 						Sign in
 						{#if envPublic.PUBLIC_APP_NAME === "HuggingChat"}
-							with <LogoHuggingFaceBorderless classNames="text-xl mr-1 ml-1.5 flex-none" /> Hugging Face
+							<span class="flex items-center">
+								&nbsp;with <LogoHuggingFaceBorderless classNames="text-xl mr-1 ml-1.5 flex-none" /> Hugging
+								Face
+							</span>
 						{/if}
 					</button>
 				</form>

src/lib/components/LoginModal.svelte

@@ -37,11 +37,13 @@
 			{#if $page.data.loginRequired}
 				<button
 					type="submit"
-					class="flex w-full items-center justify-center whitespace-nowrap rounded-full bg-black px-5 py-2 text-center text-lg font-semibold text-gray-100 transition-colors hover:bg-gray-900"
+					class="flex w-full flex-wrap items-center justify-center whitespace-nowrap rounded-full bg-black px-5 py-2 text-center text-lg font-semibold text-gray-100 transition-colors hover:bg-gray-900"
 				>
 					Sign in
 					{#if envPublic.PUBLIC_APP_NAME === "HuggingChat"}
-						with <LogoHuggingFaceBorderless classNames="text-xl mr-1 ml-1.5" /> Hugging Face
+						<span class="flex items-center">
+							&nbsp;with <LogoHuggingFaceBorderless classNames="text-xl mr-1 ml-1.5" /> Hugging Face
+						</span>
 					{/if}
 				</button>
 			{:else}