Add link, align date on bottom
This commit is contained in:
parent
ca6adf75e1
commit
deeab23088
|
|
@ -1,11 +1,13 @@
|
|||
<template>
|
||||
<div class="news__teasers teasers">
|
||||
<div v-for="teaser in newsTeasers" :key="teaser.id" class="teasers__teaser teaser">
|
||||
<img :src="teaser.imageUrl" class="teaser__image" />
|
||||
<p class="teaser__image-source"><a class="tiny" :href="teaser.imageSource">Quelle {{teaser.imageSource}}</a></p>
|
||||
<h4 class="teaser__title">{{teaser.title}}</h4>
|
||||
<p class="teaser__description">{{teaser.description}}</p>
|
||||
<p class="teaser__date">{{teaser.displayDate}}</p>
|
||||
<a :href="teaser.newsArticleUrl">
|
||||
<img :src="teaser.imageUrl" class="teaser__image" />
|
||||
<p class="teaser__image-source"><a class="tiny" :href="teaser.imageSource">Quelle {{teaser.imageSource}}</a></p>
|
||||
<h4 class="teaser__title">{{teaser.title}}</h4>
|
||||
<p class="teaser__description">{{teaser.description}}</p>
|
||||
<p class="teaser__date">{{teaser.displayDate}}</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -68,6 +70,7 @@
|
|||
.teaser {
|
||||
|
||||
margin-bottom: $large-spacing;
|
||||
position: relative;
|
||||
|
||||
&__image {
|
||||
display: block;
|
||||
|
|
@ -91,6 +94,9 @@
|
|||
font-family: $sans-serif-font-family;
|
||||
font-weight: $font-weight-regular;
|
||||
color: $color-silver-dark;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue