jkuijperm/expenses_manager
1
0
Fork 0
Code Issues 13 Pull Requests Actions Packages Projects Releases Wiki Activity

dev #32

Merged
jkuijperm merged 2 commits from dev into main 2026-08-28 11:46:53 +00:00
Conversation 0 Commits 2 Files Changed 5 +68 -37
5 changed files with 68 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
expenses_manager/expenses/static/expenses/css/base.css
View File

@ -282,6 +282,19 @@ a.danger:visited,
font-size: 0.85rem; font-size: 0.85rem;
} }
/* Oculta visualmente sin ocultar a lectores de pantalla. */
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
/* ========================= */ /* ========================= */
/* Buttons */ /* Buttons */
/* ========================= */ /* ========================= */
@ -737,12 +750,16 @@ tr:hover {
.progress-label { .progress-label {
min-width: 90px; min-width: 90px;
flex-shrink: 0;
white-space: nowrap;
font-size: 0.85rem; font-size: 0.85rem;
color: var(--color-text-muted); color: var(--color-text-muted);
} }
.progress-bar { .progress-bar {
width: 100%; width: 100%;
flex: 1;
min-width: 0;
background: var(--color-progress-track); background: var(--color-progress-track);
border-radius: 6px; border-radius: 6px;
height: 10px; height: 10px;

4
expenses_manager/expenses/templates/expenses/base.html
View File

@ -32,11 +32,9 @@
<a href="{% url 'home' %}" class="nav-item {% if active_menu == 'home' %}active{% endif %} ">Home</a> <a href="{% url 'home' %}" class="nav-item {% if active_menu == 'home' %}active{% endif %} ">Home</a>
<a href="{% url 'dashboard' %}" class="nav-item {% if active_menu == 'dashboard' %}active{% endif %} ">Dashboard</a> <a href="{% url 'dashboard' %}" class="nav-item {% if active_menu == 'dashboard' %}active{% endif %} ">Dashboard</a>
<a href="{% url 'expense_list' %}" class="nav-item {% if active_menu == 'expenses' %}active{% endif %} ">Gastos</a> <a href="{% url 'expense_list' %}" class="nav-item {% if active_menu == 'expenses' %}active{% endif %} ">Gastos</a>
<a href="{% url 'account_list' %}" class="nav-item {% if active_menu == 'accounts' %}active{% endif %} ">Cuentas</a>
<a href="{% url 'income_list' %}" class="nav-item {% if active_menu == 'incomes' %}active{% endif %} ">Ingresos</a> <a href="{% url 'income_list' %}" class="nav-item {% if active_menu == 'incomes' %}active{% endif %} ">Ingresos</a>
<!-- <a href="{% url 'tag_list' %}" class="nav-item {% if active_menu == 'tags' %}active{% endif %} ">Etiquetas</a> -->
<a href="{% url 'fuel_list' %}" class="nav-item {% if active_menu == 'fuel' %}active{% endif %} ">Repostajes</a> <a href="{% url 'fuel_list' %}" class="nav-item {% if active_menu == 'fuel' %}active{% endif %} ">Repostajes</a>
<!-- <a href="{% url 'category_list' %}" class="nav-item {% if active_menu == 'categories' %}active{% endif %} ">Categorías</a> --> <a href="{% url 'account_list' %}" class="nav-item {% if active_menu == 'accounts' %}active{% endif %} ">Cuentas</a>
<div class="nav-item dropdown {% if active_menu == 'settings' %}active{% endif %}" id="settingsDropdown"> <div class="nav-item dropdown {% if active_menu == 'settings' %}active{% endif %}" id="settingsDropdown">
<button type="button" class="dropdown-toggle" id="dropdownToggle" aria-haspopup="true" aria-expanded="false" aria-controls="dropdownMenu">Configuraciones ▼</button> <button type="button" class="dropdown-toggle" id="dropdownToggle" aria-haspopup="true" aria-expanded="false" aria-controls="dropdownMenu">Configuraciones ▼</button>

15
expenses_manager/expenses/templates/expenses/dashboard.html
View File

@ -56,6 +56,7 @@
<input type="hidden" name="period" value="{{ period }}" id="hiddenPeriod"> <input type="hidden" name="period" value="{{ period }}" id="hiddenPeriod">
{% endif %} {% endif %}
<label class="sr-only" for="account">Cuenta</label>
<select name="account" id="account"> <select name="account" id="account">
<option value="">Todas las cuentas</option> <option value="">Todas las cuentas</option>
{% for acc in accounts %} {% for acc in accounts %}
@ -66,6 +67,7 @@
</select> </select>
{% if not period %} {% if not period %}
<label class="sr-only" for="yearSelect">Año</label>
<select name="year" id="yearSelect"> <select name="year" id="yearSelect">
{% for y in year_list %} {% for y in year_list %}
<option value="{{ y }}" {% if y == selected_year %}selected{% endif %}> <option value="{{ y }}" {% if y == selected_year %}selected{% endif %}>
@ -74,6 +76,7 @@
{% endfor %} {% endfor %}
</select> </select>
<label class="sr-only" for="monthSelect">Mes</label>
<select name="month" id="monthSelect"> <select name="month" id="monthSelect">
<option value="">Todo el año</option> <option value="">Todo el año</option>
{% for m in months %} {% for m in months %}
@ -245,7 +248,7 @@
<td style="color: var(--color-danger-accent); font-weight: bold;">{{ exp.amount|floatformat:2 }}</td> <td style="color: var(--color-danger-accent); font-weight: bold;">{{ exp.amount|floatformat:2 }}</td>
</tr> </tr>
{% empty %} {% empty %}
<tr><td colspan="7">No hay gastos recientes registrados</td></tr> <tr><td colspan="5">No hay gastos recientes registrados</td></tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
@ -418,13 +421,19 @@
<div class="goal-card"> <div class="goal-card">
<strong>{{ goal.name }}</strong> <strong>{{ goal.name }}</strong>
<div class="progress-bar"> <div class="progress-bar"
role="progressbar"
aria-valuemin="0"
aria-valuemax="100"
aria-valuenow="{{ goal.percentage|unlocalize }}"
aria-label="Progreso de {{ goal.name }}"
aria-valuetext="{{ goal.progress|floatformat:1 }}€ de {{ goal.target_amount|floatformat:1 }}€ ({{ goal.percentage|floatformat:1 }}%)">
<div class="progress-fill <div class="progress-fill
{% if goal.percentage < 50 %} low {% if goal.percentage < 50 %} low
{% elif goal.percentage < 80 %} medium {% elif goal.percentage < 80 %} medium
{% else %} high {% else %} high
{% endif %}" {% endif %}"
style="width: {{ goal.percentage|unlocalize }}%"></div> style="width: {{ goal.bar_width|unlocalize }}%"></div>
</div> </div>
<span class="progress-label"> <span class="progress-label">

25
expenses_manager/expenses/templates/expenses/expense_list.html
View File

@ -11,7 +11,8 @@
<form method="get" class="filters"> <form method="get" class="filters">
<div class="filters-main"> <div class="filters-main">
<select name="year"> <label class="sr-only" for="filterYear">Año</label>
<select name="year" id="filterYear">
<option value="">Año</option> <option value="">Año</option>
{% for y in year_list %} {% for y in year_list %}
<option value="{{ y }}" <option value="{{ y }}"
@ -22,7 +23,8 @@
{% endfor %} {% endfor %}
</select> </select>
<select name="month"> <label class="sr-only" for="filterMonth">Mes</label>
<select name="month" id="filterMonth">
<option value="">Mes</option> <option value="">Mes</option>
{% for m in months %} {% for m in months %}
<option value="{{ m }}" <option value="{{ m }}"
@ -33,7 +35,8 @@
{% endfor %} {% endfor %}
</select> </select>
<select name="account"> <label class="sr-only" for="filterAccount">Cuenta</label>
<select name="account" id="filterAccount">
<option value="">Cuenta</option> <option value="">Cuenta</option>
{% for acc in accounts %} {% for acc in accounts %}
<option value="{{ acc.id }}" <option value="{{ acc.id }}"
@ -58,9 +61,8 @@
<summary>Filtros avanzados</summary> <summary>Filtros avanzados</summary>
<div class="advanced-content"> <div class="advanced-content">
<label> <label for="filterCategory">Categoría:</label>
Categoría: <select name="category" id="filterCategory" onchange="this.form.submit()">
<select name="category" onchange="this.form.submit()">
<option value="">Todas</option> <option value="">Todas</option>
{% for cat in categories %} {% for cat in categories %}
<option value="{{ cat.id }}" <option value="{{ cat.id }}"
@ -70,10 +72,9 @@
</option> </option>
{% endfor %} {% endfor %}
</select> </select>
</label>
<div class="tags-filters"> <div class="tags-filters" role="group" aria-label="Filtrar por etiquetas">
<span>Tags:</span> <span aria-hidden="true">Tags:</span>
<div class="active-tags"> <div class="active-tags">
{% for tag in tags_with_state %} {% for tag in tags_with_state %}
<a href="?{{ tag.query }}" <a href="?{{ tag.query }}"
@ -140,7 +141,7 @@
</tr> </tr>
{% empty %} {% empty %}
<tr> <tr>
<td colspan="4" class="empty-state"> <td colspan="6" class="empty-state">
<p>No hay gastos</p> <p>No hay gastos</p>
<a href="{% url 'expense_create' %}">Añade el primero</a> <a href="{% url 'expense_create' %}">Añade el primero</a>
</td> </td>
@ -150,7 +151,7 @@
</table> </table>
</div> </div>
<div class="pagination"> <nav class="pagination" aria-label="Paginación de gastos">
<span class="step-links"> <span class="step-links">
{% if page_obj.has_previous %} {% if page_obj.has_previous %}
<a href="?page=1{% if query_params %}&{{ query_params }}{% endif %}">&laquo; Primero</a> <a href="?page=1{% if query_params %}&{{ query_params }}{% endif %}">&laquo; Primero</a>
@ -164,6 +165,6 @@
<a href="?page={{ page_obj.paginator.num_pages }}{% if query_params %}&{{ query_params }}{% endif %}">Último &raquo;</a> <a href="?page={{ page_obj.paginator.num_pages }}{% if query_params %}&{{ query_params }}{% endif %}">Último &raquo;</a>
{% endif %} {% endif %}
</span> </span>
</div> </nav>
{% endblock %} {% endblock %}

10
expenses_manager/expenses/templates/goals/list.html
View File

@ -7,7 +7,7 @@
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<h2>Objetivos</h2> <h1>Objetivos</h1>
<a class="btn btn-primary" href="{% url 'goal_create' %}">➕ Nuevo objetivo</a> <a class="btn btn-primary" href="{% url 'goal_create' %}">➕ Nuevo objetivo</a>
@ -34,7 +34,13 @@
<span class="progress-label"> <span class="progress-label">
{{ goal.progress|floatformat:1 }}€ / {{ goal.target_amount|floatformat:1 }}€ {{ goal.progress|floatformat:1 }}€ / {{ goal.target_amount|floatformat:1 }}€
</span> </span>
<div class="progress-bar"> <div class="progress-bar"
role="progressbar"
aria-valuemin="0"
aria-valuemax="100"
aria-valuenow="{{ goal.percentage|unlocalize }}"
aria-label="Progreso de {{ goal.name }}"
aria-valuetext="{{ goal.progress|floatformat:1 }}€ de {{ goal.target_amount|floatformat:1 }}€ ({{ goal.percentage|floatformat:1 }}%)">
<div class="progress-fill {{ goal.progress_state }}" <div class="progress-fill {{ goal.progress_state }}"
style="width: {{ goal.bar_width|unlocalize }}%"></div> style="width: {{ goal.bar_width|unlocalize }}%"></div>
</div> </div>