<template>
  <div
      :key="game.id"
      :class="[
          'transition-transform transform cursor-pointer rounded-lg overflow-hidden border-4',
          selected ? 'scale-110 border-blue-500' : 'scale-100 border-transparent'
        ]"
  >
    <LocalImage
        :src="game.thumbnail_path"
        class="h-32 w-48 object-cover"
        :alt="game.title"
        :gameId="game.id"
    />
  </div>
</template>

<style scoped>

</style>

<script setup lang="ts">
import { models } from "../../wailsjs/go/models";
import Game = models.Game;
import LocalImage from "./LocalImage.vue";

defineProps<{
  game: Game
  selected: boolean
}>()
</script>