{% extends 'index.html' %} {% block content %} {% load static %} {% load i18n %}
<section class="oh-wrapper oh-main__topbar" x-data="{searchShow: false}">
  <div class="oh-main__titlebar oh-main__titlebar--left">
    <div
      class="oh-main__titlebar-title fw-bold mb-0 text-dark"
      style="cursor: pointer"
    >
      {% trans "Stage" %}
    </div>
  </div>

  <div class="oh-main__titlebar oh-main__titlebar--right">
    <div class="oh-main__titlebar-button-container">
      <div class="oh-dropdown" x-data="{open: false}">
        {% if perms.recruitment.add_stage %}
        <button
          hx-get="{% url 'rec-stage-create' %}"
          hx-target="#objectCreateModalTarget"
          class="oh-btn oh-btn--secondary ml-2"
          data-toggle="oh-modal-toggle"
          data-target="#objectCreateModal"
        >
          <ion-icon name="add" class="mr-1"></ion-icon>{% trans "Create" %}
        </button>
        {% endif %}
      </div>
    </div>
  </div>
</section>

<div class="oh-wrapper-main">
  <main :class="sidebarOpen ? 'oh-main__sidebar-visible' : ''">
    <div class="oh-wrapper">
      <div class="oh-404">
        <img
          style="width: 190px; height: 190px"
          src="{% static 'images/ui/interview.png' %}"
          class="oh-404__image mb-4"
          alt="Page not found. 404."
        />
        <h5 class="oh-404__subtitle">
          {% trans "No recruitment stages currently available." %}
        </h5>
      </div>
    </div>
  </main>
</div>

{% endblock content %}
