{% extends "templates/base.html" %}
{% block title %}{{ _('Job Openings') }}{% endblock %}

{% block content %}
<div class="common-page-style">

  <div class="container">
    {% if allow_posting and jobs | length %}
    <a class="button is-primary pull-right mt-5" href="/job-opportunity?new=1">{{ _("Post a Job") }}</a>
    {% endif %}

    <div class="course-home-headings mb-2">{{ _("{0}").format(title) }}</div>
    <div class="job-subtitle">{{ _("{0}").format(subtitle) }}</div>

    {% if jobs | length %}
    <div class="common-card-style job-list-card">
    {% for job in jobs %}
      <div class="job-card">
        <div class="avatar avatar-medium" title="{{ job.company_name}}">
          <span class="avatar-frame company-logo" style="background-image: url( {{ job.company_logo | urlencode }} );"></span>
        </div>
        <div class="job-card-info col-8">
          <div class="job-card-heading">{{ _(job.job_title) }}</div>
          <a class="dark-links company-name mt-1" href="{{ job.company_website }}">{{ job.company_name }}</a>
        </div>
        <div class="job-meta col">
          <img class="mr-2" src="/assets/school/icons/location.svg">
          <div>{{ job.location }}</div>
        </div>
        <div class="job-card-logo-section">
          <div class="job-type"> {{ job.type }} </div>
          <div class="job-meta">{{ frappe.utils.format_date(job.creation, "medium") }}</div>
        </div>
        <a class="stretched-link" href="/jobs/{{ job.name }}"></a>
      </div>
      {% if loop.index != jobs | length %}
      <div class="card-divider mt-5"></div>
      {% endif %}
    {% endfor %}
    </div>
      </div>
    {% else %}

    <div class="empty-state">
      <div>
        <img class="icon icon-xl" src="/assets/school/icons/comment.svg">
      </div>
      <div class="empty-state-text">
        <div class="empty-state-heading">{{ _("No open jobs") }}</div>
        <div class="course-meta">{{ _("There are no job openings at present.") }}</div>
      </div>
      <div>
        {% if allow_posting %}
        <a class="button is-secondary dark-links m-auto" href="/job-opportunity?new=1">{{ _("Post a Job") }}</a>
        {% endif %}
      </div>
    </div>
    {% endif %}
  </div>
</div>
{% endblock %}