<div class="o-front-events o-front-events--full-width">
<div class="o-front-events__cat-title">
<h2 class="a-cat-title">
<span class="a-cat-title__link a-cat-title__link--no-link">Events</span>
</h2>
</div>
<div class="o-front-events__events">
<div class="o-front-events__event">
<div class="o-front-events__inner">
<a class="a-event-link" href="">
<div class="a-event-link__image">
<figure class="a-image a-image--cover">
<img src="/img/dv.jpg" alt="Die Delegierten schreiten zur Abstimmung" title="This is a linked image" class="a-image__image a-image__image--fp a-image__image--fp-">
<figcaption>
</figcaption>
</figure>
</div>
<h3 class="a-event-link__title">Öffentlichkeit und Demokratie im Zeitalter der Neuen Medien</h3>
<div class="a-event-link__meta">
<time class="a-event-link__datetime" datetime="2018-08-25 11:00">28. Oktober 2017 | 10:45 - 12:30</time>
<div class="a-event-link__place">Hotel & Restaurant Landgasthof, Baselstrasse 38, Riehen</div>
</div>
</a>
</div>
</div>
<div class="o-front-events__event">
<div class="o-front-events__inner">
<a class="a-event-link" href="">
<div class="a-event-link__image">
<figure class="a-image a-image--cover">
<img src="/img/dv.jpg" alt="Die Delegierten schreiten zur Abstimmung" title="This is a linked image" class="a-image__image a-image__image--fp a-image__image--fp-">
<figcaption>
</figcaption>
</figure>
</div>
<h3 class="a-event-link__title">Delegiertenversammlung mit Stargast mit sehr langem Namen</h3>
<div class="a-event-link__meta">
<time class="a-event-link__datetime" datetime="2018-08-25 11:00">25. August 2018 | 11:00</time>
<div class="a-event-link__place">Säulenhalle Zug</div>
</div>
</a>
</div>
</div>
<div class="o-front-events__event">
<div class="o-front-events__inner">
<a class="a-event-link" href="">
<div class="a-event-link__image">
<figure class="a-image a-image--cover">
<img src="/img/dv.jpg" alt="Die Delegierten schreiten zur Abstimmung" title="This is a linked image" class="a-image__image a-image__image--fp a-image__image--fp-">
<figcaption>
</figcaption>
</figure>
</div>
<h3 class="a-event-link__title">Netzwerktreffen Grüne Städte – voneinander lernen</h3>
<div class="a-event-link__meta">
<time class="a-event-link__datetime" datetime="2018-08-25 11:00">10. Juni 2017 | 10:15 - 16:45</time>
<div class="a-event-link__place">aki, Alpeneggstrasse 5, Bern</div>
</div>
</a>
</div>
</div>
<div class="o-front-events__event">
<div class="o-front-events__inner">
<a class="a-event-link" href="">
<div class="a-event-link__image">
<figure class="a-image a-image--cover">
<img src="/img/dv.jpg" alt="Die Delegierten schreiten zur Abstimmung" title="This is a linked image" class="a-image__image a-image__image--fp a-image__image--fp-">
<figcaption>
</figcaption>
</figure>
</div>
<h3 class="a-event-link__title">Delegiertenversammlung</h3>
<div class="a-event-link__meta">
<time class="a-event-link__datetime" datetime="2018-08-25 11:00">25. August 2018 – 11:00</time>
<div class="a-event-link__place">Säulenhalle Zug</div>
</div>
</a>
</div>
</div>
</div>
<div class="o-front-events__more">
<div class="a-link-button ">
Alle Events anzeigen
</div>
</div>
</div>
<div class="o-front-events {{modifiers_classes}}">
<div class="o-front-events__cat-title">
{{> @a-cat-title cat-title}}
</div>
<div class="o-front-events__events">
{{#each events}}
<div class="o-front-events__event">
<div class="o-front-events__inner">
{{> @a-event-link this }}
</div>
</div>
{{/each}}
</div>
<div class="o-front-events__more">
{{> @a-link-button link-button}}
</div>
</div>
.o-front-events {
@extend .grid-item;
padding-left: 0;
padding-right: 0;
@include media($_DESKTOP) {
max-width: $grid-max-width-max;
}
&__cat-title {
margin-bottom: 4px;
@include fluid-grid-item-props(margin-left);
@include media($_DESKTOP) {
margin-bottom: 25px;
}
}
&__events {
width: 100%;
display: grid;
align-items: stretch;
grid-template-columns: 1fr;
@include fluid-props(grid-column-gap, $size-medium, $grid-max-width-max, $grid-gap-min, $grid-gap-max);
}
&--full-width &__events {
@include media($_DESKTOP) {
grid-template-columns: 1fr 1fr;
}
}
&__inner {
border-bottom: 1px solid $color-grey-2;
height: 100%;
}
&__event {
width: 100%;
@include fluid-grid-item-props(padding-left padding-right);
@include hover {
background-color: $color-grey-1;
}
}
&__more {
padding-top: 16px;
@include fluid-grid-item-props(padding-left);
}
}
{
"modifiers": [
"full-width"
],
"cat-title": {
"label": "Events"
},
"link-button": {
"label": "Alle Events anzeigen",
"link": "#"
},
"events": [
{
"title": "Öffentlichkeit und Demokratie im Zeitalter der Neuen Medien",
"timestamp": "2018-08-25 11:00",
"datetime": "28. Oktober 2017 | 10:45 - 12:30",
"place": "Hotel & Restaurant Landgasthof, Baselstrasse 38, Riehen",
"link-url": "#",
"image": {
"image-src": "/img/dv.jpg",
"alt": "Die Delegierten schreiten zur Abstimmung",
"title": "This is a linked image"
}
},
{
"title": "Delegiertenversammlung mit Stargast mit sehr langem Namen",
"timestamp": "2018-08-25 11:00",
"datetime": "25. August 2018 | 11:00",
"place": "Säulenhalle Zug",
"link-url": "#",
"image": {
"image-src": "/img/dv.jpg",
"alt": "Die Delegierten schreiten zur Abstimmung",
"title": "This is a linked image"
}
},
{
"title": "Netzwerktreffen Grüne Städte – voneinander lernen",
"timestamp": "2018-08-25 11:00",
"datetime": "10. Juni 2017 | 10:15 - 16:45",
"place": "aki, Alpeneggstrasse 5, Bern",
"link-url": "#",
"image": {
"image-src": "/img/dv.jpg",
"alt": "Die Delegierten schreiten zur Abstimmung",
"title": "This is a linked image"
}
},
{
"title": "Delegiertenversammlung",
"timestamp": "2018-08-25 11:00",
"datetime": "25. August 2018 – 11:00",
"place": "Säulenhalle Zug",
"link-url": "#",
"image": {
"image-src": "/img/dv.jpg",
"alt": "Die Delegierten schreiten zur Abstimmung",
"title": "This is a linked image"
}
}
]
}
No notes defined.