{% extends 'frontend/base.html' %}
{% load static %}

{% block navbar %}
  {% include 'frontend/snippet.navlinks.html' %}
{% endblock %}

{% block content %}
  <div class="container-fluid">
    <div class="form-group">
      <form
        class="pt-3"
        method="post"
        {% if action == 'new' %}
          action="{% url 'frontend:new_remotepowerdevice' %}"
        {% elif action == 'edit' %}
          action="{% url 'frontend:edit_remotepowerdevice' object.id %}"
        {% endif %}
      >
        {% csrf_token %}

        {{ form.fqdn.errors }}
        <div class="row" style="margin: 5px;">
          <div class="col-3">
            <label for="{{ form.fqdn.id_for_label }}">
              {{ form.fqdn.label }}:
            </label>
          </div>
          <div class="col-9">
            {{ form.fqdn }}
            <small class="form-text text-muted">
              {{ form.fqdn.help_text }}
            </small>
          </div>
        </div>

        {{ form.netbox_id.errors }}
        <div class="row" style="margin: 5px;">
          <div class="col-3">
            <label for="{{ form.netbox_id.id_for_label }}">
              {{ form.netbox_id.label }}:
            </label>
          </div>
          <div class="col-9">
            {{ form.netbox_id }}
            <small class="form-text text-muted">
              {{ form.netbox_id.help_text }}
            </small>
          </div>
        </div>

        {{ form.username.errors }}
        <div class="row" style="margin: 5px;">
          <div class="col-3">
            <label for="{{ form.username.id_for_label }}">
              {{ form.username.label }}:
            </label>
          </div>
          <div class="col-9">
            {{ form.username }}
            <small class="form-text text-muted">
              {{ form.username.help_text }}
            </small>
          </div>
        </div>

        {{ form.password.errors }}
        <div class="row" style="margin: 5px;">
          <div class="col-3">
            <label for="{{ form.password.id_for_label }}">
              {{ form.password.label }}:
            </label>
          </div>
          <div class="col-9">
            {{ form.password }}
            <small class="form-text text-muted">
              {{ form.password.help_text }}
            </small>
          </div>
        </div>

        {{ form.url.errors }}
        <div class="row" style="margin: 5px;">
          <div class="col-3">
            <label for="{{ form.url.id_for_label }}">
              {{ form.url.label }}:
            </label>
          </div>
          <div class="col-9">
            {{ form.url }}
            <small class="form-text text-muted">
              {{ form.url.help_text }}
            </small>
          </div>
        </div>

        <button type="submit" class="btn btn-secondary btn-sm btn-block">
          Submit
        </button>
      </form>
    </div>
  </div>
{% endblock %}