templates/Snippets/simpleTextTeaser.html.twig line 1

Open in your IDE?
  1. {# render footer-template #}
  2. {% if editmode %}
  3.     {{ include('Layout/includes/css.html.twig') }}
  4. {% endif %}
  5. {% set thumbnail = thumbnail|default(app.request.get('thumbnail', 'simple-text-teaser')) %}
  6. {% if thumbnail == false %}
  7.     {% set thumbnail = 'simple-text-teaser' %}
  8. {% endif %}
  9. {% if editmode %}
  10.     <div class="editmode-box editmode-box--info mb-5 text-left">
  11.         <div class="editmode-box__header">Settings</div>
  12.         <div>
  13.             <label>
  14.                 Color
  15.             </label> <br>
  16.             {{ pimcore_select('color', {
  17.                 'store': ['default', 'yellow', 'blue', 'purple', 'green', 'red'],
  18.                 'defaultValue': 'default'
  19.             }) }}
  20.         </div>
  21.         <div>
  22.             <label>
  23.                 BG Image
  24.             </label> <br>
  25.             {{ pimcore_image('image', {
  26.                 thumbnail: thumbnail,
  27.                 width: 400,
  28.                 imgAttributes: {
  29.                     class: 'js-lazy-img embed-responsive-item teaser-animation__img'
  30.                 },
  31.                 lowQualityPlaceholder: true
  32.             }) }}
  33.         </div>
  34.     </div>
  35. {% endif %}
  36. <section class="simple-text-teaser simple-text-teaser--small {{ not pimcore_image('image').empty ? 'simple-text-teaser--has-image' : '' }} simple-text-teaser--{{ pimcore_select('color').data }} {{ styleModifier | default(null)}} {{ not pimcore_link('button').empty ? 'stretch-link  isCursor' : '' }}" {{ editmode ? 'style="max-width: 350px;"' : '' }}>
  37.     {% do jsConfig().add('goToLink', true) %}
  39.     {% if editmode or not pimcore_image('image').empty %}
  40.         {% set description = getImageDescription(pimcore_image('image').image) %}
  41.         <div class="simple-text-teaser__embed embed-responsive-cover embed-responsive simple-text-teaser__image">
  42.             {{ pimcore_image('image', {
  43.                 thumbnail: thumbnail,
  44.                 imgAttributes: {
  45.                     class: 'js-lazy-img embed-responsive-item teaser-animation__img'
  46.                 },
  47.                 lowQualityPlaceholder: true
  48.             }).frontend|raw }}
  49.         </div>
  50.     {% endif %}
  52.     <div class="simple-text-teaser__content">
  53.         {% if editmode %}
  54.             {{ pimcore_select('icon', {store: selectableIcons()}) }}
  55.         {% elseif not pimcore_select('icon').empty %}
  56.             <span class="icon icon-{{ pimcore_select('icon').data }} simple-text-teaser__icon" aria-hidden="true"></span>
  57.         {% endif %}
  59.         {{ pimcore_textarea('text', {'nl2br': true}) }}
  60.     </div>
  61.     {% if editmode %}
  62.         {{ pimcore_link('button', {
  63.             'class': 'btn btn-outline-light simple-text-teaser__btn'
  64.         })  }}
  65.     {% elseif not pimcore_link('button').empty %}
  66.         {{ pimcore_link('button', {
  67.             'class': 'btn btn-outline-light simple-text-teaser__btn stretch-link__link',
  68.         }) }}
  69.     {% endif %}
  70. </section>