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

Playlists, Play Next, Code Refactor

Browse source
This commit is contained in:
Shiny Nematoda 2022-04-21 18:38:21 +05:30
parent 5486be7613
commit 51c56abe16
17 changed files with 664 additions and 204 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/components/Playlists.vue
View file

@ -8,22 +8,24 @@ defineEmits(['playthis']);
</script>
<template>
<div v-if="show" class="modal placeholder">
<template v-for="plurl in urls">
<div class="pl-item" @click="$emit('playthis', plurl)">
<span v-if="url == plurl.url" class="bars-wrap">
<div class="bars"></div>
<div class="bars"></div>
<div class="bars"></div>
</span>
<span class="pl-main caps">{{ plurl.title }}</span>
</div>
</template>
</div>
<Transition name="fade">
<div v-if="show" class="pl-modal placeholder">
<template v-for="plurl in urls">
<div class="pl-item" @click="$emit('playthis', plurl)">
<span v-if="url == plurl.url" class="bars-wrap">
<div class="bars"></div>
<div class="bars"></div>
<div class="bars"></div>
</span>
<span class="pl-main caps">{{ plurl.title }}</span>
</div>
</template>
</div>
</Transition>
</template>
<style scoped>
.modal {
.pl-modal {
display: flex;
flex-direction: column;
position: fixed;
@ -37,8 +39,6 @@ defineEmits(['playthis']);
z-index: 99999;
box-shadow: 0.1rem 0.1rem 1rem var(--color-shadow);
padding: 1rem;
transition: width 0.4s ease;
animation: fade 0.4s ease;
overflow-y: auto;
}
.placeholder:empty:before {