mobile

src/lib/components/InferencePlayground/InferencePlayground.svelte

@@ -208,8 +208,8 @@
 			></textarea>
 		</div>
 	</div>
-	<div class="relative divide-y divide-gray-200 pt-3 dark:divide-gray-800" on:keydown={onKeydown}>
-		<div class="flex h-[calc(100dvh-5rem)] divide-x divide-gray-200 *:w-full dark:divide-gray-800">
+	<div class="relative divide-y divide-gray-200 dark:divide-gray-800" on:keydown={onKeydown}>
+		<div class="flex h-[calc(100dvh-5rem-120px)] md:h-[calc(100dvh-5rem)] divide-x divide-gray-200 *:w-full dark:divide-gray-800 pt-3">
 			<Conversation
 				{loading}
 				{conversation}

src/lib/components/InferencePlayground/InferencePlaygroundMessage.svelte

@@ -27,7 +27,7 @@
 			dispatch("delete");
 		}}
 		type="button"
-		class="mt-1.5 hidden size-8 rounded-lg border border-gray-200 bg-white text-xs font-medium text-gray-900 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 group-hover/message:block dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700"
+		class="mt-1.5 sm:hidden size-8 rounded-lg border border-gray-200 bg-white text-xs font-medium text-gray-900 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 group-hover/message:block dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700"
 		>✕</button
 	>
 </div>