templates/Snippets/magazin-text-teaser.html.twig line 1

Open in your IDE?
  1. {# render footer-template #}
  2. {% if editmode %}
  3.     {% do pimcore_placeholder('magazine').set('true') %}
  5.     {{ include('Layout/includes/css.html.twig') }}
  6. {% endif %}
  8. {% if editmode %}
  9.     <div class="editmode-box editmode-box--info">
  10.         <div class="editmode-box__header">Settings</div>
  11.         {# TEXT TEASERS #}
  12.         <div>
  13.             <label>
  14.                 Color
  15.             </label>
  16.             <br>
  17.             {{ pimcore_select('teaserColor', {'store': [
  18.                 ['yellow', 'yellow'],
  19.                 ['blue', 'blue'],
  20.                 ['purple', 'purple'],
  21.                 ['green', 'green'],
  22.                 ['red', 'red'],
  23.             ], 'reload': true}) }}
  24.         </div>
  25.         <div>
  26.             <label>
  27.                 Image (optional)
  28.             </label>
  29.             {{ pimcore_relation('image', {'types': ['asset'], 'subtypes': ['image'], 'reload': true}) }}
  30.         </div>
  31.         {#<div>
  32.             <label>
  33.                 Icon (optional)
  34.             </label>
  35.             <br>
  36.             {{ pimcore_select('icon', {'store': [''], 'reload': true}) }}
  37.         </div>#}
  39.     </div> {# end editmode box #}
  40. {% endif %}
  42. {% if editmode %}
  43. <div class="vertical-gutter__item col-md-4 js-fade-in" style="height: 530px;">
  44.     {% endif %}
  46.     <section class="simple-text-teaser simple-text-teaser--{{ pimcore_select('teaserColor').getData() | default('green') }} {{ styleModifier | default(null)}} {{ not pimcore_link('button').isEmpty() ? 'stretch-link isCursor' : '' }}">
  47.         {% if not editmode %}
  48.             {% do jsConfig().add('goToLink', true) %}
  49.         {% endif %}
  51.         {% if not pimcore_relation('image').empty %}
  52.             <div class="simple-text-teaser__embed embed-responsive-cover embed-responsive simple-text-teaser__image">
  53.                 {{ pimcore_relation('image').element.thumbnail('simple-text-teaser').html({
  54.                     imgAttributes: {
  55.                         class: 'js-lazy-img embed-responsive-item teaser-animation__img'
  56.                     },
  57.                     lowQualityPlaceholder: true,
  58.                 }) | raw }}
  59.             </div>
  60.         {% endif %}
  62.         <div class="simple-text-teaser__content">
  63.             {% if false and not pimcore_select('icon').empty %}
  64.                 <span class="icon icon-{{ pimcore_select('icon').frontend }} simple-text-teaser__icon" aria-hidden="true"></span>
  65.             {% endif %}
  66.             {{ pimcore_textarea('title', {'placeholder' : 'Text', 'nl2br' : true}) }}
  67.         </div>
  69.         {{ pimcore_link('button', {
  70.             'class' : 'btn btn-outline-light simple-text-teaser__btn stretch-link__link'
  71.         }) }}
  72.     </section>
  73.     {% if editmode %}
  74. </div>
  75. {% endif %}