{% extends "documents/base.html" %}
{% load i18n %}
{% load bootstrap4 %}


{% block titleextra %}{% trans "Chunk settings" %}{% endblock %}


{% block content %}
<div class="card">
	<div class="card-header">
    <h1>{% trans "Chunk settings" %}</h1>
	</div>
	<div class="card-body">

	<form enctype="multipart/form-data" method="POST" action="{% if go_next %}?next={{ go_next }}{% endif %}">
    {% csrf_token %}
    <div class='editable'>
	    <p>{% trans "Book" %}: {{ chunk.book }} ({{ chunk.number }}/{{ chunk.book|length }})</p>
        {% bootstrap_form form %}
	{% buttons %}
        	<button class="btn btn-primary" type="submit">{% trans "Save" %}</button>
		{% endbuttons %}
    </div>

	</form>


        <p style="text-align: right"><a class="btn btn-danger" href="{% url "documents_chunk_add" chunk.book.slug chunk.slug %}">{% trans "Split chunk" %}</a></p>
        </div>
</div>

{% endblock content %}


{% block add_css %}
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" />
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ttskch/select2-bootstrap4-theme@x.x.x/dist/select2-bootstrap4.min.css">
{% endblock add_css %}


{% block add_js %}
  <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js" integrity="sha256-9yRP/2EFlblE92vzCA10469Ctd0jT48HnmmMw5rJZrA=" crossorigin="anonymous"></script>
  <script>
   $(function () {
       $('#id_user').select2({
	   theme: 'bootstrap4',
       });
   });
  </script>
{% endblock add_js %}
