templates/project/single.html.twig line 1

Open in your IDE?
  1. {% extends 'app/layout.html.twig' %}
  3. {% block content %}
  5.     {% if editmode %}
  6.         Selecteer hieronder een project.
  7.         {{ pimcore_relation("project", {
  8.             classes: ["Sector"],
  9.             reload: true,
  10.         }) }}
  11.     {% endif %}
  13.     {% include "app/partials/navigation/_breadcrumbs.html.twig" %}
  15.     {% set project = pimcore_relation("project").getElement() ?? null %}
  17.     {{ pimcore_area('hero', {
  18.         type: 'hero-project-brick',
  19.         params: {
  20.             'hero-project-brick' : {
  21.                 headLineEnabled: true,
  22.                 titleDefault: (project.title ?? null) ?: null,
  23.                 descriptionDefault: (project.meta_description ?? null) ?: null,
  24.                 defaultHeroBackgroundImage: (project.visuals|first.getThumbnail('header-large-gradient')) ?? null,
  25.                 categories: project.groups ?? null,
  26.                 sectors: project.sectors ?? null
  27.             }
  28.         }
  29.     }) }}
  31.     {% if project is defined %}
  32.         <div class="container pb-10 container-s">
  33.             <div class="gap-8 md:gap-24">
  34.                 <div class="project-content">
  35.                     {{ (project.webdesq_content ?? null) | raw }}
  37.                     {% if project.content_video is defined and project.content_video %}
  38.                         <div class="my-10">
  39.                             {% include 'areas/video-brick/partials/_video.html.twig' with {
  40.                                     'video': project.content_video,
  41.                                 }
  42.                             %}
  43.                         </div>
  44.                     {% endif %}
  46.                     {{ pimcore_block('case-usp') }}
  48.                     <ul class="mt-8 md:mt-8 md:my-8 text-md">
  49.                     {% for usp in pimcore_block('case-ups').iterator %}
  50.                         <li class="flex mb-3 text-blue">
  51.                             <svg class="w-[24px] h-[18px] mr-3 shrink-0 mt-1.5 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 18">
  52.                                 <path fill="#0072BB" fill-rule="evenodd" d="M21.576 0 24 2.424l-6.562 6.562-7.655 7.655a1.71 1.71 0 0 1-2.422 0h-.002L0 9.28l2.425-2.424 6.147 6.148L21.576 0Z"></path>
  53.                             </svg>
  54.                             <span>{{ pimcore_input('usp') }}</span>
  55.                         </li>
  56.                     {% endfor %}
  57.                     </ul>
  58.                 </div>
  60.                 <div class="mt-4">
  61.                     {% if editmode or not pimcore_input('download-title').isEmpty() %}
  62.                         <b>{{ pimcore_input('download-title') }}</b>
  63.                     {% endif %}
  65.                     <div class="flex-row">
  66.                         {% if editmode %}
  67.                             {{ pimcore_link('download-case') }}
  68.                         {% elseif pimcore_link('download-case').getHref() | default() %}
  69.                             <a href="{{ pimcore_link('download-case').getHref() }}" class="relative group button !pl-12 button__primary mt-6">
  70.                                 <svg class="absolute left-5 top-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
  71.                                     <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  72.                                         <g transform="translate(-554.000000, -1195.000000)" class="transition fill-blue group-hover:fill-white">
  73.                                             <g transform="translate(0.000000, 860.000000)">
  74.                                                 <g transform="translate(536.000000, 20.000000)">
  75.                                                     <g transform="translate(0.000000, 244.000000)">
  76.                                                         <g transform="translate(0.000000, 52.000000)">
  77.                                                             <g transform="translate(18.000000, 19.000000)">
  78.                                                                 <path d="M16,12 L16,15.2 C16,15.6418278 15.6418278,16 15.2,16 L0.8,16 C0.3581722,16 0,15.6418278 0,15.2 L0,12 L1.6,12 L1.6,14.4 L14.4,14.4 L14.4,12 L16,12 Z M8,12 C8.21221371,12.0002458 8.41577082,11.9158862 8.5656,11.7656 L11.7656,8.5656 L10.6344,7.4344 L8.8,9.26872 L8.8,0 L7.2,0 L7.2,9.26872 L5.3656,7.4344 L4.2344,8.5656 L7.4344,11.7656 C7.58422918,11.9158862 7.78778629,12.0002458 8,12 Z" id="Shape"/>
  79.                                                             </g>
  80.                                                         </g>
  81.                                                     </g>
  82.                                                 </g>
  83.                                             </g>
  84.                                         </g>
  85.                                     </g>
  86.                                 </svg>
  87.                                 {{ pimcore_link('download-case').getText() }}
  88.                             </a>
  89.                         {% endif %}
  91.                         {% if editmode %}
  92.                             {{ pimcore_link('contact-for-information') }}
  93.                         {% elseif pimcore_link('contact-for-information').getHref() | default() %}
  94.                             <a href="{{ pimcore_link('contact-for-information').getHref() }}" class="button button__secondary group {% if pimcore_link('download-case').isEmpty() %} !px-0 {% endif %}">
  95.                                 {{ pimcore_link('contact-for-information').getText() }}
  96.                                 <span
  97.                                     class="flex items-center justify-center w-6 h-6 ml-3 transition-all bg-white rounded-full shadow-md text-blue group-hover:bg-blue group-hover:text-white"><svg
  98.                                         class="h-3.5 w-3.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path
  99.                                             fill="currentColor" fill-rule="currentColor"
  100.                                             d="m6.406 15.656 6.963-6.731c.249-.24.389-.575.389-.925 0-.35-.14-.685-.389-.925L6.406.343A1.206 1.206 0 0 0 4.657.41l-.09.113a1.297 1.297 0 0 0 .154 1.67L10.731 8l-6.008 5.806a1.295 1.295 0 0 0-.065 1.783c.463.52 1.248.55 1.748.066Z"></path></svg></span>
  101.                             </a>
  102.                         {% endif %}
  103.                     </div>
  104.                 </div>
  105.             </div>
  106.         </div>
  108.         {% if project.visuals | default([]) %}
  109.             {% include "project/partials/media-brick.html.twig" with {'media': project.visuals} %}
  110.         {% endif %}
  112.         {% if editmode or project.getProject_facts() | length > 0 %}
  113.         {{ pimcore_area('project-facts', {
  114.             type: 'project-usp-grid-brick',
  115.             params: {
  116.                 'project-usp-grid-brick': {
  117.                     items: project.getProject_facts(),
  118.                     backgroundColor: 'bg-blue-200'
  119.                 }
  120.             }
  121.         }) }}
  122.         {% endif %}
  124.         {% include "project/partials/contact.html.twig" %}
  126.         {{ pimcore_area('testimonials', {
  127.             type : 'testimonial-brick',
  128.         }) }}
  130.         {% if editmode or project.getClient_facts() | length > 0 %}
  131.         {{ pimcore_area('client-facts', {
  132.             type: 'project-usp-grid-brick',
  133.             params: {
  134.                 'project-usp-grid-brick': {
  135.                     items: project.getClient_facts(),
  136.                     backgroundColor: 'bg-white'
  137.                 }
  138.             }
  139.         }) }}
  140.         {% endif %}
  142.         {{ pimcore_area('added-value', {
  143.             type: 'content-brick',
  144.             params: {
  145.                 'content-brick': {
  146.                     layout: 'text-image'
  147.                 }
  148.             }
  149.         }) }}
  151.         {% if editmode or project.groups | default([]) %}
  152.         {{ pimcore_area('applied-products', {
  153.             type : 'product-category-cards-brick',
  154.             params: {
  155.                 'product-category-cards-brick': {
  156.                     productCategories: project.groups ?? null,
  157.                     defaultTitle: 'Toegepaste producten'|trans,
  158.                     brickBackgroundColor: 'bg-blue-200'
  159.                 }
  160.             }
  161.         }) }}
  162.         {% endif %}
  164.         {% if editmode or project.related_projects | default([]) %}
  165.         {{ pimcore_area('related-projects', {
  166.             type: 'projects-card-slider-brick',
  167.             params: {
  168.                 'projects-card-slider-brick': {
  169.                     defaultTitle: 'Gerelateerde projecten en onderwerpen' | trans,
  170.                     projects: project.related_projects ?? [],
  171.                     brickBackgroundColor: 'bg-gray-200',
  172.                     labelOverride: 'Project' | trans
  173.                 }
  174.             }
  175.         }) }}
  176.         {% endif %}
  178.         {{ pimcore_area('project-faq', {
  179.             type: 'faq-brick',
  180.             params: {
  181.                 'faq-brick': {
  182.                     showContact: 'false',
  183.                     containerSize: 'md:max-w-[1100px] container',
  184.                     containerClass: 'mx-auto'
  185.                 }
  186.             }
  187.         }) }}
  189.     {% endif %}
  191.     {{ pimcore_area('contact-side-widget', {
  192.         type: 'contact-side-widget-brick'
  193.     }) }}
  195. {% endblock %}