@extends('layouts.app')


@section('content')
<div class="card">
    <div class="card-body">
        <a href="{{ URL::to('shelf/add') }}" class="btn btn-primary btn-sm float-right mt-3">
            Manage
        </a>
        <a href="{{ URL::to('shelf/upload') }}" class="btn btn-primary btn-sm float-right mt-3 mr-2">
            Upload Sheet
        </a>
        <h5 class="mt-4">Shelves</h5>
        <hr>
        <ul class="row dashboard-top list-unstyled">
            @foreach($shelves as $shelf)
                <li class="col-12 col-md-4">
                    <div class="card">
                        <div class="card-body text-center">
                            <h4>{{ $shelf->name }}</h4>
                            <div class="row mt-2">
                                @for($i = 1; $i <= $shelf->no_of_shelves; $i++)
                                    <div class="col-12 col-md-4 mt-4">
                                        <a href="{{ URL::to('shelf/'.$shelf->id.'/'.$i) }}">
                                            <img src="{{ asset('img/shelves.png') }}" alt="img" width="30" height="30">
                                            <div class="mr-1">{{ $i }}</div>
                                        </a>
                                    </div>
                                @endfor
                            </div>
                        </div>
                    </div>
                </li>
            @endforeach
            <!-- <li class="col-12 col-md-4">
                <div class="card">
                    <div class="card-body text-center">
                        <h6>Boxed</h6>
                        <h4>0</h4>
                    </div>
                </div>
            </li>
            <li class="col-12 col-md-4">
                <div class="card">
                    <div class="card-body text-center">
                        <h6>Booked</h6>
                        <h4>0</h4>
                    </div>
                </div>
            </li> -->
        </ul>
    </div>
</div>
@endsection