<script>
    export let movie;

    const {
        title,
        imageUrl: src,
        awardWinCount,
        awardNominationCount,
        releaseDate: released,
    } = movie;
</script>

<style>
    /* Style code removed for brevity. Check out the full repo if
       you want to get at the CSS. */
</style>

<div class="box">
    <div class="columns is-mobile">
        <div class="column is-one-quarter img-container">
            <img {src} alt="Poster for {title}">
        </div>

        <div class="column">
            <h3 class="is-size-5 is-uppercase movie-title">{title}</h3>

            <p class="release-date">Released {released}</p>

            <p class="awards">Won {awardWinCount} awards</p>

            <p class="nominations">Nominated for {awardNominationCount} awards</p>
        </div>
    </div>
</div>