@extends('main.layout')

@push('head')
    <link rel="stylesheet" href="{{asset('css/movies.css')}}">
@endpush

@section('content')

    <section>
        <h1>Now playing:</h1>
        <hr/>
        <div id="movies">
            @foreach($movies as $movie)
                <a class="movie" href="{{route('movie', ['id' => $movie->movie_id])}}">
                    <x-cache-image src="{{$movie->movie_image}}" alt="{{$movie->movie_name}} Poster" class="poster" width="200px"/>
                    <div class="details">
                        <h2>{{ $movie->movie_name }}</h2>
                        <span>{{ $movie->movie_description }}</span>
                        <p>{{ $movie->movie_length }} minutes</p>
                    </div>
                </a>
            @endforeach
    </section>

@endsection