40 lines
1.5 KiB
Twig
40 lines
1.5 KiB
Twig
{% use '@Contao/component/_figure.html.twig' %}
|
|
|
|
<link rel="stylesheet" href="{{ asset('bundles/contaopinboard/assets/pinboard.css') }}">
|
|
|
|
<section class="pinboard" data-pinboard>
|
|
<div class="pinboard__surface" data-pinboard-surface>
|
|
{% for entry in entries %}
|
|
<article
|
|
class="pin-note{% if entry.highlighted %} is-highlighted{% endif %}"
|
|
data-pin-note
|
|
data-highlighted="{{ entry.highlighted ? '1' : '0' }}"
|
|
data-seed="{{ entry.id }}"
|
|
aria-label="{{ entry.headline }}"
|
|
>
|
|
<div class="pin-note__inner" data-pin-note-inner>
|
|
{% if entry.imageFigure %}
|
|
<figure class="pin-note__image-wrap">
|
|
{% with {figure: entry.imageFigure} %}{{ block('figure_component') }}{% endwith %}
|
|
</figure>
|
|
{% endif %}
|
|
|
|
<h3 class="pin-note__headline">{{ entry.headline }}</h3>
|
|
<div class="pin-note__text">{{ entry.text|e|nl2br }}</div>
|
|
|
|
{% if entry.link %}
|
|
<p class="pin-note__link-wrap">
|
|
<a href="{{ entry.link }}" class="pin-note__link" target="_blank" rel="noopener">Mehr erfahren</a>
|
|
</p>
|
|
{% endif %}
|
|
</div>
|
|
</article>
|
|
{% else %}
|
|
<p class="pinboard__empty">Keine veröffentlichten Pinnwandeinträge vorhanden.</p>
|
|
{% endfor %}
|
|
</div>
|
|
</section>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/muuri@0.9.5/dist/muuri.min.js" defer></script>
|
|
<script src="{{ asset('bundles/contaopinboard/assets/pinboard.js') }}" defer></script>
|