Initial Commit

templates/goal_detail.html

@@ -0,0 +1,43 @@
+{% 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 %}