SICP-INTERACTIVE: Fix scrolling behaviour (#1811)

* Fix scroll into view causing page to shift

* Fix prettier formatting

src/pages/sicp/Sicp.tsx

@@ -109,22 +109,22 @@ const Sicp: React.FC<SicpProps> = props => {
   }, [section]);
 
   // Scroll to correct position
-  React.useLayoutEffect(() => {
+  React.useEffect(() => {
     const hash = props.location.hash;
 
     if (!hash) {
       if (topRef.current) {
-        topRef.current.scrollIntoView();
+        topRef.current.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
       }
       return;
     }
 
     const ref = refs.current[hash];
 
     if (ref) {
-      ref.scrollIntoView({ block: 'start' });
+      ref.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
     }
-  }, [props.location.hash, data]);
+  }, [props.location.hash]);
 
   // Close all active code snippet when new page is loaded
   React.useEffect(() => {

src/styles/_sicp.scss

@@ -41,7 +41,6 @@ $sicp-background-color: #ffffff;
     margin: 1em auto;
     padding: 0 6em;
     max-width: 1050px;
-
     height: fit-content;
     background-color: $sicp-background-color;