Allow the table to extend right without expending all the body

This commit is contained in:
Yohan Boniface 2019-03-24 18:56:09 +01:00
parent b68d75b5a0
commit 0d1352df9f
2 changed files with 44 additions and 36 deletions

View file

@ -271,10 +271,7 @@ select:focus {
table {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
table-layout: fixed;
border-bottom: 1px solid #aaa;
overflow-x: auto;
}
tr {
height: 30px;
@ -285,6 +282,7 @@ th {
line-height: 1rem;
vertical-align: middle;
text-align: center;
white-space: nowrap;
}
td + td {
border-left: 1px solid white;
@ -335,6 +333,7 @@ article.order {
margin-right: auto;
}
table.order th.product {
min-width: 10rem;
width: inherit;
}
td.with-input {
@ -343,6 +342,13 @@ td.with-input {
td.with-input input {
width: 100%;
}
article.delivery {
width: 100%;
overflow-x: auto;
}
article.delivery th.person {
max-width: 7rem;
}
hr {
background-color: #dbdbdb;
border: none;

View file

@ -3,40 +3,42 @@
{% block body %}
<h3>{{ delivery.producer }} {% if delivery.is_open %}<a class="button" href="/livraison/{{ delivery.id }}/commander">Ma commande</a>{% endif %}</h3>
{% include "includes/delivery_head.html" %}
<table class="delivery">
<tbody>
<tr>
<th class="ref">Référence</th>
<th class="product">Produit</th>
<th class="price">Prix</th>
{% for email, order in delivery.orders.items() %}
<th class="person"><a href="/livraison/{{ delivery.id }}/commander?email={{ email }}" title="{{ email }}">{{ email }}</a></th>
<article class="delivery">
<table class="delivery">
<tbody>
<tr>
<th class="ref">Référence</th>
<th class="product">Produit</th>
<th class="price">Prix</th>
<th class="amount">Total</th>
{% for email, order in delivery.orders.items() %}
<th class="person"><a href="/livraison/{{ delivery.id }}/commander?email={{ email }}" title="{{ email }}">{{ email }}</a></th>
{% endfor %}
</tr>
{% for product in delivery.products %}
<tr>
<th class="product">{{ product.ref }}</th>
<th class="product">{{ product.name }}</th>
<td>{{ product.price }} €</td>
<th>{{ delivery.product_wanted(product) }}</th>
{% for email, order in delivery.orders.items() %}
{% if product.ref in order.products %}
<td>{{ order.products[product.ref].wanted }}</td>
{% else %}
<td></td>
{% endif %}
{% endfor %}
</tr>
{% endfor %}
<th class="amount">Total</th>
</tr>
{% for product in delivery.products %}
<tr>
<th class="product">{{ product.ref }}</th>
<th class="product">{{ product.name }}</th>
<td>{{ product.price }} €</td>
{% for email, order in delivery.orders.items() %}
{% if product.ref in order.products %}
<td>{{ order.products[product.ref].wanted }}</td>
{% else %}
<td></td>
{% endif %}
{% endfor %}
<th>{{ delivery.product_wanted(product) }}</th>
</tr>
{% endfor %}
<tr><th class="total"><i class="icon-pricetags"></i> Total</th><td></td><td></td>
{% for email, order in delivery.orders.items() %}
<td>{{ order.total(delivery.products) }} €</td>
{% endfor %}
<td class="total">{{ delivery.total }} €</td>
</tr>
</tbody>
</table>
<tr><th class="total"><i class="icon-pricetags"></i> Total</th><td></td><td></td>
<td class="total">{{ delivery.total }} €</td>
{% for email, order in delivery.orders.items() %}
<td>{{ order.total(delivery.products) }} €</td>
{% endfor %}
</tr>
</tbody>
</table>
</article>
<hr>
<ul class="toolbox">
<li>