44 lines
1.7 KiB
HTML
44 lines
1.7 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}{{ goal.title }} · Superior Finance{% endblock %}
|
|
{% block content %}
|
|
<h1>{{ goal.title }}</h1>
|
|
<p class="muted">{{ goal.description }}</p>
|
|
|
|
{% if goal.image_list %}
|
|
<div style="display:flex; gap:0.5rem; flex-wrap:wrap; margin-bottom:1rem;">
|
|
{% for image in goal.image_list %}
|
|
<img src="{{ url_for('static', filename='uploads/' ~ image) }}" alt="" style="width:120px; height:120px; object-fit:cover; border-radius:8px; border:1px solid var(--border);">
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="card">
|
|
<div class="meter-label">
|
|
<span>${{ goal.saved_amount }} of ${{ goal.goal_amount }}</span>
|
|
<span>{{ goal.progress_percent }}%</span>
|
|
</div>
|
|
<div class="meter">
|
|
<div class="meter-fill {% if goal.completed %}complete{% endif %}" style="width: {{ goal.progress_percent }}%"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<h2 style="margin-top:2rem;">Babysteps toward this goal</h2>
|
|
<p><a href="{{ url_for('new_babystep') }}">+ Add a babystep</a></p>
|
|
{% if not goal.babysteps %}
|
|
<p class="empty">No babysteps yet.</p>
|
|
{% else %}
|
|
{% for step in goal.babysteps %}
|
|
<div class="card">
|
|
<h2><a href="{{ url_for('view_babystep', slug=step.slug) }}">{{ step.title }}</a></h2>
|
|
<div class="meter-label">
|
|
<span>${{ step.saved_amount }} of ${{ step.monthly_amount }} / mo</span>
|
|
<span>{{ step.progress_percent }}%</span>
|
|
</div>
|
|
<div class="meter">
|
|
<div class="meter-fill {% if step.completed %}complete{% endif %}" style="width: {{ step.progress_percent }}%"></div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endblock %}
|