TFC/tfcconnection-zola
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixing lots of little issues

Browse source
This commit is contained in:
Chris Cochrun 2025-12-04 14:18:20 -06:00
parent 6bf2c362ae
commit 5040dcd91e
3 changed files with 195 additions and 63 deletions
Download patch file Download diff file Expand all files Collapse all files

112
templates/shortcodes/mt_form.html
View file

@ -1,4 +1,4 @@
{% set formClasses = "bg-neutral-500 text-neutral-50 placeholder-neutral-300 focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 focus:ring-offset-transparent m-2 p-3 rounded-lg hover:bg-neutral-500 checked:text-neutral-500" -%}
{% set formClasses = "bg-gray-300 text-gray-900 dark:bg-gray-500 dark:text-gray-50 placeholder-gray-900 dark:placeholder-gray-300 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-transparent m-2 p-3 rounded-lg hover:bg-gray-400 dark:hover:bg-gray-600 checked:text-gray-900 dark:checked:text-gray-500" -%}
{% set requiredField = "<span class='inline-block text-[#f39] text-sm align-super'>* required</span>" -%}
<script>
@ -52,11 +52,12 @@
console.log(parentAgree);
if (studentAgree && parentAgree) {
document.getElementById('mt-form').hidden = false
document.getElementById('form').hidden = false
console.log("WOOHOO");
}
else {
document.getElementById('form').hidden = true
document.getElementById('mt-form').hidden = true
/* document.getElementById('form').hidden = true
* document.getElementById('mt-form').hidden = true */
console.log("NEGATORY");
}
}
@ -72,7 +73,7 @@
<div class="p-2">
<input type="checkbox" name="adult-agree" id="adult-agree"
onclick="process()" class="form-checkbox {{ formClasses }}" />
<label for="adult-agree">Parent agrees to the above</label>
<label for="adult-agree">My parent agrees to the above</label>
</div>
</div>
@ -105,20 +106,14 @@
class="flex-1 form-input {{ formClasses }}"
placeholder="Last Name">
</div>
<div class="basis-full my-4 lg:flex md:flex">
<div class="lg:basis-1/2">
<label for="birthdate" class="">When were you born?</label>
<input type="date" id="birthdate" name="birthdate"
class="form-date {{ formClasses }}">
</div>
<div class="lg:basis-1/2">
<label for="gender" class="">Gender</label>
<select id="gender" name="gender" class="form-select {{ formClasses }}">
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</div>
</div>
<label for="birthdate" class="basis-full mx-2">When were you born?</label>
<input type="date" id="birthdate" name="birthdate"
class="form-date {{ formClasses }}">
<label for="gender" class="basis-full mt-4 mx-2">Gender</label>
<select id="gender" name="gender" class="form-select {{ formClasses }} border-r-8 border-transparent">
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
<div class="basis-full flex flex-wrap my-4">
<label for="street" class="basis-full mx-2">What is your address? <span class='inline-block text-[#f39] text-sm align-middle'>* required</span></label>
<input type="text" id="street" name="street"
@ -217,33 +212,27 @@
class="flex-auto form-input {{ formClasses }}" placeholder="Other">
</div>
</div>
<div class="basis-full flex flex-wrap my-4">
<div class="basis-1/2 flex flex-wrap items-center">
<label for="tfcgroup" class="flex-initial">TFC Group</label>
<select id="tfcgroup" name="tfcgroup" class="flex-auto form-select {{ formClasses }}">
<option value="Phillipsburg">Phillipsburg</option>
<option value="Atwood">Atwood</option>
<option value="Northern Valley">Northern Valley</option>
<option value="Southern Valley">Southern Valley</option>
<option value="Thunder Ridge">Thunder Ridge</option>
<option value="Logan">Logan</option>
<option value="Wakeeney">Wakeeney</option>
<option value="Codell">Codell</option>
<option value="Colby">Colby</option>
</select>
</div>
<div class="basis-1/2 flex flex-wrap items-center">
<label for="shirt" class="flex-initial">T-Shirt Size</label>
<select id="shirt" name="shirt" class="flex-auto form-select {{ formClasses }}">
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">Large</option>
<option value="xl">XL</option>
<option value="xxl">2XL</option>
<option value="xxxl">3XL</option>
</select>
</div>
</div>
<label for="tfcgroup" class="basis-full mx-2">TFC Group</label>
<select id="tfcgroup" name="tfcgroup" class="flex-auto form-select {{ formClasses }} border-r-8 border-transparent">
<option value="Phillipsburg">Phillipsburg</option>
<option value="Atwood">Atwood</option>
<option value="Northern Valley">Northern Valley</option>
<option value="Southern Valley">Southern Valley</option>
<option value="Thunder Ridge">Thunder Ridge</option>
<option value="Logan">Logan</option>
<option value="Wakeeney">Wakeeney</option>
<option value="Codell">Codell</option>
<option value="Colby">Colby</option>
</select>
<label for="shirt" class="basis-full mx-2 mt-4">T-Shirt Size</label>
<select id="shirt" name="shirt" class="mb-4 basis-full flex-auto form-select {{ formClasses }} border-r-8 border-transparent">
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">Large</option>
<option value="xl">XL</option>
<option value="xxl">2XL</option>
<option value="xxxl">3XL</option>
</select>
<div class="basis-full my-4 mb-8 flex flex-wrap">
<label for="image" class="basis-full mx-2">
Please give us a picture you'd like to use on prayer cards.
@ -252,23 +241,26 @@
class="file:my-4 file:ml-2 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-neutral-500 file:text-neutral-100 hover:file:bg-primary-300 hover:file:ring-offset-2 hover:file:ring-2 hover:file:ring-offset-transparent hover:file:text-primary-500 hover:file:ring-primary-500">
</div>
<label class="basis-full mt-8 mx-2" for="trip">Please select the trip that you'd prefer to go on. We reserve the right to move you to another trip if we need to. If you cannot go on a trip for sure, please tell us why in the next question.</label>
<select id="trip" name="trip" class="form-select {{ formClasses }} basis-full items-center mb-8">
<option value="SPLASH">SPLASH</option>
<option value="Tulsa">Tulsa, Oklahoma</option>
<option value="Cary">Cary Christian Center</option>
</select>
<!-- <div class="flex-auto basis-1/3">
<label for="trip-2" class="basis-1/2">Mexico</label>
<select id="trip-2" name="trip-2" class="flex-auto basis-1/2 form-select {{ formClasses }}">
<option value="1">1</option>
<option value="2">2</option>
<option value="X">X</option>
</select>
</div> -->
<h4 class="mb-4">Please select the trip that you'd prefer to go on. We reserve the right to move you to another trip if we need to. If you cannot go on a trip for sure, please tell us why in the next question.</h4>
<div class="grid w-full grid-cols-3 gap-2 rounded-xl bg-gray-700 p-2">
<div>
<input type="radio" name="trip" id="1" value="tulsa" class="peer hidden" checked />
<label for="1" class="block cursor-pointer select-none rounded-xl p-2 text-center peer-checked:bg-blue-800 peer-checked:font-bold peer-checked:text-white">Tulsa, Oklahoma</label>
</div>
<div>
<input type="radio" name="trip" id="2" value="rehoboth" class="peer hidden" />
<label for="2" class="block cursor-pointer select-none rounded-xl p-2 text-center peer-checked:bg-blue-800 peer-checked:font-bold peer-checked:text-white">Rehoboth</label>
</div>
<div>
<input type="radio" name="trip" id="3" value="mexico" class="peer hidden" />
<label for="3" class="block cursor-pointer select-none rounded-xl p-2 text-center peer-checked:bg-blue-800 peer-checked:font-bold peer-checked:text-white">Mexico</label>
</div>
</div>
<div class="basis-full mt-10">
<label for="tripnotes" class="p-4">
<label for="tripnotes" class="p-4 mx-2">
Is there a trip you cannot go on due to scheduling conflicts? Or do you have any other things you'd wish to inform us about regarding a specific trip?
</label>
<br/>