{% extends 'base.html' %} 
{% load static %}

{% block title %} Editar datos del curso {% endblock title %}
{% block contenido %}
{% include 'message.html' %}
 <div class="col-md-12 col-lg-8">
  <div class="card">
    <div class="card-header">
      <h3 class="card-title">Modifique los datos necesarios:</h3>
    </div>
    <div class="card-body">
      <form method="POST" enctype="multipart/form-data">
        {% csrf_token %}
        <div class="mb-3">
          <label class="form-label">Título del curso:</label>
          {{ form.nombre }}
        </div>
        <div class="mb-3">
          <label class="form-label">Descripción del curso:</label>
          {{ form.descripcion }}
        </div>
        {% if request.user.user_type != 'instructor' %}
        <div class="row">
          <div class="col-lg-6">
            <label class="form-label">Seleccione las etiquetas que corresponden</label>
              {% for etiqueta in form.etiquetas%}
                <label class="form-check form-check-inline">
                  <span class="form-check-label">{{etiqueta}}</span>
                </label>
              {% endfor %}
          </div>
          <div class="col-lg-6">
            <div class="mb-3">
              <label class="form-label">Instructor:</label>
              {{ form.instructor }}
            </div>
          </div>
        </div>
        {% else %}
        <div class="mb-3">
          <label class="form-label">Seleccione las etiquetas que corresponden</label>
          {% for etiqueta in form.etiquetas%}
            <label class="form-check form-check-inline"><span class="form-check-label">{{etiqueta}}</span></label>
            <input type="hidden" name="instructor" value="{{ request.user.id }}">
          {% endfor %}
        </div>
        {% endif %}
    </div>
    <div class="form-footer">
      <div class="card-footer text-end">
        <div class="d-flex">
           <a href="javascript:history.back()" class="btn btn-link">Regresar</a>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="col-md-6 col-lg-4">
  <div class="card card-sponsor">
      <div class="card-body">
        <div class="mb-3">
          <label class="form-label"> Miniatura: </label>
          <a href="#" class="d-block"><img src="{{miniatura_url}}" width="100" height="120" class="card-img-top"></a>
          <br>
          {{form.miniatura}}
        </div>

        <div class="mb-3">
          <label class="form-label">
            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-pdf" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
               <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
               <path d="M10 8v8h2a2 2 0 0 0 2 -2v-4a2 2 0 0 0 -2 -2h-2z"></path>
               <path d="M3 12h2a2 2 0 1 0 0 -4h-2v8"></path>
               <path d="M17 12h3"></path>
               <path d="M21 8h-4v8"></path>
            </svg>
            Archivo PDF:
          </label>
          <a class="d-block"> <center> <img src="{% static 'img/pdf.png' %}" width="100" height="80" ></center></a><br>
          {{form.archivo_pdf}}
        </div>
      </div>
      <div class="form-footer">
        <div class="card-footer ">
          <div class="d-flex">
            <button type="submit" class="btn btn-primary ms-auto">Guardar</button>
          </div>
        </div>
        </form>
      </div>
  </div>
</div>


{% endblock contenido %}
