{% extends "base.html" %}

{% block content %}
<div class="container-create_art">
  <div class="wrap-create_art">
    <form action="" method="POST" enctype="multipart/form-data" class="contact100-form">
      {{ form.hidden_tag() }}
      <span class="create_art-form-title">
        <b>Create Art Auction</b>
      </span>
      <!--Input Art Name-->
      <div class="create_art-input-box">
        {{ form.art_name(placeholder="Enter Art Name", class="form-control create_art-input" ) }}
      </div>
      <!--Input Minimum Price-->
      <div class="create_art-input-box">
        {{ form.min_price(placeholder="Enter Minimum Price (USD)", class="form-control create_art-input", min=1) }}
      </div> 
      <!--Input Buyout Price-->
      <div class="create_art-input-box">
        {{ form.buyout_price(placeholder="Enter Buyout Price (USD)", class="form-control create_art-input") }}
      </div>
      <!--Input Description-->
      <div class="create_art-input-box">
        {{ form.art_desc(placeholder="Enter Description", class="form-control create_art-input description_size") }}
      </div>
      <!--Upload Art or choose what they bought before-->
      <hr class="hr_size">
      <div class="row">
        <div class="col input-group-prepend">
          <label class="input-group-text">File upload</label>
            {{ form.upload(class="upload_Create_art input-group-text", accept="image/png, image/jpeg, image/jpg", required=False) }}
        </div>
      </div>
      <p class="upload_Create_art_position">**<b>PNGs</b> and <b>JPEGs</b> Only**</p>
      <p class="body-column-create_art word_OR_location"><b>OR</b></p>
      <!-- Dropdown Menu-->
      <div class="row">
        <div class="col input-group-prepend">  
          <span class="input-group-text">Select Art in Platform</span>  
          <select class="btn btn-secondary dropdown-toggle Closing-date-input-size" name="web_group" required aria-invalid="false"> 
            <option value="cng-555">Select here</option>
            {% for art in av_art %}
            <option name="web_group" value="{{art.filehash}}">{{art.name}}</option>
            {% endfor %}
          </select>
        </div>
      </div>
      <hr class="hr_size">
      <!--Choose Time for Auction ends (I will check how I can limit the user 14days)-->
      <div class="row">
        <div class="col input-group-prepend">  
          <span class="input-group-text Choose-Time-for-Auction-ends">Auction End Date</span>
          {{ form.close_date(class="body-column-create_art Closing-date-input-size") }}
        </div>
      </div>
      <!-- Tips for the date to let user know-->
      <div class="row tips_location">
        <small>Information:</small>
      </div>
      <div class="row tips_location">
        <small>- The maximum Auction time is 14 days</small>
      </div>
      <div class="row tips_location">
        <small>- The exact time of closing is 0000 hrs of that date</small>
      </div>
      <!-- Button for create Auction-->
      <div class="container-create_art-form-btn">
          {{ form.submit(class="create_art-form-btn") }}
      </div>
    </form>
  </div>
</div>
{% endblock %}