added visuel display on thematique page

This commit is contained in:
Bachir Soussi Chiadmi 2021-03-05 11:44:54 +01:00
parent ee81e5fe18
commit 596525328c
4 changed files with 28 additions and 9 deletions

View File

@ -2113,6 +2113,9 @@ article.card {
background-color: #69cdcf; background-color: #69cdcf;
padding: 0.5em 1em 1em; } padding: 0.5em 1em 1em; }
#main-content > article.thematique div.col-left section.visuel img {
width: 100%; }
#main-content > article.thematique aside.linked-materials ul { #main-content > article.thematique aside.linked-materials ul {
width: calc(100% + 13px); } width: calc(100% + 13px); }
#main-content > article.thematique aside.linked-materials ul li { #main-content > article.thematique aside.linked-materials ul li {

File diff suppressed because one or more lines are too long

View File

@ -1362,9 +1362,16 @@ article.card{
} }
div.col-right{} div.col-right{}
} }
div.col-left section.body{ div.col-left{
background-color: $color-base; section.body{
padding: 0.5em 1em 1em; background-color: $color-base;
padding: 0.5em 1em 1em;
}
section.visuel{
img{
width: 100%;
}
}
} }
aside.linked-materials{ aside.linked-materials{
ul{ ul{

View File

@ -6,6 +6,9 @@
<div class="cols"> <div class="cols">
<div class="col col-left"> <div class="col col-left">
<section class="body" v-html="thematique.body"></section> <section class="body" v-html="thematique.body"></section>
<section class="visuel">
<img :src="image_accroche.style_cardmedium.url" alt="">
</section>
</div> <!-- //col-left --> </div> <!-- //col-left -->
<div class="col col-right"> <div class="col col-right">
<aside class="linked-materials"> <aside class="linked-materials">
@ -125,13 +128,19 @@ export default {
}, },
parseDataGQL(thematique){ parseDataGQL(thematique){
console.log('parseDataGQL thematique', thematique) console.log('parseDataGQL thematique', thematique)
this.thematique = thematique if (thematique) {
this.thematique = thematique
this.image_accroche = thematique.images[0] if (thematique.images) {
this.image_accroche = thematique.images[0]
}
// update main page title // update main page title
this.$store.commit('Common/setPagetitle', thematique.title) this.$store.commit('Common/setPagetitle', thematique.title)
}else{
console.warn('Thematique not loaded');
}
this.loading = false; this.loading = false;
}, },
}, },