{% extends "default.html" %}

{% block title %}
	<title>Admin — Categories</title>
{% endblock %}

{% block content %}
<div class="overflow-x-auto"><table class="table table-striped mt-3 mb-5">
	<thead class="bg-primary text-white">
		<tr>
			<th>Category</th>
			<th>{{ HOLE_NAME | capitalize }}</th>
			<th>Name</th>
			<th>Text Color</th>
			<th>Background Color</th>
			<th>Actions</th>
			<th>&nbsp;</th>
		</tr>
	</thead>

	{% for category in categories %}
	<tr>
		<td>{{help.submission_category_tag(category.name, category.color_text, category.color_bg)}}</td>
		<td>{{category.sub if category.sub else '&mdash;'|safe}}</td>
		<form action="/admin/categories/update/{{category.id}}" method="POST">
			<input type="hidden" name="formkey" value="{{v.formkey}}">
			<td><input name="name" type="text" value="{{category.name}}" maxlength="128" autocomplete="off" class="form-control"></td>
			<td><input name="color_text" type="text" value="#{{category.color_text}}" size="7" maxlength="7" autocomplete="off" class="form-control"></td>
			<td><input name="color_bg" type="text" value="#{{category.color_bg}}" size="7" maxlength="7" autocomplete="off" class="form-control"></td>
			<td><input type="submit" onclick="disable(this)" class="btn btn-primary" value="Update"></td>
		</form>
		<form action="/admin/categories/delete/{{category.id}}" method="POST">
			<input type="hidden" name="formkey" value="{{v.formkey}}">
			<td><input type="submit" onclick="disable(this)" class="btn btn-primary" value="Delete"></td>
		</form>
	</tr>
	{% endfor %}
		
	<tr>
		<form action="/admin/categories/add" method="POST">
			<input type="hidden" name="formkey" value="{{v.formkey}}">
			<td><input name="name" type="text" placeholder="Name" maxlength="128" autocomplete="off" class="form-control"></td>
			<td><input name="sub" type="text" placeholder="{{HOLE_NAME|capitalize}} (optional)" maxlength="20" autocomplete="off" class="form-control"></td>
			<td></td>
			<td><input name="color_text" type="text" placeholder="#000000 (Text)" size="7" maxlength="7" autocomplete="off" class="form-control"></td>
			<td><input name="color_bg" type="text" placeholder="#000000 (BG)" size="7" maxlength="7" autocomplete="off" class="form-control"></td>
			<td colspan="2"><input type="submit" onclick="disable(this)" class="btn btn-primary" value="Create"></td>
		</form>
	</tr>
</table>
{% endblock %}