{% extends "base.html" %}

{% block content %}
<div class="container">
  <!-- Product section-->
  <section class="py-5">
    <div class="container px-4 px-lg-5 my-5">
      <div class="row gx-4 gx-lg-5 align-items-center">
        <!-- Art Image-->
        <div class="col-md-6"><img class="card-img-top mb-5 mb-md-0" src="static/repository/{{detail[5]}}" alt="..." /></div>
          <div class="col-md-6">
            <!-- Art Name-->
            <h1 class="display-5 fw-bolder">{{ detail[0] }}</h1>
            <!-- Art Description-->
            <p class="lead">{{ detail[1] }}</p>
            <div class="fs-5 mb-5">
              <!-- Price & Name-->
              <span class="text-decoration-line-through">Current Bid Price: (Current Bid Price) USD</span><br>
              <span class="text-decoration-line-through">Buyout Price: {{ detail[8] }} USD</span><br>
              <span class="text-decoration-line-through">Minimum Price: {{ detail[7] }} USD</span><br>
              <span class="text-decoration-line-through">Creator: {{ detail[3] }}</span><br>
              <span class="text-decoration-line-through">Current Owner: {{ own_uname }}</span><br>
              <span class="text-decoration-line-through">Auction End Date: {{ detail[9] }}</span><br>
            </div>
            <!-- Bid button-->
            <div class="d-flex">
              <form method="POST">
                {{ form.hidden_tag() }}
                {{ form.price(placeholder="Your Starting Bid Price") }}
                {{ form.submit() }}
                <!--<input 
                  type="text" 
                  class="form-control text-center me-3 bidding_price_size" 
                  id="bidding_price"
                  name="bidding_price"
                  placeholder="Enter Bidding Price"
                  />
                <label for="Bidding Price"></label>
                <button class="btn btn-dark flex-shrink-0 input-submit" type="submit">Bid</button>-->
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- Bid History-->
  <div class="row">
    <div class="col body-column">
      <br>
      <h3>Bid History(order by desc)</h3>
    </div>
  </div>
  <!-- Bid Table-->
  <div class="container">
    <table class="table">
      <thead class="thead-dark">
        <tr>
        <th>Bid Date</th>
        <th>Bid Price</th>
        </tr>
      </thead>
      {% for bid in ibh %}
      <tr>
          <td>{{ bid.bid_date }}</td>
          <td>{{ bid.bid_price }}</td>
      </tr>
      {% endfor %}
    </table>
    <hr>
  </div>
</div>
{% endblock %}