templates/homepage-articles/presentation-category.html.twig line 1

  1. {% set introClass = "" %}
  2. {% set iconBlock = "" %}
  3. {% if block.category_select == "actualites" %}
  4. {% set icon = "/resources/img/homepage-icons/actualites-homepage.svg" %}
  5. {% set links = sulu_navigation_root_tree('main', 3, true)[0].children %}
  6. {% set CTA_link = sulu_navigation_root_tree('main', 3)[0].url %}
  7. {% set CTA_title = "Actualités PQN-A" %}
  8. {% set introClass = "news-section" %}
  9. {% elseif block.category_select == "ressources" %}
  10. {% set icon = "/resources/img/homepage-icons/ressources-homepage.svg" %}
  11. {% set links = sulu_navigation_root_tree('main', 3, true)[1].children %}
  12. {% set CTA_link = sulu_navigation_root_tree('main', 3)[1].url %}
  13. {% set CTA_title = "Ressources PQN-A" %}
  14. {% set introClass = "resources-section" %}
  15. {% elseif block.category_select == "acteur-territoire" %}
  16. {% set icon = "/resources/img/homepage-icons/acteur-territoire-homepage.svg" %}
  17. {% set links = sulu_navigation_root_tree('main', 3, true)[2].children %}
  18. {% set CTA_link = sulu_navigation_root_tree('main', 3)[2].url %}
  19. {% set CTA_title = "Acteurs & Territoires PQN-A" %}
  20. {% set introClass = "territory-section" %}
  21. {% else %}
  22. {% set icon = "/resources/img/homepage-icons/qui-sommes-nous-homepage.svg" %}
  23. {% set links = sulu_navigation_root_tree('main', 3, true)[3].children %}
  24. {% set CTA_link = sulu_navigation_root_tree('main', 3)[3].url %}
  25. {% set CTA_title = "Qui sommes-nous ?" %}
  26. {% set introClass = "whoarewe-section" %}
  27. {% endif %}
  28. {% if block.bg_color == "#00747E" %}
  29. {% set link_background = "#329B90" %}
  30. {% elseif block.bg_color == "#354161" %}
  31. {% set link_background = "#495471" %}
  32. {% elseif block.bg_color == "#329B90" %}
  33. {% set link_background = "#00747E" %}
  34. {% elseif block.bg_color == "#605757" %}
  35. {% set link_background = "#706868" %}
  36. {% endif %}
  37. <section class="preview-thematique simple ptb-80px {{ introClass }}">
  38. <div class="preview-thematique-header br8 p-{% if block.title_position is defined and block.title_position is not empty %}{{ block.title_position }}{% endif %}">
  39. <div class="magic-margin"></div>
  40. <div class="preview-thematique-title shadow-standard w100 cwhite br8 dflex fdc jcc" {% if block.bg_color %} style="background: {{ block.bg_color }}" {% endif %}>
  41. <div>
  42. {% if icon is defined and icon is not empty %}
  43. <img src="{{ icon }}" alt="Icone thematique" loading="lazy" width="80" height="80">
  44. {% endif %}
  46. {% if block.title %}
  47. <h2>{{ block.title }}</h2>
  48. {% endif %}
  49. {% if block.chapo is defined and block.chapo is not empty %}
  50. <p class="lh24">{{ block.chapo }}</p>
  51. {% endif %}
  52. <ul class="dflex submenu presentation-submenu fwwrap mt-1em {{ block.category_select }}">
  53. {% for link in links %}
  54. <li>
  55. {% set title_class = link.title|lower|slice(0, 12)|replace({"/": "", "-":"", " ": "", "’":"", "'":"","à":"a", "é":"e", "&": ""}) %}
  56. <a href="{{ sulu_content_path(link.url) }}" title="{{ link.title }}" class="fw400 nodeco menu-link {{ title_class }}-class prelative cwhite menu-container-icon flex aic" {% if link_background is defined and link_background is not empty %} style="background: {{ link_background }}{% endif %}">
  57. {% for child in link.excerpt.icon %}
  58. {% set iconBlock = false %}
  59. {% if child.url is defined and child.url is not empty %}
  60. {% set iconBlock = child.formats['300x']%}
  61. <span class="category-icon-display">
  62. <img src="{{ iconBlock }}" alt="" width="{{child.fileVersion.properties.width}}" height="{{child.fileVersion.properties.height}}" loading="lazy">
  63. </span>
  64. {% endif %}
  65. {% endfor %}
  66. <div>{{ link.title }}</div>
  67. </a>
  68. </li>
  69. {% endfor %}
  70. </ul>
  71. {% if CTA_link is defined and CTA_link is not empty %}
  72. <a href="{{ CTA_link }}" class="CTA diblock nodeco lh28 ma">{{ CTA_title }}</a>
  73. {% endif %}
  74. </div>
  75. </div>
  76. <div class="preview-thematique-image shadow-standard w100">
  77. {% if block.presentation_image is defined and block.presentation_image is not empty %}
  78. <img src="{{ block.presentation_image.formats['600x.webp'] }}" srcset="{{ block.presentation_image.formats['300x.webp'] }} 300w, {{ block.presentation_image.formats['600x.webp'] }} 600w, {{ block.presentation_image.formats['1000x.webp'] }} 1000w" sizes="(max-width: 300px) 300w, (max-width: 600px) 600w, 1000w" alt="{{ block.presentation_image | copyright_or_description_or_title }}" class="br8" width="{{ block.presentation_image.fileVersion.properties.width }}" height="{{ block.presentation_image.fileVersion.properties.height }}" loading="lazy">
  79. {% endif %}
  80. </div>
  81. </div>
  82. </section>