fix: make dashboard table scrollable

This commit is contained in:
David Larlet 2024-02-09 10:14:44 -05:00
parent 991657f3ea
commit 5827a4cab0
No known key found for this signature in database
GPG key ID: 3E2953A359E7E7BD
2 changed files with 104 additions and 95 deletions

View file

@ -401,32 +401,39 @@ ul.umap-autocomplete {
line-height: inherit; line-height: inherit;
height: 2.5rem; height: 2.5rem;
} }
.table-wrapper {
table.maps { overflow-x: scroll;
}
.table-wrapper table {
width: 100%; width: 100%;
min-width: 600px;
border-collapse: collapse; border-collapse: collapse;
} }
table.maps .map_fragment { .table-wrapper table .map_fragment {
display: block; display: block;
height: 80vh; height: 80vh;
width: 100%; width: 100%;
} }
table.maps a, .table-wrapper table a,
table.maps thead { .table-wrapper table thead {
color: #263B58; color: #263B58;
} }
table.maps a:not(.icon-link) { .table-wrapper table thead th:last-of-type {
min-width: 240px;
}
.table-wrapper table a:not(.icon-link) {
text-decoration: underline; text-decoration: underline;
} }
table.maps button.map-icon { .table-wrapper table button.map-icon {
padding: 0; padding: 0;
border: none; border: none;
background: transparent; background: transparent;
} }
table.maps form { .table-wrapper table form {
display: inline; display: inline;
} }
table.maps input[type="submit"] { .table-wrapper table input[type="submit"] {
display: inline; display: inline;
background-color: transparent; background-color: transparent;
color: #263B58; color: #263B58;
@ -436,22 +443,22 @@ table.maps input[type="submit"] {
margin: 0; margin: 0;
line-height: inherit; line-height: inherit;
} }
table.maps tbody tr { .table-wrapper table tbody tr {
border-bottom: 1px solid #BDC7D4; border-bottom: 1px solid #BDC7D4;
} }
table.maps tbody tr td { .table-wrapper table tbody tr td {
padding: 5px 4px; padding: 5px 4px;
} }
table.maps tbody tr:nth-child(odd) { .table-wrapper table tbody tr:nth-child(odd) {
background-color: #f4f4f4; background-color: #f4f4f4;
} }
table.maps td { .table-wrapper table td {
text-align: center; text-align: center;
} }
table.maps thead tr { .table-wrapper table thead tr {
line-height: 2em; line-height: 2em;
} }
table.maps .button { .table-wrapper table .button {
margin-bottom: 2px; margin-bottom: 2px;
padding:4px 6px; padding:4px 6px;
height: 36px; height: 36px;

View file

@ -1,5 +1,6 @@
{% load umap_tags i18n %} {% load umap_tags i18n %}
<table class="maps"> <div class="table-wrapper">
<table>
<thead> <thead>
<tr> <tr>
<th>{% blocktrans %}Name{% endblocktrans %}</th> <th>{% blocktrans %}Name{% endblocktrans %}</th>
@ -80,6 +81,7 @@
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
</div>
{% if maps.has_other_pages %} {% if maps.has_other_pages %}
<div class="pagination"> <div class="pagination">
{% if maps.has_previous %} {% if maps.has_previous %}