templates/application/whileresume/website/components/footer.html.twig line 41

Open in your IDE?
  1. {# =========================================================
  2.    FOOTER WhileResume — thème Sociala (v4 — routes vérifiées)
  4.    Colonnes :
  5.      1. Mon compte / Commencer ici (stores + liens action)
  6.      2. Articles récents (featured ArticlesRepository::getLast)
  7.      3. Emplois par ville (JobsFilters type=city)
  8.      4. Entreprises par ville (EnterprisesFilters type=city)
  9.      5. Pages SEO (LandingJobs featured)
  11.    ⚠️ Routes utilisées (vérifiées contre routes.yml) :
  12.      ✓ whileresume_homepage / locale_whileresume_homepage
  13.      ✓ cvs_website_article / locale_cvs_website_article
  14.      ✓ cvs_application_jobs_filter / locale_cvs_application_jobs_filter
  15.      ✓ cvs_application_companies_filter / locale_cvs_application_companies_filter
  16.      ✓ cvs_application_job_new / locale_cvs_application_job_new (= /post-a-job)
  17.      ✓ whileresume_jobs_list / locale_whileresume_jobs_list
  18.      ✓ whileresume_companies_list / locale_whileresume_companies_list
  19.      ✓ app_logout
  21.      ⚠️ À CONFIRMER (pas dans routes.yml uploadé — sans doute dans whileresume_resume/whileresume_business) :
  22.      - app_login / locale_app_login → bouton login
  23.      - cvs_gestion_candidates_register / locale_… → inscription candidat
  24.      - cvs_gestion_enterprises_register / locale_… → inscription pro
  25.      - cvs_application_cv_builder / locale_… → créateur de CV
  26.      - cvs_gestion_candidates_profile_profile → profil candidat connecté
  27.      - cvs_gestion_enterprises_profile_profile → profil entreprise connecté
  28.      - cvs_gestion_enterprises_settings → settings entreprise
  29.      - cvs_application_landing_jobs_show → page d'une LandingJobs (slug)
  31.    👉 Si une route n'existe pas, remplace-la directement dans ce fichier
  32.       (un seul endroit à modifier par lien).
  33.    ========================================================= #}
  35. {% set _locale = app.request.locale %}
  36. {% set _isFr = _locale == 'fr' %}
  38. {# Données dynamiques #}
  39. {% set footerArticles = getFooterArticles(_locale, 5) %}
  40. {% set footerLandingJobs = getFooterFeaturedLandingJobs(_locale, 5) %}
  41. {% set footerJobsCities = getFooterJobsCities(_locale, 6) %}
  42. {% set footerEnterprisesCities = getFooterEnterprisesCities(_locale, 6) %}
  44. <style>
  45.     /* ---------- Footer WhileResume ---------- */
  46.     .whr-footer {
  47.         margin-top: 32px;
  48.         padding: 36px 24px 24px;
  49.         background: #F9FAFD;
  50.         border-radius: 16px;
  51.         color: #2c2c46;
  52.     }
  53.     .theme-dark .whr-footer {
  54.         background: #2a2a3c;
  55.         color: #e9e9ef;
  56.     }
  58.     /* Stores en haut de la col 1 */
  59.     .whr-footer .whr-stores {
  60.         display: flex;
  61.         flex-direction: column;
  62.         gap: 8px;
  63.         margin-bottom: 18px;
  64.     }
  65.     .whr-footer .whr-store-link {
  66.         display: inline-flex;
  67.         align-items: center;
  68.         gap: 10px;
  69.         padding: 8px 14px;
  70.         background: #111;
  71.         color: #fff !important;
  72.         border-radius: 10px;
  73.         font-size: 12px;
  74.         font-weight: 600;
  75.         text-decoration: none !important;
  76.         line-height: 1.2;
  77.         transition: transform .15s ease, background .2s ease;
  78.         max-width: 170px;
  79.     }
  80.     .whr-footer .whr-store-link:hover {
  81.         background: #2c2c46;
  82.         transform: translateY(-1px);
  83.     }
  84.     .whr-footer .whr-store-link small {
  85.         display: block;
  86.         font-weight: 400;
  87.         font-size: 10px;
  88.         opacity: .7;
  89.     }
  90.     .whr-footer .whr-store-link strong { font-size: 13px; display: block; }
  92.     /* Colonnes */
  93.     .whr-footer .whr-foot-col h4 {
  94.         font-size: 13px;
  95.         font-weight: 700;
  96.         margin: 0 0 14px 0;
  97.         color: inherit;
  98.         text-transform: uppercase;
  99.         letter-spacing: .3px;
  100.     }
  101.     .whr-footer .whr-foot-col ul {
  102.         list-style: none;
  103.         padding: 0;
  104.         margin: 0;
  105.         font-size: 13px;
  106.     }
  107.     .whr-footer .whr-foot-col ul li { margin-bottom: 10px; }
  108.     .whr-footer .whr-foot-col a {
  109.         color: inherit;
  110.         opacity: .75;
  111.         text-decoration: none;
  112.         transition: opacity .2s ease, color .2s ease;
  113.     }
  114.     .whr-footer .whr-foot-col a:hover { opacity: 1; color: var(--theme-color, #6C3AED); }
  115.     .whr-footer .whr-foot-empty {
  116.         font-size: 12px;
  117.         opacity: .5;
  118.         font-style: italic;
  119.     }
  121.     /* Liste avec icônes (col 1) */
  122.     .whr-footer .whr-foot-action-links a {
  123.         display: inline-flex;
  124.         align-items: center;
  125.         gap: 8px;
  126.     }
  127.     .whr-footer .whr-foot-action-links a i {
  128.         font-size: 14px;
  129.         opacity: .7;
  130.         width: 16px;
  131.         text-align: center;
  132.     }
  134.     /* Mini-icône ville pour cols 3 et 4 */
  135.     .whr-footer .whr-foot-col .whr-city-link {
  136.         display: inline-flex;
  137.         align-items: center;
  138.         gap: 6px;
  139.     }
  140.     .whr-footer .whr-foot-col .whr-city-link .whr-city-icon {
  141.         font-size: 14px;
  142.         line-height: 1;
  143.         display: inline-block;
  144.         width: 18px;
  145.         text-align: center;
  146.         opacity: .85;
  147.     }
  149.     /* Grille principale : 1 col → 2 cols → 5 cols */
  150.     .whr-footer .whr-foot-grid {
  151.         display: grid;
  152.         gap: 28px;
  153.         grid-template-columns: 1fr;
  154.     }
  155.     @media (min-width: 576px) {
  156.         .whr-footer .whr-foot-grid { grid-template-columns: 1fr 1fr; }
  157.     }
  158.     @media (min-width: 992px) {
  159.         .whr-footer .whr-foot-grid {
  160.             grid-template-columns: repeat(5, 1fr);
  161.             gap: 32px;
  162.         }
  163.     }
  165.     /* Bottom bar */
  166.     .whr-footer .whr-foot-bottom {
  167.         margin-top: 32px;
  168.         padding-top: 20px;
  169.         border-top: 1px solid rgba(0,0,0,.08);
  170.         display: flex;
  171.         flex-direction: column;
  172.         gap: 14px;
  173.         align-items: center;
  174.         text-align: center;
  175.     }
  176.     .theme-dark .whr-footer .whr-foot-bottom { border-top-color: rgba(255,255,255,.1); }
  178.     @media (min-width: 768px) {
  179.         .whr-footer .whr-foot-bottom {
  180.             flex-direction: row;
  181.             justify-content: space-between;
  182.             text-align: left;
  183.         }
  184.     }
  186.     .whr-footer .whr-foot-copy {
  187.         display: inline-flex;
  188.         align-items: center;
  189.         gap: 8px;
  190.         font-size: 12px;
  191.         opacity: .7;
  192.         margin: 0;
  193.     }
  194.     .whr-footer .whr-foot-copy img.whr-favicon {
  195.         width: 18px;
  196.         height: 18px;
  197.         border-radius: 4px;
  198.         flex-shrink: 0;
  199.     }
  201.     .whr-footer .whr-foot-legal {
  202.         display: flex;
  203.         flex-wrap: wrap;
  204.         gap: 6px 16px;
  205.         justify-content: center;
  206.         font-size: 12px;
  207.     }
  208.     .whr-footer .whr-foot-legal a {
  209.         color: inherit;
  210.         opacity: .75;
  211.         text-decoration: none;
  212.     }
  213.     .whr-footer .whr-foot-legal a:hover { opacity: 1; }
  214.     .whr-footer .whr-foot-legal .whr-admin-link { color: #e74c3c !important; opacity: 1; }
  216.     .whr-footer .whr-foot-social {
  217.         display: flex;
  218.         flex-wrap: wrap;
  219.         gap: 6px;
  220.         list-style: none;
  221.         padding: 0;
  222.         margin: 0;
  223.     }
  224.     .whr-footer .whr-foot-social a {
  225.         width: 32px; height: 32px;
  226.         border-radius: 8px;
  227.         background: #fff;
  228.         display: inline-flex;
  229.         align-items: center;
  230.         justify-content: center;
  231.         color: #2c2c46;
  232.         text-decoration: none !important;
  233.         transition: background .2s ease, color .2s ease, transform .15s ease;
  234.         box-shadow: 0 1px 2px rgba(0,0,0,.04);
  235.     }
  236.     .whr-footer .whr-foot-social a:hover {
  237.         background: var(--theme-color, #6C3AED);
  238.         color: #fff;
  239.         transform: translateY(-1px);
  240.     }
  241.     .theme-dark .whr-footer .whr-foot-social a {
  242.         background: #34344a;
  243.         color: #fff;
  244.         box-shadow: none;
  245.     }
  246.     .whr-footer .whr-foot-social i { font-size: 14px; }
  248.     .middle-sidebar-left .whr-footer { width: 100%; }
  250.     @media (max-width: 575.98px) {
  251.         .whr-footer { padding: 24px 18px 20px; }
  252.     }
  253. </style>
  255. <footer class="whr-footer" role="contentinfo">
  257.     {# === Grille principale 5 colonnes === #}
  258.     <div class="whr-foot-grid">
  260.         {# ===== Col 1 : Mon compte / Commencer ici ===== #}
  261.         {% if _isFr %}
  262.             {% set _ios = ios_fr %}
  263.             {% set _android = android_fr %}
  264.         {% else %}
  265.             {% set _ios = ios_us %}
  266.             {% set _android = android_us %}
  267.         {% endif %}
  269.         <div class="whr-foot-col whr-foot-col-action">
  270.             {% if connectUser %}
  271.                 <h4>{{ 'layout.footer.my_account'|trans({}, 'whr-public')|default('Mon compte') }}</h4>
  272.             {% else %}
  273.                 <h4>{{ 'layout.footer.start_here'|trans({}, 'whr-public')|default('Commencer ici') }}</h4>
  274.             {% endif %}
  276.             <div class="whr-stores">
  277.                 {% if _ios %}
  278.                     <a href="{{ _ios }}" class="whr-store-link" target="_blank" rel="noopener" aria-label="App Store">
  279.                         <svg width="18" height="18" viewBox="0 0 24 24" fill="#fff" aria-hidden="true">
  280.                             <path d="M18.71 19.5C17.88 20.74 17 21.95 15.66 21.97C14.32 22 13.89 21.18 12.37 21.18C10.84 21.18 10.37 21.95 9.09997 22C7.78997 22.05 6.79997 20.68 5.95997 19.47C4.24997 17 2.93997 12.45 4.69997 9.39C5.56997 7.87 7.12997 6.91 8.81997 6.88C10.1 6.86 11.32 7.75 12.11 7.75C12.89 7.75 14.37 6.68 15.92 6.84C16.57 6.87 18.39 7.1 19.56 8.82C19.47 8.88 17.39 10.1 17.41 12.63C17.44 15.65 20.06 16.66 20.09 16.67C20.06 16.74 19.67 18.11 18.71 19.5ZM13 3.5C13.73 2.67 14.94 2.04 15.94 2C16.07 3.17 15.6 4.35 14.9 5.19C14.21 6.04 13.07 6.7 11.95 6.61C11.8 5.46 12.36 4.26 13 3.5Z"/>
  281.                         </svg>
  282.                         <span>
  283.                             <small>{{ 'layout.download_on'|trans({}, 'whr-public')|default('Télécharger sur') }}</small>
  284.                             <strong>App Store</strong>
  285.                         </span>
  286.                     </a>
  287.                 {% endif %}
  288.                 {% if _android %}
  289.                     <a href="{{ _android }}" class="whr-store-link" target="_blank" rel="noopener" aria-label="Google Play">
  290.                         <svg width="18" height="18" viewBox="0 0 512 512" aria-hidden="true">
  291.                             <path style="fill:#3A9BC8;" d="M225.656,256.052L14.016,485.451l-6.442,7.052c-4.005-5.919-6.704-12.972-7.313-20.806C0.087,470.305,0,468.91,0,467.518V44.499c0-9.488,2.873-18.02,7.574-24.987L225.656,256.052z"/>
  292.                             <path style="fill:#9BCD83;" d="M320.811,152.8l-95.155,103.253L7.574,19.512C19.936,1.405,45.183-6.342,66.6,6.02L320.811,152.8z"/>
  293.                             <path style="fill:#EEB84C;" d="M455.056,257.27c-0.348,14.453-7.748,28.904-22.113,37.174l-112.132,64.771l-95.155-103.163L320.811,152.8l70.518,40.745l41.614,24.026C448.178,226.366,455.579,241.861,455.056,257.27z"/>
  294.                             <path style="fill:#B43F70;" d="M7.591,492.492c12.368,18.116,37.599,25.838,58.976,13.496L320.775,359.22l-95.156-103.209L7.591,492.492z"/>
  295.                         </svg>
  296.                         <span>
  297.                             <small>{{ 'layout.available_on'|trans({}, 'whr-public')|default('Disponible sur') }}</small>
  298.                             <strong>Google Play</strong>
  299.                         </span>
  300.                     </a>
  301.                 {% endif %}
  302.             </div>
  304.             <ul class="whr-foot-action-links">
  305.                 {% if connectUser %}
  306.                     {% if isCandidateUser %}
  307.                         <li>
  308.                             <a href="{% if _isFr %}{{ path('locale_cvs_gestion_candidates_profile_profile', {'_locale': _locale}) }}{% else %}{{ path('cvs_gestion_candidates_profile_profile') }}{% endif %}">
  309.                                 <i class="feather-user"></i>
  310.                                 {{ 'layout.footer.my_profile'|trans({}, 'whr-public')|default('Mon profil') }}
  311.                             </a>
  312.                         </li>
  313.                     {% else %}
  314.                         <li>
  315.                             <a href="{% if _isFr %}{{ path('locale_cvs_gestion_enterprises_profile_profile', {'_locale': _locale}) }}{% else %}{{ path('cvs_gestion_enterprises_profile_profile') }}{% endif %}">
  316.                                 <i class="feather-user"></i>
  317.                                 {{ 'layout.footer.my_profile'|trans({}, 'whr-public')|default('Mon profil') }}
  318.                             </a>
  319.                         </li>
  320.                         <li>
  321.                             <a href="{% if _isFr %}{{ path('locale_cvs_gestion_enterprises_settings', {'_locale': _locale}) }}{% else %}{{ path('cvs_gestion_enterprises_settings') }}{% endif %}">
  322.                                 <i class="feather-settings"></i>
  323.                                 {{ 'layout.footer.settings'|trans({}, 'whr-public')|default('Paramètres') }}
  324.                             </a>
  325.                         </li>
  326.                     {% endif %}
  327.                     <li>
  328.                         <a href="{{ path('app_logout') }}">
  329.                             <i class="feather-log-out"></i>
  330.                             {{ 'layout.footer.logout'|trans({}, 'whr-public')|default('Déconnexion') }}
  331.                         </a>
  332.                     </li>
  333.                 {% else %}
  334.                     {# Pas connecté : on pousse vers les CTA principaux du site #}
  335.                     <li>
  336.                         <a href="{% if _isFr %}{{ path('locale_whileresume_jobs_list', {'_locale': _locale}) }}{% else %}{{ path('whileresume_jobs_list') }}{% endif %}">
  337.                             <i class="feather-briefcase"></i>
  338.                             {{ 'layout.footer.browse_jobs'|trans({}, 'whr-public')|default('Voir les offres') }}
  339.                         </a>
  340.                     </li>
  341.                     <li>
  342.                         <a href="{% if _isFr %}{{ path('locale_whileresume_companies_list', {'_locale': _locale}) }}{% else %}{{ path('whileresume_companies_list') }}{% endif %}">
  343.                             <i class="feather-grid"></i>
  344.                             {{ 'layout.footer.browse_companies'|trans({}, 'whr-public')|default('Voir les entreprises') }}
  345.                         </a>
  346.                     </li>
  347.                     <li>
  348.                         <a href="{% if _isFr %}{{ path('locale_cvs_application_job_new', {'_locale': _locale}) }}{% else %}{{ path('cvs_application_job_new') }}{% endif %}">
  349.                             <i class="feather-plus-circle"></i>
  350.                             {{ 'layout.footer.post_job'|trans({}, 'whr-public')|default('Publier une offre') }}
  351.                         </a>
  352.                     </li>
  353.                 {% endif %}
  354.             </ul>
  355.         </div>
  357.         {# ===== Col 2 : Articles récents (featured) ===== #}
  358.         <div class="whr-foot-col">
  359.             <h4>{{ 'layout.footer.latest_articles'|trans({}, 'whr-public')|default('Articles récents') }}</h4>
  360.             {% if footerArticles is not empty %}
  361.                 <ul>
  362.                     {% for article in footerArticles %}
  363.                         <li>
  364.                             <a href="{% if _isFr %}{{ path('locale_cvs_website_article', {'_locale': _locale, 'slug': article.slug}) }}{% else %}{{ path('cvs_website_article', {'slug': article.slug}) }}{% endif %}"
  365.                                title="{{ article.title }}">
  366.                                 {{ article.shortTitle ?: cleanSubstr(article.title, 45) }}
  367.                             </a>
  368.                         </li>
  369.                     {% endfor %}
  370.                 </ul>
  371.             {% else %}
  372.                 <p class="whr-foot-empty">{{ 'layout.footer.coming_soon'|trans({}, 'whr-public')|default('Bientôt disponible') }}</p>
  373.             {% endif %}
  374.         </div>
  376.         {# ===== Col 3 : Emplois par ville ===== #}
  377.         <div class="whr-foot-col">
  378.             <h4>{{ 'layout.footer.jobs_by_city'|trans({}, 'whr-public')|default('Emplois par ville') }}</h4>
  379.             {% if footerJobsCities is not empty %}
  380.                 <ul>
  381.                     {% for city in footerJobsCities %}
  382.                         <li>
  383.                             <a class="whr-city-link"
  384.                                href="{% if _isFr %}{{ path('locale_cvs_application_jobs_filter', {'_locale': _locale, 'slug': city.slug}) }}{% else %}{{ path('cvs_application_jobs_filter', {'slug': city.slug}) }}{% endif %}"
  385.                                title="{{ city.shortTitle ?: city.label }}">
  386.                                 {% if city.icon %}
  387.                                     <span class="whr-city-icon">{{ city.icon }}</span>
  388.                                 {% else %}
  389.                                     <i class="feather-map-pin whr-city-icon"></i>
  390.                                 {% endif %}
  391.                                 <span>{{ city.label }}</span>
  392.                             </a>
  393.                         </li>
  394.                     {% endfor %}
  395.                 </ul>
  396.             {% else %}
  397.                 <p class="whr-foot-empty">{{ 'layout.footer.coming_soon'|trans({}, 'whr-public')|default('Bientôt disponible') }}</p>
  398.             {% endif %}
  399.         </div>
  401.         {# ===== Col 4 : Entreprises par ville ===== #}
  402.         <div class="whr-foot-col">
  403.             <h4>{{ 'layout.footer.companies_by_city'|trans({}, 'whr-public')|default('Entreprises par ville') }}</h4>
  404.             {% if footerEnterprisesCities is not empty %}
  405.                 <ul>
  406.                     {% for city in footerEnterprisesCities %}
  407.                         <li>
  408.                             <a class="whr-city-link"
  409.                                href="{% if _isFr %}{{ path('locale_cvs_application_companies_filter', {'_locale': _locale, 'slug': city.slug}) }}{% else %}{{ path('cvs_application_companies_filter', {'slug': city.slug}) }}{% endif %}"
  410.                                title="{{ city.shortTitle ?: city.label }}">
  411.                                 {% if city.icon %}
  412.                                     <span class="whr-city-icon">{{ city.icon }}</span>
  413.                                 {% else %}
  414.                                     <i class="feather-map-pin whr-city-icon"></i>
  415.                                 {% endif %}
  416.                                 <span>{{ city.label }}</span>
  417.                             </a>
  418.                         </li>
  419.                     {% endfor %}
  420.                 </ul>
  421.             {% else %}
  422.                 <p class="whr-foot-empty">{{ 'layout.footer.coming_soon'|trans({}, 'whr-public')|default('Bientôt disponible') }}</p>
  423.             {% endif %}
  424.         </div>
  426.         {# ===== Col 5 : Pages SEO (LandingJobs featured) =====
  427.              ⚠️ Route 'cvs_application_landing_jobs_show' non trouvée dans tes
  428.              routes.yml (peut-être dans whileresume_resume.yml ?). Adapte si besoin. #}
  429.         <div class="whr-foot-col">
  430.             <h4>{{ 'layout.footer.featured_pages'|trans({}, 'whr-public')|default('À découvrir') }}</h4>
  431.             {% if footerLandingJobs is not empty %}
  432.                 <ul>
  433.                     {% for landing in footerLandingJobs %}
  434.                         <li>
  435.                             <a href="{% if _isFr %}{{ path('locale_whileresume_homepage_landing', {'_locale': _locale, 'slug': landing.slug}) }}{% else %}{{ path('whileresume_homepage_landing', {'slug': landing.slug}) }}{% endif %}">
  436.                                 {{ landing.title }}
  437.                             </a>
  438.                         </li>
  439.                     {% endfor %}
  440.                 </ul>
  441.             {% endif %}
  442.         </div>
  443.     </div>
  445.     {# === Bas du footer === #}
  446.     <div class="whr-foot-bottom">
  447.         <p class="whr-foot-copy">
  448.             {% if favicon %}
  449.                 <img src="{{ favicon }}" alt="" class="whr-favicon" />
  450.             {% endif %}
  451.             <span>&copy; {{ "now"|date('Y') }} {{ websitename }}. {{ 'layout.rights_reserved'|trans({}, 'whr-public')|default('Tous droits réservés.') }}</span>
  452.         </p>
  454.         <div class="whr-foot-legal">
  455.             {% set menuFooter = getMenuWebsiteLocaleArray(_locale, "footer", connectUser) %}
  456.             {% if menuFooter is not empty %}
  457.                 {% for m in menuFooter %}
  458.                     <a href="{{ m.link }}"
  459.                        aria-label="{{ m.title }}"
  460.                        title="{{ m.title }}"
  461.                        {% if m.targetBlank == 1 %}target="_blank" rel="noreferrer"{% endif %}>
  462.                         {{ m.title }}
  463.                     </a>
  464.                 {% endfor %}
  465.             {% endif %}
  466.             {% if app.user is not null and is_granted("ROLE_SUPER_ADMIN") %}
  467.                 <a href="{{ path('backoffice_dashboard') }}" class="whr-admin-link" title="Administration">
  468.                     <i class="feather-settings"></i> Administration
  469.                 </a>
  470.             {% endif %}
  471.         </div>
  473.         <ul class="whr-foot-social">
  474.             {% if facebook %}
  475.                 <li><a href="{{ facebook }}" target="_blank" rel="noopener" aria-label="Facebook"><i class="feather-facebook"></i></a></li>
  476.             {% endif %}
  477.             {% if twitter %}
  478.                 <li><a href="{{ twitter }}" target="_blank" rel="noopener" aria-label="X / Twitter"><i class="feather-twitter"></i></a></li>
  479.             {% endif %}
  480.             {% if instagram %}
  481.                 <li><a href="{{ instagram }}" target="_blank" rel="noopener" aria-label="Instagram"><i class="feather-instagram"></i></a></li>
  482.             {% endif %}
  483.             {% if linkedin %}
  484.                 <li><a href="{{ linkedin }}" target="_blank" rel="noopener" aria-label="LinkedIn"><i class="feather-linkedin"></i></a></li>
  485.             {% endif %}
  486.             {% if youtube %}
  487.                 <li><a href="{{ youtube }}" target="_blank" rel="noopener" aria-label="YouTube"><i class="feather-youtube"></i></a></li>
  488.             {% endif %}
  489.         </ul>
  490.     </div>
  492. </footer>