@extends('layouts.app')
@section('style')
<link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.min.css"  rel="stylesheet">
<style>

            body{
                font-weight: 100;
                font-family: 'Raleway', sans-serif;
                background: url('/images/background0.png');
                background-position: center;
                background-size: cover;
                background-repeat: 0;
                color:black;
            }
    .fc table{
        background-color: rgba(200,200,200,0.1);
    }
    .fc-button{
        color: #000;
        background-color: #cea15d;
        border-color: #cea15d /*set the color you want here*/;
    }
</style>
@endsection
@section('content')
<div class="row">
    @if(Auth::user()->hasRole('Discipline Leader')|| (Auth::user()->discipline->name == 'Administrator'))
    <div class ="container col-md-2 offset-1" style="padding-top:20px;text-align: center;">
        <H4 style="font-weight: bold;">Hubs</H4>
        <a href="" class="btn btn-primary btn-lg btn-block" style="">
           Touwsberg 
        </a>
        <div style="">
           
        </div>
    </div>
    @endif
    <div class="container 
     @if(Auth::user()->hasRole('Discipline Leader')|| (Auth::user()->discipline->name == 'Administrator'))
        col-md-9
    @endif
    ">
        <div class="card-body" style="background:rgba(255, 255, 255, 0.2);">
        <div class="container col-md-12" style="margin-bottom:20px;">
            <h4>Touwsberg</h4>
            <a href="/Procurement" class="btn btn-primary btn-sm">Pending</a>&nbsp;
            <a href="/Procurement/declined" class="btn btn-primary btn-sm">Declined</a>&nbsp;
            <a href="/Procurement/ordered" class="btn btn-primary btn-sm">Ordered</a>&nbsp;
            <a href="/Procurement/received" class="btn btn-primary btn-sm">Received</a>&nbsp;
            <a href="/Procurement/new" class="btn btn-primary btn-sm">New Order</a>
        </div>
            <h4>Pending Orders</h4>
               <table class="table-striped" width="100%">
                <tr>
                    <th>Creation Date</th>
                    <th>Item Name</th>
                    <th>Quantity</th>
                    <th>Order Type</th>
                    <th>Created By</th>
                    <th>Status</th>
                </tr>
                <tr>
                    <td>01-11-2018 14:23:21</td>
                    <td>Clean Green</td>
                    <td>1</td>
                    <td>Out of Budget</td>
                    <td>pa_donations</td>
                    <td>Awaiting approval</td>
        </div>
    </div>
</div>
        
@endsection

@section('script')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.min.js"></script>
@endsection