{% extends 'lib/base.html' %}
{% load static %}
{% block body %}
<style>
    #id_date {
        max-width: 23ch;
    }
</style>
    <title>Add new Activity | Workoutizer</title>
    <h3>Add new Activity</h3>
    <hr>
    <br>
    <div class="container">
        <form action="{% url 'add-activity' %}" method="post" accept-charset="utf-8"
              enctype="multipart/form-data">
            {% csrf_token %}
            {% include "lib/form_errors.html" %}
            {% include "lib/messages.html" %}
            <div class="form-group row">
                <div class="col-sm-3">{{ form.name.label }}</div>
                <div class="col-sm-9">{{ form.name }}</div>
            </div>
            <div class="form-group row">
                <div class="col-sm-3">{{ form.sport.label }}:</div>
                <div class="col-sm-9">{{ form.sport }}</div>
            </div>
            <div class="form-group row">
                <div class="col-sm-3">{{ form.date.label }}:</div>
                <div class="col-sm-9">{{ form.date }}</div>
            </div>
            <div class="form-group row">
                <div class="col-sm-3">{{ form.duration.label }}</div>
                <div class="col-sm-9">{{ form.duration }}&nbsp;&nbsp;Format: HH:MM:SS</div>
            </div>
            <div class="form-group row">
                <div class="col-sm-3">{{ form.distance.label }}</div>
                <div class="col-sm-9">{{ form.distance }}&nbsp;&nbsp;km</div>
            </div>
            <div class="form-group row">
                <div class="col-sm-3">{{ form.description.label }}</div>
                <div class="col-sm-9">{{ form.description }}</div>
            </div>
            <br>
            <br>
            <br>
            <button id="submit-button" class="btn btn-warning" type="submit" name="action">
                <i class="fas fa-check"></i>&nbsp;&nbsp;Submit
            </button>
        </form>
    </div>
{% endblock %}
