<html>
<head>
    <!-- Der Titel der Webseite wird in der Registerkarte des Browsers angezeigt. -->
    <title>HTML Formular</title>

    <!-- Interne CSS-Styles für das Layout der Seite. -->
    <style>
        /* Stellt sicher, dass die Labels eine Mindestbreite haben und inline angezeigt werden. */
        label {
            min-width: 100px; /* Mindestbreite für Labels, um eine saubere Ausrichtung zu gewährleisten. */
            display: inline-block; /* Labels werden neben den Eingabefeldern positioniert. */
        }
    </style>
</head>
<body>
    <!-- Beginnt das HTML-Formular. -->
    <form method="post" action="/signUp">
        <!-- Methode "post": Daten werden im Body des HTTP-Requests gesendet.
             Aktion "/signUp": Daten werden an die definierte Route im Flask-Backend gesendet. -->

	<p>Anrede</p>
  <input type="radio" name="anrede" value="herr">
  <label >Herr</label><br>
  <input type="radio" name="anrede" value="frau">
  <label >Frau</label><br>


        <!-- Eingabefeld für den Vornamen des Benutzers -->
       <label for="firstname">Vorname</label>
        <input type="text" id="firstname" name="firstname"/>
        <br/><br/>

        <!-- Eingabefeld für den Nachnamen des Benutzers -->
        <label for="lastname">Nachname</label>
        <input type="text" id="lastname" name="lastname"/>
        <br/><br/>

        <!-- Eingabefeld für die E-Mail-Adresse des Benutzers -->
        <label for="mail">E-Mail Adresse</label>
        <input type="email" id="mail" name="mail"/>
        <br/><br/>

        <!-- Textbereich für eine optionale Nachricht -->
        <textarea rows="4" cols="16" name="message"></textarea>
        <!-- rows: Die Anzahl der Zeilen im Textfeld.
             cols: Die Anzahl der Zeichen pro Zeile. -->
        <br/><br/>


        <!-- Schaltfläche zum Absenden des Formulars -->
        <input type="submit" value="Absenden"/>
        <!-- Beim Klicken werden die Formulardaten an die angegebene Aktion gesendet. -->
    </form>
</body>
</html>
