Adrien Denat coyotte508 HF staff commited on
Commit
9a2f641
1 Parent(s): 3e3029f

Fix intro layout mobile (#107)

Browse files

* take ChatIntroduction outside of chatmessages so it doesn't scroll down automatically

* fix chat intro not scrollable on mobile viewport

* Revert "fix chat intro not scrollable on mobile viewport"

This reverts commit 6f83f2eb6109614c487051573e8d72bebb13b425.

* Revert "take ChatIntroduction outside of chatmessages so it doesn't scroll down automatically"

This reverts commit 812f581271a7af73e38afdc1f90623fd1189e687.

* update snapScrollToBottom so it only triggers if dependency is truthy

* fix ambiguious boolean type

Co-authored-by: Eliott C. <coyotte508@gmail.com>

---------

Co-authored-by: Eliott C. <coyotte508@gmail.com>

src/lib/actions/snapScrollToBottom.ts CHANGED
@@ -41,7 +41,9 @@ export const snapScrollToBottom = (node: HTMLElement, dependency: any) => {
41
 
42
  node.addEventListener("scroll", handleScroll);
43
 
44
- updateScroll({ force: true });
 
 
45
 
46
  return {
47
  update: updateScroll,
 
41
 
42
  node.addEventListener("scroll", handleScroll);
43
 
44
+ if (dependency) {
45
+ updateScroll({ force: true });
46
+ }
47
 
48
  return {
49
  update: updateScroll,
src/lib/components/chat/ChatMessages.svelte CHANGED
@@ -26,7 +26,7 @@
26
 
27
  <div
28
  class="overflow-y-auto h-full scrollbar-custom mr-1"
29
- use:snapScrollToBottom={messages}
30
  bind:this={chatContainer}
31
  >
32
  <div class="max-w-3xl xl:max-w-4xl mx-auto px-5 pt-6 flex flex-col gap-5 sm:gap-8 h-full">
 
26
 
27
  <div
28
  class="overflow-y-auto h-full scrollbar-custom mr-1"
29
+ use:snapScrollToBottom={messages.length ? messages : false}
30
  bind:this={chatContainer}
31
  >
32
  <div class="max-w-3xl xl:max-w-4xl mx-auto px-5 pt-6 flex flex-col gap-5 sm:gap-8 h-full">