{% extends "tracker/base.html" %}{% load fmt %}
{% block title %}Gear{% endblock %}
{% block content %}
<h1>Gear</h1>
<div class="grid2">
{% for g in gear %}<div class="card">
  <h2>{{ g.name }} <span class="tag {{ g.status }}">{{ g.status }}</span> {% if g.is_default %}<span class="tag">default</span>{% endif %}</h2>
  <div>{{ g.mileage_km|floatformat:0 }} km of {{ g.retire_km|floatformat:0 }} km ({{ g.get_kind_display|lower }}, {{ g.activities.count }} activities)</div>
  <div class="meter {{ g.status }}"><span style="width:{{ g.percent_used|floatformat:0 }}%"></span></div>
  <form method="post" action="{% url 'gear_retire' g.pk %}" style="margin-top:10px">{% csrf_token %}<button class="ghost">{% if g.retired %}Reinstate{% else %}Retire{% endif %}</button></form>
</div>{% empty %}<div class="card muted">No gear yet.</div>{% endfor %}
</div>
<div class="card"><h2>Add gear</h2><form method="post">{% csrf_token %}{{ form.as_p }}<button>Add</button></form></div>
{% endblock %}