templates/Includes/hotspot.html.twig line 1

Open in your IDE?
  1. {% set isPlain = isPlain|default(false) %}
  2. <div class="hotspot {{ isPlain ? 'hotspot--plain' : '' }} {{ styleModifier|default('') }} js-hotspot" style="left: {{ left|default(0) }}%; top: {{ top|default(0) }}%;">
  3.     {% if isPlain %}
  4.         <div class="hotspot__btn">
  5.             {#            <div class="avalanche-icon-container">#}
  6.             <span class="avalanche-icon {{ avalanche }}"></span>
  7.             {#            </div>#}
  8.         </div>
  9.     {% else %}
  10.         <button type="button" class="hotspot__btn position-relative js-hotspot__toggle {{ smallHotspot | default(null) ? 'hotspot__btn--small' : '' }}">
  11.             {% if img|default(false) %}
  12.                 <img src="{{ img }}" alt="" class="img-fluid hotspot__btn__img">
  13.             {% endif %}
  15.             {% if value|default(false) %}
  16.                 <span class="hotspot__btn__value text-nowrap strong">{{ value }}</span>
  17.             {% endif %}
  18.         </button>
  19.     {% endif %}
  21.     {% if detail|default(false) and not isPlain %}
  22.         <div class="hotspot__popover text-md-center">
  23.             <button type="button" class="btn-no-styling hotspot__popover__close js-hotspot__toggle js-hotspot__toggle-close">
  24.                 <span class="icon icon-close" aria-label="close" title="close"></span>
  25.             </button>
  27.             <div class="row row-gutter--2 align-items-center vertical-gutter--3">
  28.                 <div class="col-12 vertical-gutter__item">
  29.                     {% if detail.title|default(false) or title|default(false) %}
  30.                         <div class="font-decorative">{{ detail.title|default(false) ?: title }}</div>
  31.                     {% endif %}
  33.                     {% if detail.subtitle|default(false) or subtitle|default(false) %}
  34.                         {{ detail.subtitle|default(false) ?: subtitle}}
  35.                     {% endif %}
  37.                     {% if detail.image|default(false) %}
  38.                         {% set description = getImageDescription(detail.image, true) %}
  39.                         <img src="{{ detail.image.thumbnail('infobox') }}" title="{{ description|default('') }}" alt="{{ description|default('') }}" class="mt-1" width="75%">
  40.                     {% endif %}
  41.                 </div>
  43.                 {% if detail.hasWeatherDetail | default(null) %}
  44.                     <div class="col-4 col-md-12 vertical-gutter__item">
  45.                         <div class="weather-item weather-item--sm">
  46.                             <div class="row justify-content-center align-items-center">
  47.                                 <div class="col-auto">
  48.                                     <img alt="" class="img-fluid weather-item__img js-lazy-img" data-src="{{ img }}">
  49.                                 </div>
  50.                                 <div class="col-auto">
  51.                                     <div class=" mb-2 font-decorative text-uppercase fz14">
  52.                                         {{ 'weather.Heute'|trans }}
  53.                                     </div>
  54.                                     <div class="font-default-bold">
  55.                                         <span class="weather-item__val">{{ value }}C</span>
  56.                                     </div>
  57.                                 </div>
  59.                             </div>
  60.                         </div>
  62.                     </div>
  63.                 {% endif %}
  65.                 {% if (detail.link|default(false) and detail.link.href|default(false)) or
  66.                       (link|default(false) and link['href']|default(false))
  67.                 %}
  68.                     <div class="col-8 col-md-12 text-right text-md-center vertical-gutter__item">
  69.                         <a href="{{ detail.link.href|default(false) ?: link['href']|default(false) }}" {{ detail.link.target|default(false) ? 'target="' ~ detail.link.target ~ '"' : ''}} class="btn btn-sm btn-primary-light">{{ detail.link.text|default(false) ?: link['text']|default(false) }}</a>
  70.                     </div>
  71.                 {% endif %}
  73.                 {% if (detail.webcamIframe|default(false) and detail.webcamIframe.url|default(false)) %}
  74.                     <div class="col-8 col-md-12 text-right text-md-center vertical-gutter__item">
  75.                         <div class="js-lightbox__item btn btn-sm btn-primary-light" data-sub-html='' data-iframe="true" data-src="{{ detail.webcamIframe.url }}">
  76.                             {{ detail.webcamIframe.buttonText|default(false)|default(false) }}
  77.                         </div>
  78.                     </div>
  79.                 {% endif %}
  81.             </div>
  82.         </div>
  83.     {% endif %}
  84. </div>