<<<<<<< HEAD

{% block head %}

      <meta charset="UTF-8">
      <title>Les Vins</title>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js" type="text/javascript"></script>

      <meta name="viewport" content="width=device-width">
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">


      <style>
          /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */
          * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    *:before, *:after {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }

    body {
      font-family: "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
      color: #5e5d52;
    }

    a {
      color: #337aa8;
    }
    a:hover, a:focus {
      color: #4b8ab2;
    }

    .container {
      margin: 5% 3%;
    }
    @media (min-width: 48em) {
      .container {
        margin: 2%;
      }
    }
    @media (min-width: 75em) {
      .container {
        margin: 2em auto;
        max-width: 75em;
      }
    }

    .responsive-table {
      width: 100%;
      margin-bottom: 1.5em;
      border-spacing: 0;
    }
    @media (min-width: 48em) {
      .responsive-table {
        font-size: .9em;
      }
    }
    @media (min-width: 62em) {
      .responsive-table {
        font-size: 1em;
      }
    }
    .responsive-table thead {
      position: absolute;
      clip: rect(1px 1px 1px 1px);
      /* IE6, IE7 */
      padding: 0;
      border: 0;
      height: 1px;
      width: 1px;
      overflow: hidden;
    }
    @media (min-width: 48em) {
      .responsive-table thead {
        position: relative;
        clip: auto;
        height: auto;
        width: auto;
        overflow: auto;
      }
    }
    .responsive-table thead th {
      background-color: #1d96b2;
      border: 1px solid #1d96b2;
      font-weight: normal;
      text-align: center;
      color: white;
    }
    .responsive-table thead th:first-of-type {
      text-align: left;
    }
    .responsive-table tbody,
    .responsive-table tr,
    .responsive-table th,
    .responsive-table td {
      display: block;
      padding: 0;
      text-align: left;
      white-space: normal;
    }
    @media (min-width: 48em) {
      .responsive-table tr {
        display: table-row;
      }
    }
    .responsive-table th,
    .responsive-table td {
      padding: .5em;
      vertical-align: middle;
    }
    @media (min-width: 30em) {
      .responsive-table th,
      .responsive-table td {
        padding: .75em .5em;
      }
    }
    @media (min-width: 48em) {
      .responsive-table th,
      .responsive-table td {
        display: table-cell;
        padding: .5em;
      }
    }
    @media (min-width: 62em) {
      .responsive-table th,
      .responsive-table td {
        padding: .75em .5em;
      }
    }
    @media (min-width: 75em) {
      .responsive-table th,
      .responsive-table td {
        padding: .75em;
      }
    }
    .responsive-table caption {
      margin-bottom: 1em;
      font-size: 1em;
      font-weight: bold;
      text-align: center;
    }
    @media (min-width: 48em) {
      .responsive-table caption {
        font-size: 1.5em;
      }
    }
    .responsive-table tfoot {
      font-size: .8em;
      font-style: italic;
    }
    @media (min-width: 62em) {
      .responsive-table tfoot {
        font-size: .9em;
      }
    }
    @media (min-width: 48em) {
      .responsive-table tbody {
        display: table-row-group;
      }
    }
    .responsive-table tbody tr {
      margin-bottom: 1em;
    }
    @media (min-width: 48em) {
      .responsive-table tbody tr {
        display: table-row;
        border-width: 1px;
      }
    }
    .responsive-table tbody tr:last-of-type {
      margin-bottom: 0;
    }
    @media (min-width: 48em) {
      .responsive-table tbody tr:nth-of-type(even) {
        background-color: rgba(94, 93, 82, 0.1);
      }
    }
    .responsive-table tbody th[scope="row"] {
      background-color: #1d96b2;
      color: white;
    }
    @media (min-width: 30em) {
      .responsive-table tbody th[scope="row"] {
        border-left: 1px solid #1d96b2;
        border-bottom: 1px solid #1d96b2;
      }
    }
    @media (min-width: 48em) {
      .responsive-table tbody th[scope="row"] {
        background-color: transparent;
        color: #5e5d52;
        text-align: left;
      }
    }
    .responsive-table tbody td {
      text-align: right;
    }
    @media (min-width: 48em) {
      .responsive-table tbody td {
        border-left: 1px solid #1d96b2;
        border-bottom: 1px solid #1d96b2;
        text-align: center;
      }
    }
    @media (min-width: 48em) {
      .responsive-table tbody td:last-of-type {
        border-right: 1px solid #1d96b2;
      }
    }
    .responsive-table tbody td[data-type=currency] {
      text-align: right;
    }
    .responsive-table tbody td[data-title]:before {
      content: attr(data-title);
      float: left;
      font-size: .8em;
      color: rgba(94, 93, 82, 0.75);
    }
    @media (min-width: 30em) {
      .responsive-table tbody td[data-title]:before {
        font-size: .9em;
      }
    }
    @media (min-width: 48em) {
      .responsive-table tbody td[data-title]:before {
        content: none;
      }
    }

        </style>

        <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>


{% endblock %}
{% block body %}


      <div class="container">
      <table class="responsive-table">
        <caption>Liste des Vins</caption>
        <thead>
          <tr>
          <th>Id Vin</th>
          <th>Nom Vin</th>
          <th>Type Vin</th>
          <th>Id Appellation</th>
          <th>Afficher</th>
          <th>Editer</th>
          </tr>
        </thead>

        <tbody>


        {% for vin in vins %}
            <tr>
                <td scope="row"><a href="{{ path('vin_show', { 'idVin': vin.idVin }) }}">{{ vin.idVin }}</a></td>
                <td>{{ vin.nomVin }}</td>
                <td>{{ vin.typeVin }}</td>
                <td scope="row">{{ vin.idAppellation }}</td>
                <td><a href="{{ path('vin_show', { 'idVin': vin.idVin }) }}">Afficher</a></td>
                <td><a href="{{ path('vin_edit', { 'idVin': vin.idVin }) }}">Editer</a></td>

           </tr>

        {% endfor %}


        </tbody>

      </table>
      <br/>
      <center><button class="btn btn-primary btn-lg btn-block"><a href="{{ path('vin_new') }}">Insertion d'un Vin</a></button></tr><center>
      <br/>
      <br/>
    </div>
      <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

=======
{% extends 'base.html.twig' %}

{% block body %}<center>
    <h1>Vins list</h1>

    <table border='4' width='40%' height='30%' >
        <thead>
            <tr>
                <th>Idvin</th>
                <th>Nomvin</th>
                <th>Typevin</th>
                <th>Idappellation</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
        {% for vin in vins %}
            <tr>
                <td><a href="{{ path('vin_show', { 'idVin': vin.idVin }) }}">{{ vin.idVin }}</a></td>
                <td>{{ vin.nomVin }}</td>
                <td>{{ vin.typeVin }}</td>
                <td>{{ vin.idAppellation }}</td>
                <td>
                    <ul>
                        <li>
                            <a href="{{ path('vin_show', { 'idVin': vin.idVin }) }}">show</a>
                        </li>
                        <li>
                            <a href="{{ path('vin_edit', { 'idVin': vin.idVin }) }}">edit</a>
                        </li>
                    </ul>
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>

    <ul>
        <li>
            <a href="{{ path('vin_new') }}">Create a new vin</a>
        </li>
    </ul>
    </center>
>>>>>>> d75bc526a887bc0575128d602ccd2f835fc968aa
{% endblock %}
