Add submission form (doesn't work yet though)
This commit is contained in:
parent
410d7dd828
commit
394eb69983
1 changed files with 60 additions and 1 deletions
|
@ -116,7 +116,7 @@
|
|||
<div class="max-w-4xl mx-auto p-10">
|
||||
<h1 class="text-center text-2xl font-sans">Donation options</h1>
|
||||
|
||||
<ul class="my-10 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3">
|
||||
<ul class="mt-10 mb-5 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3">
|
||||
<label class="donate-option">
|
||||
<input type="radio" name="amount" value="250">
|
||||
<li>
|
||||
|
@ -160,6 +160,65 @@
|
|||
</li>
|
||||
</label>
|
||||
</ul>
|
||||
|
||||
<div class="bg-white p-10 rounded-md text-md">
|
||||
|
||||
<div class="my-8">
|
||||
<label for="input-name" class="block text-xl">Name:</label>
|
||||
<input name="name" id="input-name" class="block font-sans text-2xl mb-2 w-full bg-gray-100 p-2 rounded-md" placeholder="Some One" required/>
|
||||
<p>
|
||||
<input type="checkbox" name="anonymous" id="input-anonymous"/>
|
||||
<label for="input-anonymous">Anonymous donation (don't list my name publicly on the website)</label>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="my-8">
|
||||
<label for="input-contact" class="block text-xl">Email or Phone:</label>
|
||||
<input name="contact" id="input-contact" placeholder="editors@snipettemag.com" class="block font-sans text-2xl mb-2 w-full bg-gray-100 p-2 rounded-md" required/>
|
||||
<label for="input-contact" class="block">We will use this to contact you when it's time to collect the payment</label>
|
||||
</div>
|
||||
|
||||
<div class="my-8">
|
||||
<label for="input-reminder-count" class="block text-xl">How many times should we try to contact you before giving up?</label>
|
||||
<input name="reminder-count" id="input-reminder-count" type="number" value="10" size="3" class="block font-sans text-2xl mb-2 bg-gray-100 p-2 rounded-md" required/>
|
||||
<label for="input-reminder-count" class="block">If we don't manage to collect your payment, we may have to call off the crowdfunding, so please err on the higher side!</label>
|
||||
</div>
|
||||
|
||||
<div class="my-8">
|
||||
<p class="block text-xl">Would you like to receive our weekly newsletter?</p>
|
||||
<div class="inline-block mr-2">
|
||||
<input name="newsletter" value="yes" id="input-newsletter-yes" type="radio" class="text-xl font-sans"/>
|
||||
<label for="input-newsletter-yes" class="text-xl font-sans mr-3">Yes please</label>
|
||||
</div>
|
||||
<div class="inline-block">
|
||||
<input name="newsletter" value="no" id="input-newsletter-no" type="radio" class="text-xl font-sans" checked/>
|
||||
<label for="input-newsletter-no" class="text-xl font-sans">No thanks</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="my-8">
|
||||
<label for="input-message" class="block text-xl">Any other message for us?</label>
|
||||
<textarea name="messages" id="input-message" placeholder="Hi there..." class="block font-sans text-xl mb-2 w-full bg-gray-100 p-2 rounded-md"></textarea>
|
||||
<label for="input-contact" class="block">You can also email us later at <a href="mailto:editors@snipettemag.com">editors@snipettemag.com</a></label>
|
||||
</div>
|
||||
|
||||
<div class="my-5">
|
||||
<p class="block text-xl">Are you a robot?</p>
|
||||
<div class="inline-block mr-2">
|
||||
<input name="robo" value="yes" id="input-robo-yes" type="radio" class="text-xl font-sans" checked/>
|
||||
<label for="input-robo-yes" class="text-xl font-sans">Yup, how did you know?</label>
|
||||
</div>
|
||||
<div class="inline-block">
|
||||
<input name="robo" value="no" id="input-robo-no" type="radio" class="text-xl font-sans"/>
|
||||
<label for="input-robo-no" class="text-xl font-sans">No, of course not</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="bg-green-500 my-5 w-full p-5 text-xl uppercase font-sans rounded-md">
|
||||
Save Pledge
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in a new issue