{% extends "layouts/base.html" %}

{% block title %}KH3 - Pro Codes Simulator{% endblock %}

{% block head %}
	<link rel="stylesheet" href="{{ crate::find_hash("/public/styles/kh3/pro-codes-sim.css") }}"></link>
	<script
		type="module"
		src="{{ crate::find_hash("/public/scripts/kh3/pro-codes-sim.js") }}"
	></script>
{% endblock %}

{% block content %}
	<div id="score"><h1>Merit: 365000</h1></div>
	<div id="codes">
	{% for code in pro_codes %}
		<div class="slot">
			<input type="checkbox" id="{{code.id()}}" autocomplete="off">
			<label for="{{code.id()}}">{{code.name}}</label>
		</div>
	{% endfor %}
	</div>
	<div id="fights">
	{% for fight in fights %}
		<div class="slot">
			<button onclick="" data-base-merit="{{fight.merit}}">Track</button>
			<span>{{fight.enemy}}</span>
		</div>
	{% endfor %}
	</div>
{% endblock %}