diff --git a/nummi/main/static/main/css/main.css b/nummi/main/static/main/css/main.css index 2819819..e5e3de7 100644 --- a/nummi/main/static/main/css/main.css +++ b/nummi/main/static/main/css/main.css @@ -426,3 +426,34 @@ a, content: "\2002"; } } + +.statement-details { + display: grid; + grid-template-columns: repeat(4, min-content); + grid-gap: var(--gap); + align-items: center; + + > span:nth-child(2) { + display: grid; + grid-auto-rows: min-content; + > span[class^="ri-"] { + font-size: 2rem; + } + > span.value { + text-align: right; + } + } + > span:first-child, + > span:nth-child(3) { + display: grid; + border: var(--gray) 1px solid; + padding: 0.75rem; + + > .date { + text-align: right; + } + > .value { + font-size: 2rem; + } + } +} diff --git a/nummi/statement/templates/statement/statement_detail.html b/nummi/statement/templates/statement/statement_detail.html index 188b57e..bc27ade 100644 --- a/nummi/statement/templates/statement/statement_detail.html +++ b/nummi/statement/templates/statement/statement_detail.html @@ -18,6 +18,22 @@

{{ "file-edit"|remix }}{% translate "Edit statement" %}

+
+ + {{ statement.start_date|date:"Y-m-d" }} + {{ statement.start_value|value }} + + + {{ statement.sum|pmvalue }} + {{ "arrow-right"|remix }} + {% if statement.diff != statement.sum %}{{ statement.diff|pmvalue }}{% endif %} + + + {{ statement.date|date:"Y-m-d" }} + {{ statement.value|value }} + + {{ statement.sum|check:statement.diff }} +

{% translate "Transactions" %}

{% include "transaction/transaction_table.html" %}