templates/project/partials/contact.html.twig line 1

Open in your IDE?
  1. {% set bgColor = backgroundColor|default('bg-blue-200') %}
  2. {% set showContact = editmode or (not pimcore_input('contact-title').isEmpty() and not pimcore_input('contact-subtitle').isEmpty()) %}
  4. {% if showContact %}
  5. <section class="{{ bgColor }} py-10 md:py-20">
  6.     <div class="container">
  7.         <div class="bg-blue-300 text-white rounded w-full py-4 px-8 pr-16">
  8.             <div class="flex flex-col md:flex-row md:justify-between">
  9.                 <div class="flex flex-col md:flex-row md:items-center gap-8">
  10.                     <div class="w-[60px] h-[60px] md:w-[116px] md:h-[116px] bg-white rounded-full overflow-hidden">
  11.                         {% if editmode %}
  12.                             {{ pimcore_image('contact-image') }}
  13.                         {% elseif not pimcore_image('contact-image').isEmpty() %}
  14.                             {{ pimcore_image('contact-image').thumbnail('contact-people-image').html(
  15.                                 {
  16.                                   imgAttributes: {class: 'w-full h-full'},
  17.                                 }
  18.                             ) | raw }}
  19.                         {% endif %}
  20.                     </div>
  21.                     <div class="flex flex-col">
  22.                         <h2 class="text-[24px]">{{ pimcore_input('contact-title', {placeholder: 'Contact title'}) }}</h2>
  23.                         <p class="text-[18px]">{{ pimcore_input('contact-subtitle', {placeholder: 'Contact subtitle'}) }}</p>
  24.                     </div>
  25.                 </div>
  26.                 <div class="flex flex-col">
  27.                     {% if editmode %}
  28.                         {{ pimcore_link('contact-call-expert') }}
  29.                     {% elseif pimcore_link('contact-call-expert').getHref() | default() %}
  30.                         <a href="{{ pimcore_link('contact-call-expert').getHref() }}" class="button button__primary !text-center mt-6">
  31.                             {{ pimcore_link('contact-call-expert').getText() }}
  32.                         </a>
  33.                     {% endif %}
  35.                     {% if editmode %}
  36.                         {{ pimcore_link('contact-for-call-back') }}
  37.                     {% elseif pimcore_link('contact-for-call-back').getHref() | default() %}
  38.                         <a href="{{ pimcore_link('contact-for-call-back').getHref() }}" class="button button__secondary !justify-start md:!justify-center !text-left md:!text-center group button__secondary--white">
  39.                             {{ pimcore_link('contact-for-call-back').getText() }}
  40.                             <span 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 class="h-3.5 w-3.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="currentColor" 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>
  41.                         </a>
  42.                     {% endif %}
  43.                 </div>
  44.             </div>
  45.         </div>
  46.     </div>
  47. </section>
  48. {% endif %}