<div class="modal fade" id="{{-- myModal --}}pop_up_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document" style="max-width:{{ $pop->popup_width ?? '500px' }};">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel"></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                @if ($pop->is_popup_img == 1)    
                <a href="{{$pop->url}}">
                    <div class="item">
                        <img src="@if (file_exists(public_path() . '/uploads/slider/'.$pop->image)){{ asset('uploads/slider/'.$pop->image) }}@else{{ asset('/icon/no-img-cat.png') }}@endif" alt="{{ $pop->image }}" />
                    </div>
                </a>
                @endif
                {!! $pop->pop_up_content !!}
            </div>
            <div class="modal-footer">
            </div>
        </div>
    </div>
</div>

@push('js')
<script>
    // pop up modal daily basis show and hide
    $(document).ready(function() {
        var popUpStatus = localStorage.getItem('pop_up_status');
        var lastVisitDate = localStorage.getItem('last_visit_date');
        var currentDate = new Date().toLocaleDateString();
        if (!popUpStatus) {
            $('#pop_up_modal').modal('show');
            localStorage.setItem('pop_up_status', '0');
        }
        if (popUpStatus !== '0') {
            $('#pop_up_modal').modal('show');
            localStorage.setItem('pop_up_status', '0');
        }
        if (lastVisitDate !== currentDate) {
            localStorage.setItem('pop_up_status', '0');
            localStorage.setItem('last_visit_date', currentDate);
        }else{
            $('#pop_up_modal').modal('hide');
        }
    });
</script>
@endpush