ui tweaks

src/lib/components/Playground/Playground.svelte

@@ -57,7 +57,7 @@
 	let systemMessage: Message = { role: 'system', content: '' };
 	$: messages = currentConversation.messages;
 
-	let hfToken: string | null = '';
+	let hfToken: string | null = import.meta.env.VITE_HF_TOKEN;
 	let viewCode = false;
 	let showTokenModal = false;
 	let loading = false;
@@ -301,6 +301,7 @@
 					submit();
 				}}
 				type="button"
+				disabled={loading}
 				class="flex h-[39px] w-24 items-center justify-center gap-2 rounded-lg bg-black px-5 py-2.5 text-sm font-medium text-white hover:bg-gray-900 focus:outline-none focus:ring-4 focus:ring-gray-300 disabled:opacity-50 dark:border-gray-700 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-gray-700"
 			>
 				{#if loading}

src/lib/components/Playground/PlaygroundMessage.svelte

@@ -13,16 +13,16 @@
 </script>
 
 <div
-	class="@2xl:grid-cols-[130px,1fr,2.5rem] group/message @2xl:gap-4 @2xl:grid-rows-1 group grid grid-cols-[1fr,2.5rem] items-start gap-2 px-6 pb-6 pt-4 hover:bg-gray-50 dark:hover:bg-gray-800/50"
+	class="group/message group grid grid-cols-[1fr,2.5rem] items-start gap-2 px-6 pb-6 pt-4 hover:bg-gray-50 @2xl:grid-cols-[130px,1fr,2.5rem] @2xl:grid-rows-1 @2xl:gap-4 dark:hover:bg-gray-800/50"
 >
-	<div class="@2xl:col-span-1 @2xl:pb-2 col-span-2 pb-1 pt-3 text-sm font-semibold uppercase">
+	<div class="col-span-2 pb-1 pt-3 text-sm font-semibold uppercase @2xl:col-span-1 @2xl:pb-2">
 		{message.role}
 	</div>
 	<textarea
 		{autofocus}
 		bind:value={message.content}
 		placeholder="Enter {message.role} message"
-		class="@2xl:px-3 resize-none rounded bg-transparent px-2 py-2.5 ring-gray-100 [field-sizing:content] hover:resize-y hover:bg-white focus:resize-y focus:bg-white focus:ring group-hover/message:ring dark:ring-gray-600 dark:hover:bg-gray-900 dark:focus:bg-gray-900"
+		class="resize-none rounded bg-transparent px-2 py-2.5 ring-gray-100 [field-sizing:content] hover:resize-y hover:bg-white focus:resize-y focus:bg-white focus:ring group-hover/message:ring @2xl:px-3 dark:ring-gray-600 dark:hover:bg-gray-900 dark:focus:bg-gray-900"
 		rows="1"
 	></textarea>
 	<button