yetangitu/pixelfed
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Update album presenters, use better carousel

Browse source
This commit is contained in:
Daniel Supernault 2019-10-15 21:37:44 -06:00
parent c5577112ed
commit 31b114cc0b
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
2 changed files with 70 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

21
resources/assets/js/components/presenter/MixedAlbumPresenter.vue
View file

@ -28,8 +28,8 @@
</b-carousel>
</details>
</div>
<div v-else>
<b-carousel :id="status.id + '-carousel'"
<div v-else class="w-100 h-100 p-0">
<!-- <b-carousel :id="status.id + '-carousel'"
style="text-shadow: 1px 1px 2px #333; background-color: #000;"
controls
img-blank
@ -49,7 +49,22 @@
<p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p>
</b-carousel-slide>
</b-carousel>
</b-carousel> -->
<carousel ref="carousel" :centerMode="true" :loop="false" :per-page="1" :paginationPosition="'bottom-overlay'" paginationActiveColor="#3897f0" paginationColor="#dbdbdb">
<slide v-for="(media, index) in status.media_attachments" :key="'px-carousel-'+media.id + '-' + index" class="w-100 h-100 d-block mx-auto text-center" style="max-height: 600px;">
<video v-if="media.type == 'Video'" class="embed-responsive-item" preload="none" controls loop :title="media.description" width="100%" height="100%" :poster="media.preview_url">
<source :src="media.url" :type="media.mime">
</video>
<div v-else-if="media.type == 'Image'" :title="media.description">
<img :class="media.filter_class + ' img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy">
</div>
<p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p>
</slide>
</carousel>
</div>
</template>