<script setup>
const props = defineProps(['film']);
</script>
    
<template>
  <div class="film-poster">
    <img :src="film.poster" :alt="film.title" />
    <h3>{{ film.titleFR || film.primaryTitle }}</h3>
    <h4>{{ film.startYear }}</h4>
    <!-- Ajoutez d'autres détails du film ici -->
  </div>
</template>


<style scoped>
/* Styles pour la disposition des affiches */
.film-poster {
  width: 20%;
  /* Pour afficher 4 affiches par rangée */
  margin: 10px;
  display: inline-block;
  text-align: center;
}
</style>