{% extends "default.html" %}

{% block title %}
<title>Create a {{HOLE_NAME}}</title>
{% endblock %}

{% block content %}

<form class="mt-3" id="submitform" action="/create_hole" method="post">

	<div class="container">

		<div class="row justify-content-center mb-4 pb-7">

			<div class="col col-md-6 p-3 py-md-0">

				<h1 class="d-mob-none">Create a {{HOLE_NAME}}</h1>

				<h3 class=" d-md-none">Create a {{HOLE_NAME}}</h3>

				<div class="body">

					<input type="hidden" name="formkey" value="{{v|formkey}}">

					<label for="title">Sub Name</label>

					<input minlength="3" maxlength="25" pattern='[a-zA-Z0-9_\-]*' class="form-control" id="title-register" aria-describedby="titleHelpRegister" type="text" name="name" required>
					<small class="form-text text-muted">3-25 characters, including letters, numbers, _ , and -</small>


					<div class="footer">

						<div class="d-flex">
	
							{% if error %}
							<p class="mb-0">
								<span class="text-danger text-small" style="vertical-align: sub;">{{error}}</span>
							</p>
							{% endif %}
							
							<button type="submit" class="btn btn-primary ml-auto" id="create_button" {% if cost > v.coins %}disabled{% endif %}>Create {{HOLE_NAME|capitalize}}</button>
	
						</div>
	
						<p class="mt-2 mr-1" style="float: right"><b>Cost</b>: {{cost}} coins</p>
	
					</div>	
				</div>

			</div>

		</div>
	</div>

</form>

{% endblock %}