First Prototype Frontend (Not Finished)

anwendung/src/components/InputForm.jsx

@@ -2,15 +2,33 @@ import CourseNameInput from "@/components/CourseNameInput";
 import SemesterRangeInput from "@/components/SemesterRangeInput";
 import InputFormButtons from "@/components/InputFormButtons";
 import DozentSelector from "@/components/DozentSelector";
+import Button from "@/components/Button";
+import {useRouter} from "next/router";
 
 export default function InputForm() {
+
+    const router = useRouter();
+
     return (
         <>
             <div className="inputForm round-border">
                 <CourseNameInput/>
-                <SemesterRangeInput/>
+                <div className="semesterRangeInput">
+                    <div className="semesterDateLables">
+                        <p className="semesterDateLable">Semesterstart</p>
+                        <p className="semesterDateLable">Semesterende</p>
+                    </div>
+                    <div className="semesterDateInputPair">
+                        <input type="date" id="start" name="trip-start"/>
+                        <p className="inputFieldSeperator">-</p>
+                        <input type="date" id="start" name="trip-start"/>
+                    </div>
+                </div>
                 <DozentSelector/>
-                <InputFormButtons/>
+                <div id="buttons">
+                    <Button color="red" width="100px" height="30px" text="Abbrechen" onClick={() => {router.back()}}/>
+                    <Button color="green" width="100px" height="30px" text="Erstellen"/>
+                </div>
             </div>
         </>
     )