feat: add smooth scrolling

joshuawootonn · Dec 19, 2023 · bbe35e3 · bbe35e3
1 parent 0c571d4
commit bbe35e3
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/src/components/currentVerse.tsx b/src/components/currentVerse.tsx
@@ -314,6 +314,10 @@ export function CurrentVerse({
                 inputRef.current?.focus()
             }}
         >
+            <span
+                id={'scroll-anchor'}
+                className={'inline-block -translate-y-36'}
+            />
             {verse.nodes.map((atom, aIndexPrime) => {
                 const aIndex = verse.nodes
                     .slice(0, aIndexPrime)
@@ -428,6 +432,10 @@ export function CurrentVerse({
                 onInput={handleInput}
                 tabIndex={-1}
                 onFocus={() => {
+                    document.getElementById('scroll-anchor')?.scrollIntoView({
+                        block: 'start',
+                        behavior: 'smooth',
+                    })
                     setIsArenaFocused(true)
                 }}
                 onBlur={() => {