bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

better blabla/article display

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2020-02-20 10:36:49 +01:00
parent b6c38341b4
commit b32e609538
5 changed files with 89 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
web/themes/custom/materiotheme/vuejs/components/Pages/Article.vue
View File

@ -23,59 +23,65 @@
</li>
</ul>
</nav>
<section class="accroche">
<figure>
<img
:src="content.image_accroche.src"
:alt="content.image_accroche.alt"
:title="content.image_accroche.title"
/>
</figure>
</section>
<section class="taxonomy">
<div class="thesaurus">
<ul>
<li
v-for="term in content.field_thesaurus" v-bind:key="term.id"
>{{ term.name }}</li>
</ul>
</div>
<div class="tags">
<ul>
<li
v-for="term in content.field_tags" v-bind:key="term.id"
>{{ term.name }}</li>
</ul>
</div>
</section>
<section class="body" v-html="content.body"></section>
<section class="video">
<ul>
<li v-for="video in content.videos" v-bind:key="video.id">
<vimeo-player
v-if="video.provider == 'vimeo'"
ref="player"
:video-id="video.id"
<div class="cols">
<div class="col col-left">
<section class="accroche">
<figure>
<img
:src="content.image_accroche.src"
:alt="content.image_accroche.alt"
:title="content.image_accroche.title"
/>
<youtube
v-if="video.provider == 'youtube'"
:video-id="video.id"
/>
</li>
</ul>
</section>
<section class="visuels">
<figure
v-for="visuel in content.field_visuel" v-bind:key="visuel.id"
>
<img
:src="visuel.src"
:alt="visuel.alt"
:title="visuel.title"
/>
<caption></caption>
</figure>
</section>
</figure>
</section>
<section class="taxonomy">
<div class="thesaurus">
<ul>
<li
v-for="term in content.field_thesaurus" v-bind:key="term.id"
>{{ term.name }}</li>
</ul>
</div>
<div class="tags">
<ul>
<li
v-for="term in content.field_tags" v-bind:key="term.id"
>{{ term.name }}</li>
</ul>
</div>
</section>
<section class="body" v-html="content.body"></section>
<section v-if="content.videos" class="videos">
<ul>
<li v-for="video in content.videos" v-bind:key="video.id">
<vimeo-player
v-if="video.provider == 'vimeo'"
ref="player"
:video-id="video.id"
:player-width="480"
/>
<youtube
v-if="video.provider == 'youtube'"
:video-id="video.id"
:player-width="480"
/>
</li>
</ul>
</section>
</div> <!-- //col-left -->
<div class="col col-right">
<section class="visuels">
<figure v-for="visuel in content.field_visuel" v-bind:key="visuel.id">
<img
:src="visuel.src"
:alt="visuel.alt"
:title="visuel.title"
/>
<caption v-if="visuel.title">{{ visuel.title }}</caption>
</figure>
</section>
</div> <!-- // col-right -->
</div> <!-- // cols -->
<aside class="linked-materials">
<h3 class="field__label">Linked Materials</h3>
<div class="card-list">