<template>
  <slot />
  <Bucket @card-dropped="onCardDropped" />
  <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: 0;
}

.platine {
  z-index: 60;
  bottom: -70%;
}
</style>
