src/pages/VisProgPage/VisProg.tsx

@@ -1,19 +1,14 @@
-import {Link} from "react-router";
 import VisProgUI from "./visualProgrammingUI/VisProgUI.tsx";
 
 
 //this is your css file where you can style your buttons and such
 //you can still use css parts from App.css, but also overwrite them
 
+
 function VisProgPage() {
   return (
     <>
       <VisProgUI/>
-      <Link to={'/'}> {/* here you link to the homepage, in App.tsx you can link new pages */}
-        <button className="movePage left" onClick={(): void => {}}>
-          Page {'<'}-- Go Home
-        </button>
-      </Link>
     </>
   )
 }

src/pages/VisProgPage/visualProgrammingUI/VisProgUI.css

@@ -21,6 +21,7 @@
     margin-inline-start: auto;
     margin-inline-end: auto;
     background-color: canvas;
+    align-content: center;
     margin-bottom: 0.5rem;
     margin-top:auto;
     width: 50%;

src/pages/VisProgPage/visualProgrammingUI/components/DragDropSidebar.tsx

@@ -148,6 +148,7 @@ export function DndToolbar() {
       borderColor: 'dimgrey',
       backgroundColor: 'canvas',
       display: 'flex',
+      alignItems: 'center',
       flexDirection: 'column',
       gap: '1rem'
     }}>