templates/snippets/teaser-card-hero.html.twig line 1

Open in your IDE?
  1. {% set externalLink = pimcore_checkbox('externalLink').checked|default(false) %}
  3. {% if editmode %}
  4.     {{ include('layout/includes/css.html.twig') }}
  6.     <div class="ms-auto container-small">
  7.         {% embed 'includes/editmode-settings.html.twig' %}
  8.             {% block settings %}
  9.                 <div class="row">
  10.                     <div class="col">
  11.                         {{ pimcore_checkbox('holding', {
  12.                             label: 'Kuhn Holding',
  13.                             reload: true,
  14.                         }) }} <br><br>
  15.                         {{ pimcore_link('link',{reload: true}) }}<br><br>
  17.                         {% if pimcore_checkbox('holding').checked %}
  18.                             Background Image
  19.                             {{ pimcore_image('background-image', {
  20.                                 width: 200,
  21.                             }) }} <br>
  22.                     </div>
  23.                             <div class="col">
  24.                                 {{ pimcore_checkbox('externalLink', {
  25.                                     label: 'External Link?',
  26.                                     reload: true,
  27.                                 }) }} <br>
  28.                                 {% if externalLink %}
  29.                                     Logo for external Link (optional)
  30.                                     {{ pimcore_image('logo-image', {
  31.                                         width: 200,
  32.                                     }) }} <br>
  33.                                 {% endif %}
  34.                             </div>
  35.                         {% else %}
  36.                     </div>
  37.                         {% endif %}
  38.                 </div>
  39.             {% endblock %}
  40.         {% endembed %}
  41.     </div>
  42. {% endif %}
  44. {% if not pimcore_link('link').isEmpty() %}
  45.     {% if pimcore_checkbox('holding').checked %}
  46.         {% if editmode %}
  47.             <div class="w-25">
  48.         {% endif %}
  49.         <div class="position-relative link-box link-box--img link-box--{{ externalLink ? 'red' : 'orange' }}">
  50.             {% if not pimcore_image('background-image').isEmpty() %}
  51.                 <div class="ratio ratio-9x4">
  52.                     {{ pimcore_image('background-image').thumbnail('img-link-box').getHtml({
  53.                         imgAttributes: {
  54.                             class: 'ratio-item js-lazy-img img-link-box__img',
  55.                         },
  56.                         lowQualityPlaceholder: true,
  57.                     })|raw }}
  58.                 </div>
  59.             {% endif %}
  60.             <div class="link-box__content">
  61.                 <{{ editmode ? 'div' : 'a' }} href="{{ pimcore_link('link').href }}" target="{{ externalLink ? '_blank' : pimcore_link('link').target }}" class="link-box__title {{ not editmode ? 'stretch-link__link' }}">
  62.                     {% if not pimcore_image('logo-image').isEmpty() %}
  63.                         {{ pimcore_image('logo-image').thumbnail('footer-box-logo').getHtml({
  64.                             imgAttributes: {
  65.                                 class: 'img-fluid js-lazy-img',
  66.                             },
  67.                             lowQualityPlaceholder: true,
  68.                         })|raw }}
  69.                         <div class="link-box__title--sm">{{ pimcore_link('link').text }}</div>
  70.                     {% else %}
  71.                         <strong>{{ pimcore_link('link').text }}</strong>
  72.                         <div>
  73.                             {{ pimcore_input('holding-input', {
  74.                                 placeholder: 'Add title here'
  75.                             }) }}
  76.                         </div>
  77.                     {% endif %}
  78.                 </{{ editmode ? 'div' : 'a' }}>
  79.                 <span class="link-box__icon icon icon-{{ externalLink ? 'externallink' : 'arrow' }}" aria-hidden="true"></span>
  80.             </div>
  81.         </div>
  82.         {% if editmode %}
  83.             </div>
  84.         {% endif %}
  85.     {% else %}
  86.         <div class="col-md-3 col-auto">
  87.             <div class="link-box link-box--hero box-shadow-hover {{ not editmode ? 'stretch-link' }}">
  88.                 <{{ editmode ? 'div' : 'a' }} href="{{ pimcore_link('link').href }}" class="link-box__title {{ not editmode ? 'stretch-link__link' }}">
  89.                 <strong>
  90.                     {{ pimcore_link('link').text }}
  91.                 </strong>
  92.                 <div class="link-box__text">
  93.                     {{ pimcore_wysiwyg('wysiwyg', {
  94.                         placeholder: 'Add text here'
  95.                     }) }}
  96.                 </div>
  97.             </{{ editmode ? 'div' : 'a' }}>
  98.             <span class="icon icon-arrow" aria-hidden="true"></span>
  99.             </div>
  100.         </div>
  101.     {% endif %}
  102. {% endif %}