{% extends "cavebase.html" %}

{% block title %}
New Cave and Entrance
{% endblock %}

{% block extraheaders %}
{% include 'html_editor_scripts_css.html' %}
{% endblock %}

{% block content %}
<h1>New Cave Prospect</h1>
<p>Please fill in the details for a new prospect: a hole which might be a cave. Fields are documented in the <a href="/handbook/survey/caveentryfields.html">cave entry fields</a> guide.</p>



<style>
.prospect-form-container {
    max-width: 100%;
    margin-left: 15%;
    font-family: monospace;
    font-weight: bold;
    font-size: 110%;
    text-align: right;
}
.prospect-form label {
    display: inline-block;
    text-align: right;
    margin-right: 20px;
    margin-bottom: 8px;
}
.prospect-form input, .prospect-form select, .prospect-form textarea {
  font-family: monospace;
  font-weight: bold;
  font-size: 100%;
  padding: 0.5em;
  width: 20%;
  margin-bottom: 10px;
}
.success-message {
    color: green;
    font-weight: bold;
    margin-bottom: 15px;
}
.error {
    color: red;
    font-size: 90%;
    display: block;
    margin-bottom: 5px;
}
</style>
<div class="prospect-form-container">
  <form method="post" class="prospect-form">
    {% csrf_token %}
    {% for field in form %}
      <div>
        <label for="{{ field.id_for_label }}">{{ field.label }}</label>
        {{ field }}
        {% if field.help_text %}<small>{{ field.help_text }}</small>{% endif %}
        {% for error in field.errors %}<span class="error">{{ error }}</span>{% endfor %}
      </div>
    {% endfor %}

    <br>
    <button class="fancybutton" style="padding: 0.5em 25px; margin-left: 155px; font-size: 90%;" type="submit">Submit</button>
  </form>
</div>
{% if success %}
  <div class="success-message">New prospect data entered successfully. 
    You can edit it here or enter data for another new prospect.<br />
To add more information for this cave, e.g. a relevant survex file, or a second entrance,
use the <a href=
"/{{ form.area_code.value }}/{{ form.identifier.value }}/{{ form.area_code.value }}-{{ form.identifier.value }}_cave_edit/">Cave Edit form</a>.</div>
{% endif %}
{% endblock %}