<!-- Default -->
<div class="mediaItem">
<div class="mediaItem_img" aria-hidden="true" style="background-image: url('../../assets/bridge-676-504.jpg');"></div>
<div class="mediaItem_content">
<p class="u-c-theme u-fw-bold u-push-btm-4 u-tt-caps u-fs-sm u-ls-1">
04.01.1984
</p>
<h3 class="mediaItem_title">
<a href="#">
Lorem ipsum
</a>
</h3>
<div class="typography">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>
</div>
</div>
</div>
<!-- Inverted Elements -->
<div class="mediaItem mediaItem-alternating">
<div class="mediaItem_img" aria-hidden="true" style="background-image: url('../../assets/bridge-676-504.jpg');"></div>
<div class="mediaItem_content">
<p class="u-c-theme u-fw-bold u-push-btm-4 u-tt-caps u-fs-sm u-ls-1">
04.01.1984
</p>
<h3 class="mediaItem_title">
<a href="#">
Lorem ipsum
</a>
</h3>
<div class="typography">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>
</div>
</div>
</div>
<!-- Only Text -->
<div class="mediaItem">
<div class="mediaItem_content mediaItem_content-full">
<p class="u-c-theme u-fw-bold u-push-btm-4 u-tt-caps u-fs-sm u-ls-1">
04.01.1984
</p>
<h3 class="mediaItem_title">
<a href="#">
Lorem ipsum
</a>
</h3>
<div class="typography">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>
</div>
</div>
</div>
<div class="mediaItem{{#if position }} mediaItem-{{ position }}{{/if}}">
{{#if img }}
<div class="mediaItem_img" aria-hidden="true" style="background-image: url('{{ path img }}');"></div>
{{/if}}
<div class="mediaItem_content{{#unless img}} mediaItem_content-full{{/unless}}">
<p class="u-c-theme u-fw-bold u-push-btm-4 u-tt-caps u-fs-sm u-ls-1">
{{ date }}
</p>
<h3 class="mediaItem_title">
<a href="{{ url }}">
{{label}}
</a>
</h3>
<div class="typography">
{{{ htmlText }}}
</div>
</div>
</div>
/* Default */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/assets/bridge-676-504.jpg",
"date": "04.01.1984"
}
/* Inverted Elements */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/assets/bridge-676-504.jpg",
"date": "04.01.1984",
"position": "alternating"
}
/* Only Text */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": null,
"date": "04.01.1984"
}
There are no notes for this item.