KevinMidboe/seasoned
1
0
Fork 0
Code Issues 12 Pull Requests 1 Packages Projects Releases 1 Wiki Activity

Poster image dom simplified.

Browse Source
This commit is contained in:
Kevin
2020-02-19 23:52:03 +01:00
parent 50acf0bedc
commit ae59d02df2
1 changed files with 11 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/MoviesListItem.vue
View File

@@ -1,21 +1,17 @@
<template> <template>
<li class="movies-item" :class="{'shortList': shortList}"> <li class="movie-item" :class="{'shortList': shortList}">
<a class="movies-item__link" :class="{'no-image': noImage}" @click.prevent="openMoviePopup(movie.id, movie.type)"> <figure class="movie-item__poster">
<img class="movie-item__img is-loaded"
<!-- TODO change to picture element --> ref="poster-image"
<figure class="movies-item__poster"> @click="openMoviePopup(movie.id, movie.type)"
<img v-if="!noImage" class="movies-item__img" src="~assets/placeholder.png" v-img="poster()" alt=""> :alt="posterAltText"
<img v-if="noImage" class="movies-item__img is-loaded" src="~assets/no-image.png" alt=""> :data-src="poster"
src="~assets/placeholder.png">
<div v-if="movie.download" class="progress"> <div v-if="movie.download" class="progress">
<progress :value="movie.download.progress" max="100"></progress> <progress :value="movie.download.progress" max="100"></progress>
<span>{{ movie.download.state }}: {{ movie.download.progress }}%</span> <span>{{ movie.download.state }}: {{ movie.download.progress }}%</span>
</div> </div>
</figure>
<div class="movies-item__content">
<p class="movies-item__title">{{ movie.title || movie.name }}</p>
<p class="movies-item__title">{{ movie.year }}</p>
</div>
</a> </a>
</li> </li>
</template> </template>