diff --git a/Components/ChatArea.svelte b/Components/ChatArea.svelte index fc9033e..f2520b9 100644 --- a/Components/ChatArea.svelte +++ b/Components/ChatArea.svelte @@ -4,8 +4,10 @@ import type { StreamingMarkdownService } from "Services/StreamingMarkdownService"; import ChatAreaThought from "./ChatAreaThought.svelte"; import StreamingIndicator from "./StreamingIndicator.svelte"; + import { slide } from "svelte/transition"; export let messages: Array<{id: string, content: string, isUser: boolean, isStreaming: boolean}> = []; + export let showChatPadding: boolean = false; export let chatContainer: HTMLDivElement; let streamingMarkdownService: StreamingMarkdownService = Resolve(Services.StreamingMarkdownService); @@ -101,6 +103,9 @@
+ {#if showChatPadding} +
+ {/if} {:else} {@html getStaticHTML(message)} @@ -131,6 +136,12 @@ .chat-area::-webkit-scrollbar { display: none; } + + .chat-padding { + background-color: violet; + height: 40vh; + width: 100%; + } .message-container { display: flex; diff --git a/Components/ChatWindow.svelte b/Components/ChatWindow.svelte index 39bb63e..33450b6 100644 --- a/Components/ChatWindow.svelte +++ b/Components/ChatWindow.svelte @@ -17,6 +17,8 @@ let userRequest = ""; let isSubmitting = false; let userHasScrolled = false; + let showChatPadding = false; + let messages: Array<{ id: string, content: string, @@ -48,6 +50,7 @@ isStreaming: true }]; + showChatPadding = true; scrollToBottom(); userHasScrolled = false; @@ -94,8 +97,10 @@ : msg ); } + showChatPadding = false; } } finally { + showChatPadding = false; semaphore.release(); isSubmitting = false; } @@ -133,7 +138,7 @@
- +
diff --git a/Components/StreamingIndicator.svelte b/Components/StreamingIndicator.svelte index 82de269..88b5a55 100644 --- a/Components/StreamingIndicator.svelte +++ b/Components/StreamingIndicator.svelte @@ -21,7 +21,7 @@ align-items: center; position: relative; margin-left: 4px; - margin-top: 12px; + padding-top: 12px; } .📦 {