Fix Captcha placement and styling

cgi-bin/form.py

@@ -71,7 +71,7 @@ match os.environ.get("REQUEST_METHOD", "").upper():
 				# place the token *inside* the form. It assumes that there is
 				# a) only one form on the site and
 				# b) the <form> tag doesn't end on the same line.
-				if "</form" in line.lower():
+				if "<!-- FORM -->" in line.lower():
 					print(f'<input type="hidden" name="csrftoken" value="{csrf_token}" />')
 
 					print(f'<label class="form-input">')
@@ -84,7 +84,11 @@ match os.environ.get("REQUEST_METHOD", "").upper():
 					print(f'</script>')
 
 					print('<script src="https://js.hcaptcha.com/1/api.js" async defer></script>')
+					print(f'<div class="form-input">')
+					print(f'<div aria-hidden="true"></div>')
 					print(f'<div class="h-captcha" data-sitekey="{os.environ.get("HCAPTCHA_SITE_KEY", "")}"></div>')
+					print(f'</div>')
+				else:
 					print(line)
 
 		exit(0)

sites/angestoepselt/computer-beantragen/organisation.md

@@ -72,6 +72,8 @@ Im folgenden Feld kannst du weitere Anmerkungen ergänzen.
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/computer-beantragen/privat.md

@@ -86,6 +86,8 @@ installiert. Es gibt ein Programm zum Schreiben
   <span>Ich habe die Hinweise gelesen.</span>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/hardware-spenden/organisation.md

@@ -40,6 +40,8 @@ kein Problem.
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/hardware-spenden/privat.md

@@ -45,6 +45,8 @@ ist das auch kein Problem.
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/kontakt/index.md

@@ -52,6 +52,8 @@ Fragen haben, freuen wir uns natürlich trotzdem hier auf deine Nachricht.
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/kontakt/problem.md

@@ -38,6 +38,8 @@ Problem möglichst präzise.
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/mitmachen/beitreten.md

@@ -78,6 +78,8 @@ Wie möchtest du dem Verein beitreten?
 Das war's!
 Wir werden uns, nachdem du den Antrag abgeschickt hast, bei dir melden.
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/mitmachen/index.md

@@ -57,6 +57,8 @@ Gruppeneinladung.
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/angestoepselt/spenden.md

@@ -82,6 +82,8 @@ Hast du weitere Fragen? Möchtest du ein konkretes Projekt unterstützen? Schrei
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>

sites/coderdojo/anmelden.md

@@ -90,6 +90,8 @@ Solltest du noch Fragen haben oder uns anderweitig etwas mitteilen wollen, kanns
   <textarea name="message"></textarea>
 </label>
 
+<!-- FORM -->
+
 <div class="form-submit">
   <input type="submit" value="Abschicken" />
 </div>