Merge branch 'feature/fix-news-lint' into develop

This commit is contained in:
Christian Cueni 2020-06-17 14:39:09 +02:00
commit 6d3fc6531c
2 changed files with 74 additions and 73 deletions

View File

@ -1,9 +1,17 @@
<template> <template>
<div class="news-teasers"> <div class="news-teasers">
<div v-for="teaser in newsTeasers" :key="teaser.id" class="news-teasers__teaser teaser"> <div
:key="teaser.id"
class="news-teasers__teaser teaser"
v-for="teaser in newsTeasers">
<a :href="teaser.newsArticleUrl"> <a :href="teaser.newsArticleUrl">
<img :src="teaser.imageUrl" class="teaser__image" /> <img
<p class="teaser__image-source"><a class="tiny-text" :href="teaser.imageSource">Quelle {{teaser.imageSource}}</a></p> :src="teaser.imageUrl"
class="teaser__image">
<p class="teaser__image-source">
<a
:href="teaser.imageSource"
class="tiny-text">Quelle {{ teaser.imageSource }}</a></p>
<h4 class="teaser__title">{{ teaser.title }}</h4> <h4 class="teaser__title">{{ teaser.title }}</h4>
<p class="teaser__description">{{ teaser.description }}</p> <p class="teaser__description">{{ teaser.description }}</p>
<p class="teaser__date">{{ teaser.displayDate }}</p> <p class="teaser__date">{{ teaser.displayDate }}</p>
@ -13,13 +21,15 @@
</template> </template>
<script> <script>
import NEWS_TEASER_QUERY from '@/graphql/gql/newsTeasersQuery.gql'; import NEWS_TEASER_QUERY from '@/graphql/gql/newsTeasersQuery.gql';
export default { export default {
components: {}, components: {},
computed: { data() {
return {
newsTeasers: []
};
}, },
apollo: { apollo: {
@ -27,17 +37,11 @@
newsTeasers: { newsTeasers: {
query: NEWS_TEASER_QUERY, query: NEWS_TEASER_QUERY,
update(data) { update(data) {
return this.$getRidOfEdges(data).newsTeasers return this.$getRidOfEdges(data).newsTeasers;
},
},
},
data() {
return {
newsTeasers: []
} }
},
} }
}
};
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@ -49,11 +53,9 @@
$image_height: 254px; $image_height: 254px;
.teasers { .teasers {
display: block; display: block;
@include desktop { @include desktop {
@supports (display: grid) { @supports (display: grid) {
display: grid; display: grid;
display: -ms-grid; display: -ms-grid;
@ -68,7 +70,6 @@
} }
.teaser { .teaser {
margin-bottom: $large-spacing; margin-bottom: $large-spacing;
position: relative; position: relative;