templates/areas/hero-project-brick/view.html.twig line 1

Open in your IDE?
  1. {% include 'includes/partials/hero_usp_bar.html.twig' %}
  3. {% block content %}
  4. <div class="{{ info.getId }} pimcore_area_content">
  5.         {% set labelCounter = 0 %}
  6.         {% set isProjectPage = (document.getParent().getId() == document.getProperty('projectsPage').getId())|default(false) %}
  7.         {% set labelBaseUrl = (isProjectPage ? document.getProperty('projectsPage').getUrl() : document.getProperty('newsPage').getUrl()) %}
  9.         <section class="pt-10 mb-10 relative {% if pimcore_image('image').isEmpty() %} pb-2 bg-blue-200 {% else %} pseudo-background {% endif %}">
  10.             <div class="container container-s">
  11.                 <div class="lg:pt-8">
  12.                     {% if subTitle | default() or subtitleDefault | default() %}
  13.                         <p class="text-[18px] font-bold">{{ subTitle | default(subtitleDefault) }}</p>
  14.                     {% endif %}
  16.                     {% if title | default() or titleDefault | default() %}
  17.                         <h1 class="text-[32px] {% if not showDate is defined %} mb-4 {% endif %}">{{ title | default(titleDefault) }}</h1>
  18.                     {% endif %}
  20.                     {% if showDate is defined and showDate %}
  21.                         <span class="flex items-center mb-4">
  22.                             <span class="mr-3">
  23.                                 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="19"><path fill="#8A8D94" fill-rule="evenodd" d="M4 14.25h12v-2H4v2Zm0-3h7v-2H4v2Zm-2 5h16v-9H2v9Zm2-13v1h2v-1h3v1h2v-1h3v1h2v-1h2v2H2v-2h2Zm15-2h-3v-1h-2v1h-3v-1H9v1H6v-1H4v1H1a1 1 0 0 0-1 1v15a1 1 0 0 0 1 1h18a1 1 0 0 0 1-1v-15a1 1 0 0 0-1-1Z"/></svg>
  24.                             </span>
  25.                             <span>{{ document.creationDate|date }}</span>
  26.                         </span>
  27.                     {% endif %}
  29.                     <div class="flex flex-col gap-4 sm:flex-row justify-between align-middle mb-8">
  30.                         <div class="flex flex-row gap-2 flex-wrap">
  31.                             {% if (isProjectPage == false) %}
  32.                                 {% set firstLabelUrl = null %}
  33.                                 {% set firstLabelText = document.getProperty('navigation_title') %}
  35.                                 {% if (isProjectPage == false) %}
  36.                                     {% for newsType in relatedNewsType ?? pimcore_relation("relatedNewsType") %}
  37.                                         {% set firstLabelUrl = labelBaseUrl ~ '?type=' ~ newsType.getId() %}
  38.                                         {% set firstLabelText = newsType.getDescription() %}
  39.                                         {% break %}
  40.                                     {% endfor %}
  41.                                 {% endif %}
  43.                                 {% set labelCounter = labelCounter + 1 %}
  44.                                 <a href="{{ firstLabelUrl | trimUrl }}" class="flex items-center bg-gray-200 flex items-center p-2 px-4 rounded-full">
  45.                                     <span class="w-5 h-5 mr-3">
  46.                                         <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  47.                                             <g id="icons/posttype/news" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  48.                                                 <path d="M13.8181818,-3.55271368e-14 C15.0231667,-3.55271368e-14 16,0.976833273 16,2.18181818 L16,13.8181818 C16,15.0231667 15.0231667,16 13.8181818,16 L2.18181818,16 L2.07292345,15.9973298 C0.918528257,15.9405885 -1.49213975e-13,14.986652 -1.49213975e-13,13.8181818 L-1.49213975e-13,7.27272727 C-1.49213975e-13,6.07106564 0.980156546,5.09090909 2.18181818,5.09090909 L2.90909091,5.09036364 L2.90909091,2.18181818 C2.90909091,1.01334797 3.82761917,0.0594115222 4.98201436,0.00267016758 L5.09090909,-3.55271368e-14 L13.8181818,-3.55271368e-14 Z M13.8181818,1.45454545 L5.09090909,1.45454545 C4.68924745,1.45454545 4.36363636,1.78015655 4.36363636,2.18181818 L4.36363636,13.8181818 C4.36363636,14.03727 4.33134435,14.2488159 4.2712603,14.4483197 L4.23945455,14.5452727 L13.8181818,14.5454545 C14.1962163,14.5454545 14.5068842,14.257024 14.5421253,13.888223 L14.5454545,13.8181818 L14.5454545,2.18181818 C14.5454545,1.78015655 14.2198435,1.45454545 13.8181818,1.45454545 Z M2.90909091,6.54509091 L2.18181818,6.54545455 C1.78347982,6.54545455 1.45454545,6.87438891 1.45454545,7.27272727 L1.45454545,13.8181818 C1.45454545,14.2198435 1.78015655,14.5454545 2.18181818,14.5454545 L2.2518594,14.5421253 C2.59761027,14.5090868 2.87272314,14.2339739 2.90576166,13.888223 L2.90909091,13.8181818 L2.90909091,6.54509091 Z M10.1818182,11.6363636 C10.5834798,11.6363636 10.9090909,11.9619747 10.9090909,12.3636364 C10.9090909,12.765298 10.5834798,13.0909091 10.1818182,13.0909091 L6.54545455,13.0909091 C6.14379291,13.0909091 5.81818182,12.765298 5.81818182,12.3636364 C5.81818182,11.9619747 6.14379291,11.6363636 6.54545455,11.6363636 L10.1818182,11.6363636 Z M12.3636364,8.72727273 C12.765298,8.72727273 13.0909091,9.05288382 13.0909091,9.45454545 C13.0909091,9.85620709 12.765298,10.1818182 12.3636364,10.1818182 L6.54545455,10.1818182 C6.14379291,10.1818182 5.81818182,9.85620709 5.81818182,9.45454545 C5.81818182,9.05288382 6.14379291,8.72727273 6.54545455,8.72727273 L12.3636364,8.72727273 Z M12.3636364,2.90909091 C12.765298,2.90909091 13.0909091,3.234702 13.0909091,3.63636364 L13.0909091,6.54545455 C13.0909091,6.94711618 12.765298,7.27272727 12.3636364,7.27272727 L6.54545455,7.27272727 C6.14379291,7.27272727 5.81818182,6.94711618 5.81818182,6.54545455 L5.81818182,3.63636364 C5.81818182,3.234702 6.14379291,2.90909091 6.54545455,2.90909091 L12.3636364,2.90909091 Z M11.6361818,4.36345455 L7.27254545,4.36345455 L7.27254545,5.81763636 L11.6361818,5.81763636 L11.6361818,4.36345455 Z" id="Combined-Shape" fill="#323E48"></path>
  49.                                             </g>
  50.                                         </svg>
  51.                                     </span>
  52.                                     <span>{{ firstLabelText|default(document.getProperty('navigation_title')) }}</span>
  53.                                 </a>
  54.                             {% endif %}
  56.                             {% for sector in sectors ?? pimcore_relations("relatedSectors") %}
  57.                                 {% set labelCounter = labelCounter + 1 %}
  58.                                 {% set param = isProjectPage ? '?branch=' : '?industries=' %}
  60.                                 {% if sector.getBranchename() | default() %}
  61.                                     <a href="{{ labelBaseUrl ~ param ~ sector.getId() | trimUrl }}" class="flex items-center bg-gray-200 flex items-center p-2 px-4 rounded-full">
  62.                                         {% if sector.icon %}
  63.                                             <span class="w-5 h-5 mr-3">
  64.                                         {{ sector.icon.thumbnail('icon').html|raw }}
  65.                                     </span>
  66.                                         {% endif %}
  67.                                         <span>{{ sector.branchename }}</span>
  68.                                     </a>
  69.                                     {% break %}
  70.                                 {% endif %}
  71.                             {% endfor %}
  73.                             {% for category in categories ?? pimcore_relations("relatedProductCategories") %}
  74.                                 {% if labelCounter >= 4 %}
  75.                                     {% break %}
  76.                                 {% endif %}
  78.                                 {% set labelCounter = labelCounter + 1 %}
  79.                                 {% if category.name | default() %}
  80.                                     <a href="{{ labelBaseUrl ~ '?product_category=' ~ category.getId() | trimUrl }}" class="flex items-center bg-gray-200 flex items-center p-2 px-4 rounded-full">
  81.                                         {% if category.icon %}
  82.                                             <span class="w-5 h-5 mr-3">
  83.                                         {{ category.icon.thumbnail('icon').html|raw }}
  84.                                     </span>
  85.                                         {% endif %}
  86.                                         <span>{{ category.name }}</span>
  87.                                     </a>
  88.                                 {% endif %}
  89.                             {% endfor %}
  91.                         </div>
  92.                         <ul class="flex flex-row">
  93.                             <li>
  94.                                 <a href="https://www.linkedin.com/shareArticle?mini=true&url={{ app.request.uri|url_encode }}" onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=400,width=800');return false;" class="flex items-center justify-center w-10 h-10 mr-2 transition-colors bg-blue-300 rounded-full hover:bg-blue" target="_blank">
  95.                                     <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16">
  96.                                         <path fill="#FFF" fill-rule="evenodd" id="b" d="M3.574 15.982H.264V5.324h3.31v10.658ZM1.917 3.87C.86 3.87 0 2.993 0 1.935a1.918 1.918 0 0 1 3.834 0c0 1.058-.858 1.935-1.917 1.935Zm14.047 12.112h-3.303v-5.188c0-1.237-.025-2.823-1.721-2.823-1.721 0-1.985 1.344-1.985 2.734v5.277H5.648V5.324h3.175v1.454h.046c.442-.838 1.522-1.721 3.133-1.721 3.35 0 3.966 2.205 3.966 5.07v5.855h-.004Z"/>
  97.                                     </svg>
  98.                                 </a>
  99.                             </li>
  100.                             <li>
  101.                                 <a href="mailto:?subject={{ pimcore_head_title()|url_encode }}&body={{ 'Hoi, ik heb deze website gevonden die je misschien interesseert:'|trans|url_encode }}%20{{ document.title|url_encode }}%20-%20{{ app.request.uri|url_encode }}"
  102.                                    target="_blank"
  103.                                    class="flex items-center justify-center w-10 h-10 mr-2 transition-colors bg-blue-300 rounded-full hover:bg-blue" target="_blank">
  104.                                     <svg xmlns="http://www.w3.org/2000/svg" width="14" height="12"><path fill="#FFF" fill-rule="evenodd" d="M1.4 9.8V3.877l5.316 2.362a.7.7 0 0 0 .568 0L12.6 3.877V9.8H1.4Zm11.2-8.4v.945L7 4.834 1.4 2.345V1.4h11.2ZM14 2.786V.7a.7.7 0 0 0-.7-.7H.7a.7.7 0 0 0-.7.7v9.8a.7.7 0 0 0 .7.7h12.6a.7.7 0 0 0 .7-.7V2.786Z"/></svg>
  105.                                 </a>
  106.                             </li>
  107.                         </ul>
  108.                     </div>
  109.                 </div>
  111.                 <div class="z-[1]">
  112.                     {{ pimcore_image('image',
  113.                         {
  114.                             'thumbnail': 'gallery',
  115.                             'reload': 'true',
  116.                             'imgAttributes': {class: 'w-full h-full rounded'},
  117.                             'pictureAttributes': {class: 'z-10 pt-10 relative'}
  118.                         }
  119.                     ) }}
  120.                 </div>
  121.             </div>
  122.         </section>
  123.     {% endblock %}
  124. </div>