edpibu/nummi
1
Fork 0
Code Issues 4 Releases Activity

Fix account table display on small devices

Browse source
This commit is contained in:
Edgar P. Burkhart 2024-01-05 08:56:16 +01:00
parent a6e84fbc13
commit 0ff191e0a4
Signed by: edpibu
GPG key ID: 9833D3C5A25BD227
3 changed files with 35 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
nummi/main/static/main/css/main.css
View file

@ -114,7 +114,7 @@ main {
display: grid;
column-gap: var(--gap);
row-gap: var(--gap);
grid-template-columns: 1fr;
grid-template-columns: 100%;
@media (width > 720px) {
grid-template-columns: max-content 1fr;
}

1
nummi/main/static/main/css/table.css
View file

@ -1,6 +1,7 @@
.table,
form {
overflow-x: auto;
width: 100%;
}
table {
border-collapse: collapse;

64
nummi/main/templates/main/index.html
View file

@ -11,40 +11,42 @@
<div class="split">
<section class="accounts">
<h2>{% translate "Accounts" %}</h2>
<table>
<thead>
<tr>
<th colspan="2">{% translate "Account" %}</th>
<th>{% translate "Balance" %}</th>
<th>{% translate "Edit" %}</th>
</tr>
</thead>
<tbody>
{% for acc in accounts %}
<div class="table">
<table>
<thead>
<tr>
<td>{{ acc.icon|remix }}</td>
<th class="l">
<a href="{{ acc.get_absolute_url }}">{{ acc }}</a>
</th>
<td class="value">{{ acc.statement_set.first.value|value }}</td>
<td>
<a href="{% url "edit_account" acc.pk %}">{% translate "Edit" %}</a>
<th colspan="2">{% translate "Account" %}</th>
<th>{% translate "Balance" %}</th>
<th>{% translate "Edit" %}</th>
</tr>
</thead>
<tbody>
{% for acc in accounts %}
<tr>
<td>{{ acc.icon|remix }}</td>
<th class="l">
<a href="{{ acc.get_absolute_url }}">{{ acc }}</a>
</th>
<td class="value">{{ acc.statement_set.first.value|value }}</td>
<td>
<a href="{% url "edit_account" acc.pk %}">{% translate "Edit" %}</a>
</td>
</tr>
{% empty %}
<tr>
<td class="empty" colspan="4">{% translate "No account" %}</td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr class="new">
<td colspan="4">
<a href="{% url "new_account" %}">{% translate "Create account" %}</a>
</td>
</tr>
{% empty %}
<tr>
<td class="empty" colspan="4">{% translate "No account" %}</td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr class="new">
<td colspan="4">
<a href="{% url "new_account" %}">{% translate "Create account" %}</a>
</td>
</tr>
</tfoot>
</table>
</tfoot>
</table>
</div>
</section>
<section class="categories">
<h2>{% translate "Categories" %}</h2>