{% extends 'base.html' %}
{% load crispy_forms_tags %}

{% block content %}
<div class="container py-5">
  <div class="col-lg-8 mx-auto">
    <div class="card shadow-sm">
      <div class="card-body">
        <h1 class="h4 mb-3">{{ action }} Answer</h1>
        <form method="post">
          {% csrf_token %}
          {{ form|crispy }}
          <div class="d-flex justify-content-end">
            <button class="btn btn-primary">Save</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
{% endblock %}

{% block extra_body %}
{{ block.super }}
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
  $(function(){ $('.select2').select2({ width: '100%' }); });
</script>
{% endblock %}