mirrors/Hyperpipe
1
0
Fork 0
mirror of https://codeberg.org/Hyperpipe/Hyperpipe synced 2025-06-28 13:08:01 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added Sync for Playlists

Browse source
This commit is contained in:
Shiny Nematoda 2022-06-05 20:35:58 +05:30
parent a88c9081f1
commit e867ab25e9
11 changed files with 287 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/Playlists.vue
View file

@ -1,5 +1,4 @@
<script setup>
defineProps({
url: String,
urls: Array,
@ -7,7 +6,6 @@ defineProps({
});
defineEmits(['playthis']);
</script>
<template>
@ -21,7 +19,10 @@ defineEmits(['playthis']);
<div class="bars"></div>
</span>
<div v-else-if="plurl.thumbnails" class="pl-img">
<img :src="plurl.thumbnails[0].url" :height=" plurl.thumbnails[0].height" :width="plurl.thumbnails[0].width">
<img
:src="plurl.thumbnails[0].url"
:height="plurl.thumbnails[0].height"
:width="plurl.thumbnails[0].width" />
</div>
<span class="pl-main caps">{{ plurl.title }}</span>
</div>
@ -66,22 +67,22 @@ defineEmits(['playthis']);
padding-left: 2.75rem;
}
.pl-img {
top: .45rem;
left: .45rem;
top: 0.45rem;
left: 0.45rem;
position: absolute;
background-image: var(--src);
height: 2.75rem;
width: 2.75rem;
border-radius: .125rem;
border-radius: 0.125rem;
background-size: contain;
background-repeat: no-repeat;
}
.pl-img img {
height: 100%;
width: 100%;
border-radius: .125rem;
border-radius: 0.125rem;
}
.pl-img[data-active=false] {
.pl-img[data-active='false'] {
display: none;
}
</style>