@extends('layouts.app')

@section('content')

<div class="container">
    <a href="{{route('locations.create')}}" class="btn btn-success mb-3 float-right">Add New</a>
    <div class="row justify-content-center">

        <div class="col-md-12">

            <div class="card">
                <div class="card-header">All Locations</div>

                <div class="card-body">
                    <div class="row">
                        @foreach($locations as $location)
                        <div class="col-3">

                            <div class="location-card shadow">
                                <img src="{{$location->image == '' ? 'http://placehold.it/300x225' :asset('images/projects/'.$location->image) }}" alt="" class="img-fluid mb-2 mx-auto" style="height:140px;">
                                <h5>{{$location->project_name}}</h5>
                                <p>Trees: {{$location->no_trees}} </p>

                                <a href="{{route('locations.edit',$location->id)}}" class="btn btn-sm btn-outline-secondary  float-left">Edit</a>
                                <form method="POST" class="delete-form" action="{{action('LocationController@destroy',$location->id)}}">
                                    {{csrf_field()}}
                                    <input type="hidden" name="_method" value="DELETE">
                                    <button type="submit" class="btn btn-sm btn-danger float-right" id="call-to-action">Delete</button>
                                </form>
                                <div class="clearfix"></div>
                            </div>

                        </div>
                        @endforeach
                    </div>



                </div>
            </div>
        </div>
    </div>
</div>
@endsection