Auto Scroll CalenderView to Middle

anwendung/src/components/CalenderView.jsx

@@ -1,4 +1,4 @@
-import {useEffect, useState} from "react";
+import {useEffect, useRef, useState} from "react";
 import Button from "@/components/Button";
 import {list} from "postcss";
 import Background from "@/components/Background";
@@ -18,6 +18,7 @@ export default function CalenderView(p) {
 
     const [entries, setEntries] = useState([[], [], [], [], [], []])
     const [update, setUpdate] = useState(false)
+    const scrollRef = useRef(null);
 
     function readEntries() {
         let url = "http://localhost:8080/entries?semesterid=" + localStorage.getItem("currentsid") +
@@ -189,6 +190,7 @@ export default function CalenderView(p) {
             semesterStart = s.startday;
         }).then(readEntries)
 
+        scrollRef.current.scrollTop = 600;
         window.addEventListener("contextmenu", (e) => (e.preventDefault()))
 
         setInterval(function(){
@@ -232,6 +234,7 @@ export default function CalenderView(p) {
                 flexDirection: "row",
                 justifyContent: "center",
                 alignItems: "center",
+                backgroundColor: "white",
                 gap: 5
             }}>
 
@@ -246,7 +249,7 @@ export default function CalenderView(p) {
                             <div className={"wochen-tag font-big"}>Samstag {new Date(currentYear, 0, currentWeekStartDay + 5).getDate()}.</div>
                         </div>
                     </div>
-                    <div className={"calender-container"}>
+                    <div className={"calender-container"} ref={scrollRef}>
 
                         <div className={"calender-view content"} style={{height: cellHeight * 96 + 10}}>