@extends('layouts.app')

@section('title')Bağış Yap | {{ settings()->get('site_title') }}@endsection

@section('content')
<div class="container" id="pay_area_credit_card">
  <div class="alert alert-info">
    <h6 class="h6 m-0">Bağış Yap.</h6>
  </div>
  <div class="row py-3" style="align-items: center;">
    <form action="{{route('create_donation')}}" method="POST">
      @csrf
      <div class="form-group kart-text">
        <input type="number" name="amount" id="amount" value="" placeholder="Miktar" required="required" class="form-control">
      </div>

      <div class="form-group kart-text">
        <input type="text" name="description" id="description" value="" placeholder="Açıklama" required="required" class="form-control">
      </div>
      <div class="row">
        <div class="col-xs-6 input-area">
          <div class="form-group kart-text">
            <input type="text" name="name" id="name" value="" placeholder="İsim Soyisim" required="required" class="form-control">
          </div>
          <div class="form-group kart-text">
            <input type="text" name="CardNumber" id="CardNumber" value="" placeholder="____ ____ ____ ____" required="required" class="form-control">
          </div>
          <div class="kart-nums kart-text">
            <div class="col-md-4 nums-area p-0">
              <div class="form-group">
                <select name="CardExpireDateMonth" id="CardExpireDateMonth" required="required" class="form-control">
                  <option selected="selected" value="01">01</option>
                  <option value="02">02</option>
                  <option value="03">03</option>
                  <option value="04">04</option>
                  <option value="05">05</option>
                  <option value="06">06</option>
                  <option value="07">07</option>
                  <option value="08">08</option>
                  <option value="09">09</option>
                  <option value="10">10</option>
                  <option value="11">11</option>
                  <option value="12">12</option>
                </select>
              </div>
            </div>
            <div class="col-md-4 nums-area px-1">
              <div class="form-group">
                <select name="CardExpireDateYear" id="CardExpireDateYear" required="required" class="form-control">
                  <option value="24">2024</option>
                  <option value="25">2025</option>
                  <option value="26">2026</option>
                  <option value="27">2027</option>
                  <option value="28">2028</option>
                  <option value="29">2029</option>
                  <option value="30">2030</option>
                  <option value="31">2031</option>
                  <option value="32">2032</option>
                  <option value="33">2033</option>
                  <option value="34">2034</option>
                  <option value="35">2035</option>
                  <option value="36">2036</option>
                  <option value="37">2037</option>
                  <option value="38">2038</option>
                  <option value="39">2039</option>
                </select>
              </div>
            </div>
            <div class="col-md-4 nums-area p-0">
              <div class="form-group">
                <input type="number" name="CardCVV2" id="CardCVV2" value="" placeholder="CVV2" min="100" max="999" required="required" class="form-control">
              </div>
            </div>
          </div>
        </div>
        <div class="col-xs-6" id="ccPreview"></div>
      </div>
      <input type="submit" value="Gonder">
    </form>
  </div>
</div>
@endsection