{% extends "base_generic.html" %}
{% load tags %}
{% block script %}

{% endblock %}

{% block content %}

<div class="container-fluid">

    <h3 style="margin-top: 10px">{{Product.name}} Media </h3>

 <table class="table table-sm table-hover">


    {% for pic in media %}
    <tr class=""   >
        <td  scope="col"><img src="{{pic.image_small.url}}?v={{ pic.pk }}"  width="50" height="50" alt="{{ pic.name_for }}"> </td>
        <td  scope="col">    {{pic.name_for }} </td>
        <td scope="col"> <a href="{% url 'delete-media' pk=pic.pk %}"><button  type="button" class="btn btn-default"><i class="fas fa-trash-alt"></i> Löschen</button> </a> </td>

    </tr>
    {% endfor %}
      {% for pic in video %}
    <tr class=""   >
        <td  scope="col"><img src="{{pic.image.url}}?v={{ pic.pk }}"  width="50" height="50" alt="Video: {{ pic.name_for }}"> </td>
        <td  scope="col">    {{pic.name_for }} </td>

        <td scope="col" > <a href="{% url 'delete-video' pk=pic.pk %}"><button  type="button" class="btn btn-default"><i class="fas fa-trash-alt"></i> Löschen</button> </a></td>

    </tr>
    {% endfor %}




 </table>

         <a href="{% url 'add-image' Product.pk %}"> <button class="btn border-dark rounded-0 mybtn" type="submit">Add Media </button> </a>
</div>


{% endblock %}