autoscroll fix

frontend/src/pages/Stream.jsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState, useRef, useEffect } from "react";
 
 const streams = [
     { id: "aramstream", label: "Aram" },
@@ -8,15 +8,22 @@ const streams = [
 
 export default function Stream() {
     const [activeStream, setActiveStream] = useState("aramstream");
+    const headerRef = useRef(null);
 
     useEffect(() => {
-        window.scrollTo({ top: 0, behavior: "smooth" });
+        headerRef.current?.scrollIntoView({
-    }, [activeStream]);
+            behavior: "smooth",
+            block: "start",
+        });
+    }, []);
 
     return (
         <div className="text-ctp-text flex flex-col min-h-screen px-4 py-6">
             <div className="w-full text-center flex flex-col flex-1">
-                <h1 className="text-4xl font-bold text-ctp-mauve mb-6">
+                <h1
+                    ref={headerRef}
+                    className="text-4xl font-bold text-ctp-mauve mb-6"
+                >
                     Stream
                 </h1>
 
@@ -36,7 +43,7 @@ export default function Stream() {
                     ))}
                 </div>
 
-                <div className="flex-1 min-h-0">
+                <div className="stream-frame w-full mx-auto flex-1 max-h-[85vh]">
                     <iframe
                         src={`https://stream.aramjonghu.nl/${activeStream}`}
                         title={activeStream}