47 lines
642 B
Vue
47 lines
642 B
Vue
<template>
|
|
<slot />
|
|
<Bucket />
|
|
<Platine />
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { Track } from '~~/types/types'
|
|
|
|
const onCardDropped = (card: Track) => {
|
|
console.log('Carte déposée dans le bucket:', card)
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.bucket,
|
|
.platine {
|
|
position: fixed;
|
|
bottom: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.bucket {
|
|
z-index: 70;
|
|
bottom: -260px;
|
|
transition: bottom 0.3s ease;
|
|
width: 100%;
|
|
overflow-x: scroll;
|
|
|
|
&:hover,
|
|
.card-dragging & {
|
|
bottom: 0;
|
|
}
|
|
|
|
.bucket-card-wrapper {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.platine {
|
|
z-index: 60;
|
|
bottom: -70%;
|
|
transition: bottom 0.3s ease;
|
|
/* width: 25%; */
|
|
}
|
|
</style>
|