templates/application/whileresume/application/jobs/_card-content.html.twig line 1

Open in your IDE?
  1. {# ═══════════════════════════════════════════════════════════════════
  2.    PARTIAL : Contenu interne de la card d'offre
  3.    Utilisé pour le rendu initial. Ensuite, ce contenu est remplacé
  4.    en AJAX (via JS buildJobHtml() dans show.html.twig).
  5. ═══════════════════════════════════════════════════════════════════ #}
  7. <div class="job-card-head">
  8.     <h1 class="job-card-title">{{ job.jobTitle }}</h1>
  10.     <div class="job-card-meta">
  12.         {% if job.online == 1 %}
  13.         <span class="job-card-meta-item job-card-meta-active">
  14.             <span class="job-card-active-dot"></span>
  15.             {{ 'job.show.activeOffer'|trans({}, 'whr-public') }}
  16.         </span>
  17.         {% endif %}
  19.         {% if job.websearch == 1 %}
  20.             <span class="job-card-meta-item job-card-meta-external">⚡ {{ 'job.show.externalSource'|trans({}, 'whr-public') }}</span>
  21.         {% endif %}
  23.             {% if job.city is not empty %}
  24.                 <span class="job-card-meta-item">
  25.                     <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0118 0z"/><circle cx="12" cy="10" r="3"/></svg>
  26.                     {{ job.city }}
  27.                 </span>
  28.             {% endif %}
  29.             {% if job.country is not empty %}
  30.             <span class="job-card-meta-item">
  31.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0118 0z"/><circle cx="12" cy="10" r="3"/></svg>
  32.                 {{ job.country }}
  33.             </span>
  34.             {% endif %}
  36.         {% if job.employmentType is not empty %}
  37.             <span class="job-card-meta-item">
  38.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="7" width="20" height="14" rx="2"/><path d="M16 7V5a4 4 0 00-8 0v2"/></svg>
  39.                 {{ job.employmentType }}
  40.             </span>
  41.         {% endif %}
  42.         {% if job.remoteWork is not empty %}
  43.             <span class="job-card-meta-item">
  44.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8M12 17v4"/></svg>
  45.                 {{ job.remoteWork }}
  46.             </span>
  47.         {% endif %}
  48.         {% if job.experienceLevel is not empty %}
  49.             <span class="job-card-meta-item">
  50.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 11.08V12a10 10 0 11-5.93-9.14"/><path d="M22 4L12 14.01l-3-3"/></svg>
  51.                 {{ job.experienceLevel }}
  52.             </span>
  53.         {% endif %}
  54.         {% if job.salaryPeriod is not null %}
  55.             <span class="job-card-meta-item job-card-meta-salary">
  56.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="1" x2="12" y2="23"/><path d="M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6"/></svg>
  57.                 {{ job.salaryMin }}–{{ job.salaryMax }} {{ job.devise }}/{{ job.salaryPeriod }}
  58.             </span>
  59.         {% endif %}
  60.     </div>
  61. </div>
  63. {% if job.jobSummary is not null %}
  64.     <div class="job-card-section" id="section-presentation">
  65.         <div class="job-card-section-title">
  66.             <span class="job-card-section-icon">
  67.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="9" y1="13" x2="15" y2="13"/><line x1="9" y1="17" x2="15" y2="17"/></svg>
  68.             </span>
  69.             <span>{{ 'job.show.sectionPresentation'|trans({}, 'whr-public') }}</span>
  70.         </div>
  71.         <p class="job-card-section-text">{{ job.jobSummary|raw }}</p>
  72.     </div>
  73. {% endif %}
  75. {% if isCandidateUser %}
  76.     {% if job.keyResponsabilities is not null %}
  77.         <div class="job-card-section" id="section-missions">
  78.             <div class="job-card-section-title">
  79.                 <span class="job-card-section-icon">
  80.                     <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 11 12 14 22 4"/><path d="M21 12v7a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h11"/></svg>
  81.                 </span>
  82.                 <span>{{ 'job.show.sectionMissions'|trans({}, 'whr-public') }}</span>
  83.             </div>
  84.             <p class="job-card-section-text">{{ job.keyResponsabilities|raw }}</p>
  85.         </div>
  86.     {% endif %}
  87.     {% if job.requirements is not null %}
  88.         <div class="job-card-section" id="section-profile">
  89.             <div class="job-card-section-title">
  90.                 <span class="job-card-section-icon">
  91.                     <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
  92.                 </span>
  93.                 <span>{{ 'job.show.sectionProfile'|trans({}, 'whr-public') }}</span>
  94.             </div>
  95.             <p class="job-card-section-text">{{ job.requirements|raw }}</p>
  96.         </div>
  97.     {% endif %}
  98.     {% if job.benefits is not null %}
  99.         <div class="job-card-section" id="section-benefits">
  100.             <div class="job-card-section-title">
  101.                 <span class="job-card-section-icon">
  102.                     <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
  103.                 </span>
  104.                 <span>{{ 'job.show.sectionBenefits'|trans({}, 'whr-public') }}</span>
  105.             </div>
  106.             <p class="job-card-section-text">{{ job.benefits|raw }}</p>
  107.         </div>
  108.     {% endif %}
  110.     <div class="job-card-actions">
  111.         <a href="{% if app.request.locale == 'en' %}{{ path('cvs_application_job_like',{'slug':job.slug}) }}{% else %}{{ path('locale_cvs_application_job_like',{'_locale':app.request.locale,'slug':job.slug}) }}{% endif %}"
  112.            class="job-action-btn job-action-btn-primary job-action-like{% if isLiked|default(false) %} is-liked{% endif %}"
  113.            id="cardLikeBtn"
  114.            data-liked="{{ isLiked|default(false) ? '1' : '0' }}"
  115.            data-job-slug="{{ job.slug }}">
  116.             <svg class="job-action-like-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z"/></svg>
  117.             <span class="job-action-like-label">
  118.                 {% if isLiked|default(false) %}{{ 'job.show.interested'|trans({}, 'whr-public') }}{% else %}{{ 'job.show.imInterested'|trans({}, 'whr-public') }}{% endif %}
  119.             </span>
  120.         </a>
  121.         {% if job.websearch == 1 %}
  122.             <a href="{{ job.website|strip_query }}" target="_blank" rel="noopener" class="job-action-btn">
  123.                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
  124.                 {{ 'job.show.apply'|trans({}, 'whr-public') }}
  125.             </a>
  126.         {% endif %}
  127.     </div>
  129. {% else %}
  130.     <div class="job-card-locked">
  131.         <div class="job-card-locked-icon">
  132.             <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0110 0v4"/></svg>
  133.         </div>
  134.         <div class="job-card-locked-title">{{ 'job.show.unlockTitle'|trans({}, 'whr-public') }}</div>
  135.         <div class="job-card-locked-text">{{ 'job.show.unlockText'|trans({}, 'whr-public') }}</div>
  136.         <div class="job-card-locked-buttons">
  137.             <a href="{% if app.request.locale == 'en' %}{{ path('whileresume_resume_en') }}{% else %}{{ path('whileresume_resume_fr') }}{% endif %}" class="job-card-locked-btn job-card-locked-btn-primary">
  138.                 {{ 'job.show.createProfileFree'|trans({}, 'whr-public') }}
  139.             </a>
  140.             <a href="{% if app.request.locale == 'en' %}{{ path('app_login') }}{% else %}{{ path('locale_app_login',{'_locale':app.request.locale}) }}{% endif %}" class="job-card-locked-btn job-card-locked-btn-secondary">
  141.                 {{ 'job.show.signIn'|trans({}, 'whr-public') }}
  142.             </a>
  143.         </div>
  144.     </div>
  146.     <div class="job-card-actions">
  147.         <button class="job-action-btn job-action-btn-primary job-action-btn-locked" id="cardLikeBtn" type="button" data-locked="1">
  148.             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0110 0v4"/></svg>
  149.             {{ 'job.show.imInterestedLocked'|trans({}, 'whr-public') }}
  150.         </button>
  151.     </div>
  152. {% endif %}