<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Cantor Parts Database</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
  </head>
  <body>
    <!-- Image and text -->
    <nav class="navbar navbar-dark bg-dark">
      <a class="navbar-brand" href="#">
        {% load static %}
        <img src="{% static 'partsdb/cantorair_logo.jpeg' %}" width="90" height="90" class="d-inline-block align-top" alt="">
        Cantor Parts Database
      </a>
    </nav>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
  
    <div class="container">
      <div class="row">
          {%  for part in parts %}
          <div class="col-sm">
              <div class="card" style="width: 18rem;">
                  <!-- <img src="./images/{{ part.image }}" class="card-img-top" alt="..." -->
                  <div class="card-body">
                      <h5 class="card-text">{{ part.descr }}</h5>
                      <p class="card-text">Code:  {{ part.code }}</p>
                      <p class="card-text">Price: {{ part.price }}</p>
                      <p class="card-text">Manuf: {{ part.vendor }}</p>
                      <p class="card-text">Loc:   {{ part.location }}</p>
                      <a href="#" class="btn btn-primary">Acquista</a>
                  </div>
              </div>
            {% endfor %}
          </div>
  
  
  
  </body>
</html>