<script setup lang="ts">
import type {ICard} from "@/types/card.type";
import Card from "@/components/maumau/game/Card.vue";

const props = defineProps<{
  currentCard?: ICard,
}>();

const emits = defineEmits<{
  (event: 'click'): void
}>();

const onNewCardClick = () => {
  emits('click');
}
</script>

<template>
<div class="deck">
  <Card :card="currentCard" :clickable="false" />
  <Card class="deck-new-cards" @click="onNewCardClick" clickable hoverable />
</div>
</template>

<style scoped lang="scss">
.deck {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;

  &-new-cards {
    background-image: url("@/assets/cards/back.png");
    background-size: 100px 150px;
  }
}
</style>