@extends ('../welcome')


@section('content')
    <!-- Filters -->
    <style>
        .description-block {
            background-color: #161616d4;
            position: absolute;
            bottom: 1px;
            left: 55px;
            padding: 14px 0px;
            width: 75%;
        }

        .cards tbody tr {
            float: left;
            width: 19rem;
            margin: 0.5rem;
            border: 0.0625rem solid rgba(0, 0, 0, .125);
            border-radius: .25rem;
            box-shadow: 0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.25);
        }

        .cards tbody td {
            display: block;
        }

        .cards thead {
            display: none;
        }

        .cards td:before {
            content: attr(data-label);
            position: relative;
            float: left;
            color: #808080;
            min-width: 4rem;
            margin-left: 0;
            margin-right: 1rem;
            text-align: left;
        }

        tr.selected td:before {
            color: #CCC;
        }

        .table .avatar {
            width: 50px;
        }

        .cards .avatar {
            width: 150px;
            height: 150px;
            margin: 15px;
        }

        div.dataTables_wrapper div.dataTables_length select {
            width: 40%;
        }
    </style>

    <div class="card">
        <div class="card-header">
            @if (auth()->user()->type == 'admin' ||
                    auth()->user()->role->hasPermission('projects-create'))
                <a href="{{ route('projects.create') }}" style="float:right">
                    <button class="btn btn-square btn-light active" title="create Project" type="button"><i
                            class="fas fa-plus"></i></button>
                </a>
            @endif

            @if (auth()->user()->type == 'admin' ||
                    auth()->user()->role->hasPermission('projects-archive'))
                <a href="{{ route('projects.archive') }}" style="float:right">
                    <button class="btn btn-outline-success" title="Archive" type="button"><i
                            class="fas fa-archive"></i></button>
                </a>
            @endif
            <p>Total: {{ count($projects) }}</p>

        </div>
        <div class="card-body">
            <table id="ProjectsAll" class="table table-sm table-hover" cellspacing="0" width="100%">
                <thead>
                <tr>
                    <th></th>
                    <th>ID</th>
                    <th>Name</th>
                    <th>description</th>
                    <th>is_active</th>
                    <th>is_residential</th>
                </tr>
            </thead>
        </table>
        </div>
    </div>
@endsection