templates/page/donate.html.twig line 1

Open in your IDE?
  1. {% extends 'standard_tpl.html.twig' %}
  3. {% set page_banner = 'build/images/donate.jpeg' %}
  5. {% set page_title = 'Donate' %}
  7. {% block page_container %}
  8.     <div class="donate-container">
  9.         <div class="container">
  10.             <div class="header text-center mb-5" style="">
  11.                 <h3 class="mb-3">Support our mission to empower <br>young women in geoscience</h3>
  12.                 <p>{{ content.summary }}</p>
  13.             </div>
  14.         </div>
  15.     </div>
  16. <section class="donate-now py-10">
  17.   <div class="container">
  18.     <div class="donate-now-inner w-lg-75 m-auto text-center text-md-start">
  19.       <h2 class="mb-2"><span class="green">Donation</span> Form</h2>
  20.       <p class="mb-4">Help us reach our Goal.</p>
  21.       <div class="donation-form text-start">
  22.         <form>
  23.           <div class="row gy-4">
  24.             <div class="col-lg-6 col-md-6">
  25.               <label for="full-name" class="mb-2">Full Name</label>
  26.               <input type="text" id="full-name" placeholder="Full Name" class=" border border-2 border-grey">
  27.             </div>
  28.             <div class="col-lg-6 col-md-6">
  29.               <label for="email" class="mb-2">Email Address</label>
  30.               <input type="email" id="email" placeholder="Email Address" class=" border border-2 border-grey">
  31.             </div>
  32.             <div class="col-lg-6 col-md-6">
  33.               <label for="phone" class="mb-2">Phone No.</label>
  34.               <input type="tel" id="phone" placeholder="Phone No." class=" border border-2 border-grey">
  35.             </div>
  36.             <div class="col-lg-6 col-md-6">
  37.               <label for="address" class="mb-2">Address</label>
  38.               <input type="text" id="address" placeholder="Address" class=" border border-2 border-grey">
  39.             </div>
  40.             <div class="col-lg-6 col-md-6">
  41.               <label for="cause" class="mb-2">Cause</label>
  42.               <select id="cause" class=" border border-2 border-grey text mb-4">
  43.                 <option value="">--Choose a cause you want to donate to--</option>
  44.                 <option value="1">Urgent Disaster Releif &amp; Securing Wildlife</option>
  45.                 <option value="2">Protecting Wild Heart of The Amazon</option>
  46.                 <option value="3">One Home - One Solar Panel Awareness Program</option>
  47.                 <option value="4">Afforestation Program and Fundraising Event</option>
  48.               </select>
  49.               <label for="donation-amount" class="mb-2">Donation Amount</label>
  50.               <input type="number" id="donation-amount" placeholder="$25.00" class=" border border-2 border-grey">
  51.             </div>
  52.             <div class="col-lg-6 col-md-6">
  53.               <textarea name="message" id="message" placeholder="Any message you want to add?" rows="7" class="border border-2 border-grey"></textarea>
  54.             </div>
  55.           </div>
  56.           <button class="btn btn1 mt-3">Donate Now</button>
  57.         </form>
  58.       </div>
  59.     </div>
  60.   </div>
  61. </section>
  62. {% endblock %}