feat: another batch of fixes

This commit is contained in:
Herculino Trotta
2025-11-04 10:29:40 -03:00
parent 9ade58a003
commit 0a4d4c12b9
18 changed files with 391 additions and 324 deletions
+1 -1
View File
@@ -3,7 +3,7 @@
{% if not divless %}
<div class="{% if text_end %}text-end{% elif text_start %}text-start{% endif %}">
{% endif %}
<span class="amount{% if color == 'grey' or color == "gray" %} text-base-content/50{% elif color == 'green' %} text-success {% elif color == 'red' %} text-error{% endif %} font-medium {{ custom_class }}"
<span class="amount{% if color == 'grey' or color == "gray" %} text-exchange-rate{% elif color == 'green' %} text-income {% elif color == 'red' %} text-expense{% endif %} font-medium {{ custom_class }}"
data-original-value="{% currency_display amount=amount prefix=prefix suffix=suffix decimal_places=decimal_places %}"
data-amount="{{ amount|floatformat:"-40u" }}">
</span><span>{{ slot }}</span>
+6 -5
View File
@@ -35,7 +35,7 @@
{% endif %}
</div>
<div
class="lg:flex-1 w-full {% if transaction.account.is_untracked_by or transaction.category.mute or transaction.mute %}brightness-80{% endif %}">
class="lg:flex-1 w-full {% if transaction.account.is_untracked_by or transaction.category.mute or transaction.mute %}opacity-70{% endif %}">
{# Date#}
<div class="flex flex-wrap mb-2 lg:mb-1 text-base-content/70">
<div class="w-auto pe-1"><i class="fa-solid fa-calendar fa-fw mr-1 fa-xs"></i></div>
@@ -106,7 +106,7 @@
</div>
</div>
<div
class="lg:w-auto w-full lg:text-right self-end {% if transaction.account.is_untracked_by or transaction.category.mute or transaction.mute %}brightness-80{% endif %}">
class="lg:w-auto w-full lg:text-right self-end {% if transaction.account.is_untracked_by or transaction.category.mute or transaction.mute %}opacity-70{% endif %}">
<div class="main-amount mb-2 lg:mb-0">
<c-amount.display
:amount="transaction.amount"
@@ -161,7 +161,8 @@
<button class="btn btn-neutral btn-sm transaction-action" data-bs-toggle="dropdown" data-bs-container="body" aria-expanded="false">
<i class="fa-solid fa-ellipsis fa-fw"></i>
</button>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-md-start menu w-max">
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-md-start menu w-max relative">
<div class="absolute inset-[0rem_-3rem_-3rem_-3rem] pointer-events-auto -z-10"></div>
{% if transaction.account.is_untracked_by %}
<li>
<a class="disabled flex items-center" aria-disabled="true">
@@ -216,13 +217,13 @@
class="fa-solid fa-clone fa-fw mr-2"></i>{% translate 'Duplicate' %}</a></li>
</ul>
{% else %}
<div class="tooltip" data-tip="{% translate "Restore" %}">
<div class="tooltip" data-tippy-content="{% translate "Restore" %}">
<a class="btn btn-secondary btn-sm transaction-action"
role="button"
hx-get="{% url 'transaction_undelete' transaction_id=transaction.id %}"><i
class="fa-solid fa-trash-arrow-up"></i></a>
</div>
<div class="tooltip" data-tip="{% translate "Delete" %}">
<div class="tooltip" data-tippy-content="{% translate "Delete" %}">
<a class="btn btn-secondary btn-sm transaction-action"
role="button"
hx-delete="{% url 'transaction_delete' transaction_id=transaction.id %}"
+61 -50
View File
@@ -11,66 +11,70 @@
{{ account.account.name }}
</h5>
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'projected income' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'projected income' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
{% if account.income_projected != 0 %}
<div class="text-end font-mono text-green-400">
<div class="text-end">
<c-amount.display
:amount="account.income_projected"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
:decimal_places="account.currency.decimal_places"
color="green"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end ">-</div>
{% endif %}
</div>
{% if account.exchanged and account.exchanged.income_projected %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.income_projected"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'projected expenses' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'projected expenses' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
<div>
{% if account.expense_projected != 0 %}
<div class="text-end font-mono text-red-400">
<div class="text-end">
<c-amount.display
:amount="account.expense_projected"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
:decimal_places="account.currency.decimal_places"
color="red"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end ">-</div>
{% endif %}
</div>
</div>
{% if account.exchanged and account.exchanged.expense_projected %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.expense_projected"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'projected total' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'projected total' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
<div
class="text-end font-mono">
class="text-end ">
<c-amount.display
:amount="account.total_projected"
:prefix="account.currency.prefix"
@@ -80,73 +84,78 @@
</div>
</div>
{% if account.exchanged.total_projected and account.exchanged.total_projected %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.total_projected"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<hr class="my-3">
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'current income' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'current income' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
{% if account.income_current != 0 %}
<div class="text-end font-mono text-green-400">
<div class="text-end">
<c-amount.display
:amount="account.income_current"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
:decimal_places="account.currency.decimal_places"
color="green"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end ">-</div>
{% endif %}
</div>
{% if account.exchanged and account.exchanged.income_current %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.income_current"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'current expenses' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'current expenses' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line"></div>
{% if account.expense_current != 0 %}
<div class="text-end font-mono text-red-400">
<div class="text-end">
<c-amount.display
:amount="account.expense_current"
:prefix="account.currency.prefix"
:suffix="account.currency.suffix"
:decimal_places="account.currency.decimal_places"></c-amount.display>
:decimal_places="account.currency.decimal_places"
color="red"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end ">-</div>
{% endif %}
</div>
{% if account.exchanged and account.exchanged.expense_current %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.expense_current"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'current total' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'current total' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="text-end font-mono">
<div class="dotted-linegrow"></div>
<div class="text-end ">
<c-amount.display
:amount="account.total_current"
:prefix="account.currency.prefix"
@@ -156,22 +165,23 @@
</div>
</div>
{% if account.exchanged and account.exchanged.total_current %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.total_current"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div>
<hr class="my-3">
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'final total' %}</div>
<div class="text-end ">
<div class="text-subtle">{% translate 'final total' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="text-end font-mono">
<div class="dotted-line grow"></div>
<div class="text-end ">
<c-amount.display
:amount="account.total_final"
:prefix="account.currency.prefix"
@@ -181,12 +191,13 @@
</div>
</div>
{% if account.exchanged and account.exchanged.total_final %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="account.exchanged.total_final"
:prefix="account.exchanged.currency.prefix"
:suffix="account.exchanged.currency.suffix"
:decimal_places="account.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="account.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
</div>
+63 -52
View File
@@ -6,65 +6,69 @@
{{ currency.currency.name }}
</h5>
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'projected income' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'projected income' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
{% if currency.income_projected != 0 %}
<div class="text-end font-mono text-green-400">
<div class="text-end">
<c-amount.display
:amount="currency.income_projected"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"></c-amount.display>
:decimal_places="currency.currency.decimal_places"
color="green"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end">-</div>
{% endif %}
</div>
{% if currency.exchanged and currency.exchanged.income_projected %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.income_projected"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'projected expenses' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'projected expenses' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
<div>
{% if currency.expense_projected != 0 %}
<div class="text-end font-mono text-red-400">
<div class="text-end">
<c-amount.display
:amount="currency.expense_projected"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"></c-amount.display>
:decimal_places="currency.currency.decimal_places"
color="red"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end">-</div>
{% endif %}
</div>
</div>
{% if currency.exchanged and currency.exchanged.expense_projected %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.expense_projected"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'projected total' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'projected total' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="text-end font-mono">
<div class="dotted-linegrow"></div>
<div class="text-end">
<c-amount.display
:amount="currency.total_projected"
:prefix="currency.currency.prefix"
@@ -74,73 +78,78 @@
</div>
</div>
{% if currency.exchanged.total_projected and currency.exchanged.total_projected %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.total_projected"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<hr class="my-3">
<hr class="my-3 hr">
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'current income' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'current income' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
{% if currency.income_current != 0 %}
<div class="text-end font-mono text-green-400">
<div class="text-end">
<c-amount.display
:amount="currency.income_current"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"></c-amount.display>
:decimal_places="currency.currency.decimal_places"
color="green"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end">-</div>
{% endif %}
</div>
{% if currency.exchanged and currency.exchanged.income_current %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.income_current"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'current expenses' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'current expenses' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="dotted-line grow"></div>
{% if currency.expense_current != 0 %}
<div class="text-end font-mono text-red-400">
<div class="text-end">
<c-amount.display
:amount="currency.expense_current"
:prefix="currency.currency.prefix"
:suffix="currency.currency.suffix"
:decimal_places="currency.currency.decimal_places"></c-amount.display>
:decimal_places="currency.currency.decimal_places"
color="red"></c-amount.display>
</div>
{% else %}
<div class="text-end font-mono">-</div>
<div class="text-end">-</div>
{% endif %}
</div>
{% if currency.exchanged and currency.exchanged.expense_current %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.expense_current"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'current total' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'current total' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="text-end font-mono">
<div class="dotted-line grow"></div>
<div class="text-end">
<c-amount.display
:amount="currency.total_current"
:prefix="currency.currency.prefix"
@@ -150,22 +159,23 @@
</div>
</div>
{% if currency.exchanged and currency.exchanged.total_current %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.total_current"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
<div>
<hr class="my-3">
<hr class="my-3 hr">
<div class="flex justify-between items-baseline mt-2">
<div class="text-end font-mono">
<div class="text-gray-400">{% translate 'final total' %}</div>
<div class="text-end">
<div class="text-subtle">{% translate 'final total' %}</div>
</div>
<div class="dotted-line flex-grow"></div>
<div class="text-end font-mono">
<div class="dotted-line grow"></div>
<div class="text-end">
<c-amount.display
:amount="currency.total_final"
:prefix="currency.currency.prefix"
@@ -175,12 +185,13 @@
</div>
</div>
{% if currency.exchanged and currency.exchanged.total_final %}
<div class="text-end font-mono text-gray-500">
<div class="text-end">
<c-amount.display
:amount="currency.exchanged.total_final"
:prefix="currency.exchanged.currency.prefix"
:suffix="currency.exchanged.currency.suffix"
:decimal_places="currency.exchanged.currency.decimal_places"></c-amount.display>
:decimal_places="currency.exchanged.currency.decimal_places"
color="gray"></c-amount.display>
</div>
{% endif %}
</div>
+1 -3
View File
@@ -1,8 +1,6 @@
{% spaceless %}
{% load i18n %}
<div class="tooltip" data-tip="{{ content }}">
<span class="text-xs text-base-content/50 mx-3">
<span class="text-xs text-base-content/50 mx-1" data-tippy-content="{{ content }}">
<i class="{% if not icon %}fa-solid fa-circle-question{% else %}{{ icon }}{% endif %} fa-fw"></i>
</span>
</div>
{% endspaceless %}
+1 -1
View File
@@ -1,4 +1,4 @@
<div class="card card-border border-2 border-base-300 relative h-full shadow bg-base-100">
<div class="card card-border relative h-full shadow bg-base-100">
<div class="absolute h-8 w-8 right-2 top-2 bg-{{ color }}-300 text-{{ color }}-800 text-center flex items-center justify-center rounded-lg">
{% if icon %}<i class="{{ icon }}"></i>{% else %}<span class="font-bold">{{ title.0 }}</span>{% endif %}
</div>
@@ -8,7 +8,7 @@
{% if percentage.percentages.income_projected > 0 %}rounded-s-full{% endif %}
{% if percentage.percentages.income_projected > 0 and percentage.percentages.income_current <= 0 and percentage.percentages.expense_projected <= 0 and percentage.percentages.expense_current <= 0 %}rounded-e-full{% endif %}"
style="width: {{ percentage.percentages.income_projected|floatformat:'2u' }}%"
data-tip="{% trans 'Projected Income' %} ({{ percentage.percentages.income_projected|floatformat:2 }}%)"
data-tippy-content="{% trans 'Projected Income' %} ({{ percentage.percentages.income_projected|floatformat:2 }}%)"
role="progressbar"
aria-label="{% trans 'Projected Income' %} ({{ percentage.percentages.income_projected|floatformat:2 }}%)"
aria-valuenow="{{ percentage.percentages.income_projected|floatformat:0 }}"
@@ -21,7 +21,7 @@
{% if percentage.percentages.income_projected <= 0 and percentage.percentages.income_current > 0 %}rounded-s-full{% endif %}
{% if percentage.percentages.income_current > 0 and percentage.percentages.expense_projected <= 0 and percentage.percentages.expense_current <= 0 %}rounded-e-full{% endif %}"
style="width: {{ percentage.percentages.income_current|floatformat:'2u' }}%"
data-tip="{% trans 'Current Income' %} ({{ percentage.percentages.income_current|floatformat:2 }}%)"
data-tippy-content="{% trans 'Current Income' %} ({{ percentage.percentages.income_current|floatformat:2 }}%)"
role="progressbar"
aria-label="{% trans 'Current Income' %} ({{ percentage.percentages.income_current|floatformat:2 }}%)"
aria-valuenow="{{ percentage.percentages.income_current|floatformat:0 }}"
@@ -34,7 +34,7 @@
{% if percentage.percentages.income_projected <= 0 and percentage.percentages.income_current <= 0 and percentage.percentages.expense_projected > 0 %}rounded-s-full{% endif %}
{% if percentage.percentages.expense_projected > 0 and percentage.percentages.expense_current <= 0 %}rounded-e-full{% endif %}"
style="width: {{ percentage.percentages.expense_projected|floatformat:'2u' }}%"
data-tip="{% trans 'Projected Expenses' %} ({{ percentage.percentages.expense_projected|floatformat:2 }}%)"
data-tippy-content="{% trans 'Projected Expenses' %} ({{ percentage.percentages.expense_projected|floatformat:2 }}%)"
role="progressbar"
aria-label="{% trans 'Projected Expenses' %} ({{ percentage.percentages.expense_projected|floatformat:2 }}%)"
aria-valuenow="{{ percentage.percentages.expense_projected|floatformat:0 }}"
@@ -47,7 +47,7 @@
{% if percentage.percentages.income_projected <= 0 and percentage.percentages.income_current <= 0 and percentage.percentages.expense_projected <= 0 and percentage.percentages.expense_current > 0 %}rounded-s-full{% endif %}
{% if percentage.percentages.expense_current > 0 %}rounded-e-full{% endif %}"
style="width: {{ percentage.percentages.expense_current|floatformat:'2u' }}%"
data-tip="{% trans 'Current Expenses' %} ({{ percentage.percentages.expense_current|floatformat:2 }}%)"
data-tippy-content="{% trans 'Current Expenses' %} ({{ percentage.percentages.expense_current|floatformat:2 }}%)"
role="progressbar"
aria-label="{% trans 'Current Expenses' %} ({{ percentage.percentages.expense_current|floatformat:2 }}%)"
aria-valuenow="{{ percentage.percentages.expense_current|floatformat:0 }}"