@extends('layouts.empty')

@section('css')
    <style>
        @media (min-width: 767px) {
            .empty-wrapper {
                max-height: 450px;
            }
        }

        .close-modal {
            position: fixed;
            right: 15px;
            top: 15px;
        }

        .reviews {
            padding-top: 15px;
            padding-bottom: 10px;
        }

        .rating-header {
            padding-bottom: 25px;
        }

        .rating-title {
            font-size: 1.3rem;
        }

        .rating-stars {
            /* padding:7px 0; */
        }

        hr {
            margin-top: 0;
        }
        .fa-star {
            color: #ffc700;
        }

        .review-main {
            border-bottom: 1px solid #eee;
        }
    </style>
@endsection

@section('content')
    <a href="#" class="close-modal"><i class="fa fa-times"></i></a>
    <div class="reviews">
            <div class="rating-header" style="display: flex; justify-content: space-between;">
                <h3 class="rating-title">{{ $place_name }}</h3>                
            </div>
            {{-- <hr /> --}}
            @if(count($reviews))
                @foreach ($reviews as $review)
                    <div class="review-main">
                        <div class="review-header">
                            @if ($review['avatar'])
                                <div class="profile-dp">
                                    <img src="{{$review['avatar']}}" alt="Reviewer">
                                </div>
                            @endif
                            <div class="profile-info">
                                <h5 class="profile-name">{{ $review['nickname']}}</h5>
                                
                                
                                <p>{{ $review['food_name'] ?? ''}}</p>
                            </div>
                        </div>
                        <div class="review-text">
                            <div class="rating-stars">
                                @for ($i = 0; $i < intval($review['rate']); $i++)
                                    <i class="fa fa-star"></i>
                                @endfor
                            </div>
                            {{$review['comment'] ?? ""}}
                        </div>
                        @if (isset($review['image']) && $review['image'])
                            <div class="review-image" style="background-image: url('{{ $review['image'] }}')"></div>
                        @endif
                        {{-- <div class="review-footer">
                            <div class="left-side">
                                <a href="#"></a> <a href="#"></a>
                            </div>
                            <div class="right-side">
                            </div>
                        </div> --}}
                    </div>
                @endforeach
            @else
                <p>No reviews yet. Be the first to <a href="{{ route('preNewReview', ['place' => $place_slug]) }}" style="color: var(--red); font-size: 16px; text-decoration: underline;">write one</a></p>
            @endif
        </div>
@endsection