Pingu/Fuyuzakura
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Helfer/helfer.html aktualisiert

Browse Source
This commit is contained in:
Pingu
2026-07-20 21:23:58 +00:00
parent 3a6f6071cb
commit dc430f8158
1 changed files with 27 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Helfer/helfer.html
+27 -11
View File
@@ -5,24 +5,37 @@
<p>Fülle deine Daten aus – wir bereiten dein Dokument zur digitalen Unterschrift vor.</p> <p>Fülle deine Daten aus – wir bereiten dein Dokument zur digitalen Unterschrift vor.</p>
</div> </div>
<form id="volunteer-prefill-form" action="DEIN URL" method="POST">
<form id="volunteer-prefill-form" action="/process_form.php" method="POST">
<input type="hidden" name="template_id" value="4">
<div class="hp-field-wrap" style="display:none !important;" aria-hidden="true"> <div class="hp-field-wrap" style="display:none !important;" aria-hidden="true">
<input type="text" name="website_hp" autocomplete="off" tabindex="-1"> <input type="text" name="website_hp" autocomplete="off" tabindex="-1">
</div> </div>
<h3 class="section-title"><span>1.</span> Persönliche Daten</h3> <h3 class="section-title"><span>1.</span> Persönliche Daten</h3>
<div class="form-grid"> <div class="form-grid">
<div class="field-wrap"><label>Vorname</label><input type="text" name="vorname" required=""></div>
<div class="field-wrap"><label>Nachname</label><input type="text" name="nachname" required=""></div> <div class="field-wrap full-width">
<div class="field-wrap"><label>Geburtsdatum</label><input type="text" name="geburtstag" placeholder="TT.MM.JJJJ" required=""></div> <label>Anrede <span class="required-asterisk">*</span></label>
<div style="display: flex; gap: 20px; margin-top: 5px;">
<label class="custom-check"><input type="radio" name="anrede" value="Herr" required=""> <span>Herr</span></label>
<label class="custom-check"><input type="radio" name="anrede" value="Frau" required=""> <span>Frau</span></label>
<label class="custom-check"><input type="radio" name="anrede" value="Divers" required=""> <span>Divers</span></label>
</div>
</div>
<div class="field-wrap"><label>Vorname <span class="required-asterisk">*</span></label><input type="text" name="vorname" required=""></div>
<div class="field-wrap"><label>Nachname <span class="required-asterisk">*</span></label><input type="text" name="nachname" required=""></div>
<div class="field-wrap"><label>Geburtsdatum <span class="required-asterisk">*</span></label><input type="text" name="geburtstag" placeholder="TT.MM.JJJJ" required=""></div>
<div class="field-wrap"><label>T-Shirt Größe</label><input type="text" name="tshirt" placeholder="z.B. M"></div> <div class="field-wrap"><label>T-Shirt Größe</label><input type="text" name="tshirt" placeholder="z.B. M"></div>
<div class="field-wrap full-width"><label>Straße &amp; Hausnummer</label><input type="text" name="strasse" required=""></div> <div class="field-wrap full-width"><label>Straße &amp; Hausnummer <span class="required-asterisk">*</span></label><input type="text" name="strasse" required=""></div>
<div class="field-wrap full-width"><label>PLZ &amp; Ort</label><input type="text" name="plz_ort" required=""></div> <div class="field-wrap full-width"><label>PLZ &amp; Ort <span class="required-asterisk">*</span></label><input type="text" name="plz_ort" required=""></div>
<div class="field-wrap"><label>E-Mail Adresse</label><input type="email" name="email" required=""></div> <div class="field-wrap"><label>E-Mail Adresse <span class="required-asterisk">*</span></label><input type="email" name="email" required=""></div>
<div class="field-wrap"><label>Handy (WhatsApp)</label><input type="text" name="handy" placeholder="+49 ..."></div> <div class="field-wrap"><label>Handy (WhatsApp) <span class="required-asterisk">*</span></label><input type="text" name="handy" placeholder="+49 ..." required=""></div>
<div class="field-wrap full-width feature-box discord-box"> <div class="field-wrap full-width feature-box discord-box">
<label>Discord Nutzername <span class="required-asterisk">*</span></label> <label>Discord Nutzername <span class="required-asterisk">*</span></label>
@@ -41,7 +54,7 @@
<p class="selection-title">Wann kannst du?</p> <p class="selection-title">Wann kannst du?</p>
<div class="badge-notice">💡 Du musst nicht die volle Zeit helfen!</div> <div class="badge-notice">💡 Du musst nicht die volle Zeit helfen!</div>
<div class="checkbox-group"> <div class="checkbox-group">
<label class="custom-check"><input type="checkbox" name="tage[]" value="Fr"> <span>Freitag (15:00 - 20:00 Uhr)</span></label> <label class="custom-check"><input type="checkbox" name="tage[]" value="Fr"> <span>Freitag (09:00 - 17:00 Uhr)</span></label>
<label class="custom-check"><input type="checkbox" name="tage[]" value="Sa"> <span>Samstag (08:00 - 23:00 Uhr)</span></label> <label class="custom-check"><input type="checkbox" name="tage[]" value="Sa"> <span>Samstag (08:00 - 23:00 Uhr)</span></label>
</div> </div>
</div> </div>
@@ -123,7 +136,10 @@
.checkbox-group { display: flex; flex-direction: column; gap: 12px; } .checkbox-group { display: flex; flex-direction: column; gap: 12px; }
.areas-grid-web { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .areas-grid-web { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.custom-check { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; user-select: none; } .custom-check { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; user-select: none; }
.custom-check input[type="checkbox"] { width: 18px; height: 18px; margin-top: 3px; accent-color: #e94598; cursor: pointer; }
/* HIER ANGEPASST: CSS für Checkboxen UND Radio-Buttons */
.custom-check input[type="checkbox"], .custom-check input[type="radio"] { width: 18px; height: 18px; margin-top: 3px; accent-color: #e94598; cursor: pointer; }
.custom-check span { font-size: 0.95em; font-weight: 500; color: #4a5568; } .custom-check span { font-size: 0.95em; font-weight: 500; color: #4a5568; }
.legal-container { background: #fff; border: 2px solid #edf2f7; padding: 25px; border-radius: 14px; } .legal-container { background: #fff; border: 2px solid #edf2f7; padding: 25px; border-radius: 14px; }
.divider { height: 1px; background: #edf2f7; margin: 15px 0; } .divider { height: 1px; background: #edf2f7; margin: 15px 0; }