{% extends "../boilerplate.html" %}

{% block title %}New Reimbursement{% endblock %}

{% block main %}

<div>
<h1>Add New Reimbursements</h1>
<hr>

<div class="rcol">
  Make sure all information is accurate, you submit an itemized receipt, and
  you select the correct committee.
</div>

<form action="/items/new" method="post" enctype="multipart/form-data">
  {% csrf_token %}
  <div>
    <label for="desc">Item</label>
    <input id="desc" type="text" name="desc" placeholder="What you bought">
  </div>

  <div>
    <label for="event">Event</label>
    <input id="event" type="text" name="event" placeholder="When we need it">
  </div>

  <div>
    <label for="committee">Committee or Budget</label>
    <select name="committee" id="committee">
      <option disabled selected>Select a committee</option>
      {% for C in committees %}
      <option>{{ C.name }}</option>
      {% endfor %}
    </select>
  </div>

  <div>
    <label for="cost">Cost</label>
    <input id="cost" type="text" name="cost" placeholder="15.00">
  </div>

  <div>
    <label for="date">Date Purchased</label>
    <input id="date" type="date" name="date" placeholder="mm/dd/yyyy">
  </div>

  <div class="clear">
    <div>
    <label for="details">Details</label>
    <textarea id="details" name="details" rows="4" class="clear"></textarea>
    </div>
  </div>

  <div>
    <label for="image">Receipt</label>
    <input type="file" name="image" id="image" accept="image/*">
  </div>

  <div class="clear">
  <div>
  <input type="submit">
  </div>
  </div>
</form>
</div>

{% endblock %}