<div class="row">
  <div class="col-sm-4">
    <h2>Metrics</h2>
  </div>
  <div class="col-sm-8">
    <div class="button-group">
      <button type="submit" class="btn btn-primary btn-sm" id="add-metric-btn"  data-toggle="modal" data-target="#addMetricModal">
        <span><i class="fa fa-plus"></i></span> Add<span class="sr-only"> metric data</span></button>
      <button type="submit" class="btn btn-primary btn-sm" id="edit-metric-btn"  data-toggle="modal" data-target="#addMetricModal">
        <span><i class="fa fa-pencil"></i> Edit<span class="sr-only"> metric data</span></button>
      <button type="submit" class="btn btn-primary btn-sm" id="add-metric-data-btn"  data-toggle="modal" data-target="#addMetricDataModal">
        <span><i class="fa fa-plus"></i> Data<span class="sr-only"> metric data</span></button>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-sm-12">
      <form action="./select_metric" method="post">
          <fieldset id="select-metric">
            {% csrf_token %}
            {% for field in metrics_form.state_fields %}
              {{ field }}
            {% endfor %}
            {{ metrics_form.name.errors }}
            <div class="form-group">
              {{ metrics_form.id }}
            </div>
          </fieldset>
      </form>
  </div>
</div>
