From 5deae74c9a826e566a01d9f5814a4441abb27ed2 Mon Sep 17 00:00:00 2001
From: Yohan Boniface <yb@enix.org>
Date: Tue, 16 Apr 2019 20:56:15 +0200
Subject: [PATCH] Use thead and tbody in tables

---
 copanier/static/app.css                |  7 +++++--
 copanier/templates/adjust_product.html | 20 ++++++++++++--------
 copanier/templates/delivery.html       |  4 +++-
 copanier/templates/place_order.html    |  7 ++++++-
 4 files changed, 26 insertions(+), 12 deletions(-)

diff --git a/copanier/static/app.css b/copanier/static/app.css
index dc90790..35b4435 100644
--- a/copanier/static/app.css
+++ b/copanier/static/app.css
@@ -337,12 +337,15 @@ th.total {
 tr:nth-child(even) {
   background-color: #ddd;
 }
-tr:nth-child(1) {
+thead tr {
   background-color: #3498db;
 }
-tr:nth-child(1) * {
+thead tr * {
   color: #f1f1f1;
 }
+thead th + th {
+  border-left: 1px solid white;
+}
 article.order {
   max-width: 1200px;
   margin-left: auto;
diff --git a/copanier/templates/adjust_product.html b/copanier/templates/adjust_product.html
index b46b16d..cd01bb2 100644
--- a/copanier/templates/adjust_product.html
+++ b/copanier/templates/adjust_product.html
@@ -8,14 +8,18 @@
     <p><strong>Manquant</strong> {{ delivery.product_missing(product) }}</p>
     <form method="post">
     <table>
-        <tr><th>Personne</th><th class="amount">Commande</th><th class="amount">Ajustement</th></tr>
-        {% for email, order in delivery.orders.items() %}
-        <tr>
-            <td>{{ email }}</td>
-            <td>{{ order[product].wanted }}</td>
-            <td class="with-input"><input type="number" min=0 name="{{ email }}" value="{{ order[product].adjustment }}"></td>
-        </tr>
-        {% endfor %}
+        <thead>
+            <tr><th>Personne</th><th class="amount">Commande</th><th class="amount">Ajustement</th></tr>
+        </thead>
+        <tbody>
+            {% for email, order in delivery.orders.items() %}
+            <tr>
+                <td>{{ email }}</td>
+                <td>{{ order[product].wanted }}</td>
+                <td class="with-input"><input type="number" min=0 name="{{ email }}" value="{{ order[product].adjustment }}"></td>
+            </tr>
+            {% endfor %}
+        </tbody>
     </table>
     <input type="submit" value="Enregistrer">
     </form>
diff --git a/copanier/templates/delivery.html b/copanier/templates/delivery.html
index 349459b..5451311 100644
--- a/copanier/templates/delivery.html
+++ b/copanier/templates/delivery.html
@@ -5,7 +5,7 @@
 {% include "includes/delivery_head.html" %}
 <article class="delivery">
     <table class="delivery">
-        <tbody>
+        <thead>
             <tr>
                 <th class="ref">Référence</th>
                 <th class="product">Produit</th>
@@ -24,6 +24,8 @@
                     </th>
                 {% endfor %}
             </tr>
+        </thead>
+        <tbody>
             {% for product in delivery.products %}
             <tr>
                 <td class="ref">{{ product.ref }}</td>
diff --git a/copanier/templates/place_order.html b/copanier/templates/place_order.html
index b5d5a11..922c505 100644
--- a/copanier/templates/place_order.html
+++ b/copanier/templates/place_order.html
@@ -6,6 +6,7 @@
 {% include "includes/delivery_head.html" %}
 <form method="post">
     <table class="order">
+        <thead>
         <tr>
             <th class="product">Produit</th>
             <th class="price">Prix</th>
@@ -13,7 +14,10 @@
                 <th class="packing">Conditionnement</th>
             {% endif %}
             <th class="amount">Quantité</th>
-            {% if delivery.status == delivery.ADJUSTMENT %}<th class="amount">Ajustement</th>{% endif %}</tr>
+            {% if delivery.status == delivery.ADJUSTMENT %}<th class="amount">Ajustement</th>{% endif %}
+        </tr>
+        </thead>
+        <tbody>
         {% for product in delivery.products %}
         <tr>
             <th class="product">{{ product }}
@@ -33,6 +37,7 @@
             {% endif %}
         </tr>
         {% endfor %}
+        </tbody>
     </table>
     <p>Total: {{ order.total(delivery.products) if order else 0 }} €</p>
     {% if delivery.is_passed %}