templates/includes/blocks/person-contact-form.html.twig line 1

  1. {% set contact = content.contact %}
  2. {% set socials = sulu_resolve_contact(contact.Id).socialMediaProfiles %}
  3.         {% if contact.avatar %}
  4.             {% set image = sulu_resolve_media(contact.avatar, app.request.locale) %}
  5.         {% endif %}
  6. <div class="person-contact-form {{ content.top }} {{ content.bottom }}" id="personContactForm"
  7.      x-data="personcontactform">
  8.     <div class="person-contact-form__container pb-m">
  9.         <div class="person-contact-form__content">
  10.             <div class="person-contact-form__info" x-ref="info">
  11.                 {% if contact.avatar %}
  12.                     <div class="person-contact-form__media">
  13.                         <img class="person-contact-form__image" src ="{{ image|thumbnailUrl('2880x') }}"
  14.                              srcset ="{{ image|thumbnailUrl('320x') }} 320w, {{ image|thumbnailUrl('640x') }} 640w, {{ image|thumbnailUrl('1280x') }} 1280w, {{ image|thumbnailUrl('1440x') }} 1440w, {{ image|thumbnailUrl('2048x') }} 2048w" alt="{{ contact.fullName|default(image.description|striptags) }}"
  15.                              x-ref="image" sizes="(min-width: 768px) 200px, 50vw">
  16.                     </div>
  17.                 {% endif %}
  18.                 <div class="person-contact-form__lead">
  19.                     {{ content.personLabel }}
  20.                 </div>
  21.                 <div class="person-contact-form__name" id="contact-person">
  22.                     {{ contact.fullName }}
  23.                 </div>
  24.                 <div class="person-contact-form__position">
  25.                     {% if contact.position %}
  26.                         {{ contact.position.position }}
  27.                     {% endif %}
  28.                 </div>
  29.                 {% for key, name in socials %}
  30.                     {% if 'linkedin' in name.username %}
  31.                         <a href="{{ name.username }}" class="person-contact-form__linkedin">
  32.                             <svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 44 44">
  33.                                 <circle cx="22" cy="22" r="22" fill="#E0E0E0"/>
  34.                                 <path fill-rule="evenodd" clip-rule="evenodd"
  35.                                       d="M17.211 30.025h-3.346V19.03h3.442v10.995h-.096zm-1.72-12.524c-1.053 0-2.009-.861-2.009-2.008 0-1.052.86-2.008 2.008-2.008 1.052 0 2.008.86 2.008 2.008 0 1.147-.86 2.007-2.008 2.007zm14.532 12.524H26.58v-5.354c0-1.243 0-2.868-1.721-2.868-1.817 0-2.008 1.338-2.008 2.773v5.45H19.41V19.03h3.25v1.53c.479-.86 1.53-1.721 3.252-1.721 3.442 0 4.11 2.295 4.11 5.259v5.927z"
  36.                                       fill="#000"/>
  37.                             </svg>
  38.                         </a>
  39.                     {% endif %}
  40.                 {% endfor %}
  41.                 <a href="mailto:{{ contact.getMainEmail }}"
  42.                    class="person-contact-form__email" id="contact-person-email">{{ contact.getMainEmail }}</a>
  43.                 <a href="tel:{{ contact.getMainPhone }} "
  44.                    class="person-contact-form__tel">{{ contact.getMainPhone }}</a>
  45.                 <div class="person-contact-form__actions">
  46.                     {% for key, name in socials %}
  47.                         {% if 'calendly' in name.username and content.calendlyLabel != null %}
  48.                             {% if content.personContactFormCalendlyFormBlock is defined and content.personContactFormCalendlyFormBlock.calendlyModalContact is defined and content.personContactFormCalendlyFormBlock.calendlyModalContact %}
  49.                                 <div class="modal" :class="{'modal--show': show}" x-data="modal">
  50.                                     <button @click="open"
  51.                                             class="button button--default">
  52.                                                     <span class="button__inner">
  53.                                                         {{ content.calendlyLabel }}
  54.                                                     </span>
  55.                                     </button>
  56.                                     {% include('/includes/blocks/' ~ content.personContactFormCalendlyFormBlock.type ~ '.html.twig') with { content: content.personContactFormCalendlyFormBlock, view: view.personContactFormCalendlyFormBlock } %}
  57.                                 </div>
  58.                             {% else %}
  59.                                 <a href="{{ name.username }}" class="button button--default" target="_blank">
  60.                                     <span class="button__inner">
  61.                                         {{ content.calendlyLabel }}
  62.                                     </span>
  63.                                 </a>
  64.                             {% endif %}
  65.                         {% endif %}
  66.                     {% endfor %}
  67.                     <button class="button button--default" @click.prevent="openForm()">
  68.                         <span class="button__inner">
  69.                             {{ content.contactFormButtonLabel }}
  70.                         </span>
  71.                     </button>
  72.                 </div>
  73.             </div>
  74.             <div x-ref="formcontainer">
  75.                 <div class="person-contact-form__form" x-show="open" x-ref="form" x-transition>
  76.                     <div class="person-contact-form__title {% if content.personContactFormTitleMobile %}desktop-only {% endif %}">
  77.                         {{ content.headline|raw }}
  78.                     </div>
  79.                     {% if content.personContactFormTitleMobile %}
  80.                         <div class="person-contact-form__title mobile-only">
  81.                             {{ content.personContactFormTitleMobile }}
  82.                         </div>
  83.                     {% endif %}
  84.                     <div class="person-contact-form__text">
  85.                         {{ content.text|raw }}
  86.                     </div>
  87.                     {{ include('/includes/form.html.twig', {
  88.                         'formName': 'person_contact_form',
  89.                         'id': 'person-contactform',
  90.                         'firstName': content.personContactFormFirstname,
  91.                         'lastName': content.personContactFormLastName,
  92.                         'unternehmen': content.personContactFormUnternehmen,
  93.                         'email': content.personContactFormEmail,
  94.                         'message': content.personContactFormMessage,
  95.                         'subscription': content.personContactFormSubscribe,
  96.                         'terms': content.personContactFormTerms,
  97.                         'referrer': content.personContactFormReferrer,
  98.                         'send': content.personContactFormButtonSend,
  99.                         'sended': content.personContactFormButtonSended,
  100.                         'success': content.personContactFormSuccess,
  101.                         'error': content.personContactFormError
  102.                     }) }}
  103.                 </div>
  104.             </div>
  105.         </div>
  106.     </div>
  107. </div>