mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-12-13 13:50:27 +05:30
parent
107102ff2e
commit
31f3c2eb58
11
src/App.vue
11
src/App.vue
@ -209,4 +209,15 @@ h2 {
|
||||
.dark .line {
|
||||
@apply bg-white;
|
||||
}
|
||||
|
||||
.thumbnail-overlay {
|
||||
@apply rounded-md absolute bg-black text-white bg-opacity-75 px-5px;
|
||||
}
|
||||
|
||||
.thumbnail-right {
|
||||
@apply bottom-5px right-5px;
|
||||
}
|
||||
.thumbnail-left {
|
||||
@apply bottom-5px left-5px text-xs font-bold bg-red-600 uppercase;
|
||||
}
|
||||
</style>
|
||||
|
@ -9,6 +9,12 @@
|
||||
<div v-for="playlist in playlists" :key="playlist.id">
|
||||
<router-link :to="`/playlist?list=${playlist.id}`">
|
||||
<img class="w-full" :src="playlist.thumbnail" alt="thumbnail" />
|
||||
<div class="relative text-sm">
|
||||
<span
|
||||
class="thumbnail-overlay thumbnail-right"
|
||||
v-text="`${playlist.videos} ${$t('video.videos')}`"
|
||||
/>
|
||||
</div>
|
||||
<p
|
||||
style="display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical"
|
||||
class="my-2 overflow-hidden flex link"
|
||||
|
@ -114,17 +114,6 @@
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.thumbnail-overlay {
|
||||
@apply rounded-md absolute bg-black text-white bg-opacity-75 px-5px;
|
||||
}
|
||||
|
||||
.thumbnail-right {
|
||||
@apply bottom-5px right-5px;
|
||||
}
|
||||
.thumbnail-left {
|
||||
@apply bottom-5px left-5px text-xs font-bold bg-red-600 uppercase;
|
||||
}
|
||||
|
||||
.shorts-img {
|
||||
@apply max-h-[17.5vh] w-full object-contain;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user