@extends('layout.app')
@section('css')
    <style type="text/css">

        .card {
            margin: 10px;
            background-color: #fff;
            border-radius: 10px;
            box-shadow: 0 2px 20px rgb(0 0 0 / 20%);
            overflow: hidden;
            width: 248px!important;
            border: none!important;
            height: 30rem!important;
        }

        a:hover {
            color: #f35626 !important;
        }

        /*Profile Card 5*/
        .profile-card-5{
            margin-top:20px !important;
            /* background-color: #2671ac73 !important; */
        }
        .profile-card-5 .btn{
            border-radius:2px !important;
            text-transform:uppercase !important;
            font-size:12px !important;
            padding:7px 20px !important;
        }
        .profile-card-5 .card-img-block {
            /* width: 91% !important; */
            margin: 0 auto !important;
            position: relative !important;
            top: 12px !important;

        }
        .profile-card-5 .card-img-block img{
            border-radius:5px !important;
            box-shadow:0 0 10px rgba(0,0,0,0.63) !important;
        }
        .profile-card-5 h5{
            color:#4E5E30 !important;
            font-weight:600 !important;
        }
        .profile-card-5 p{
            font-size:14px !important;
            font-weight:300 !important;
        }
        .profile-card-5 .btn-primary{
            background-color:#4E5E30 !important;
            border-color:#4E5E30 !important;
        }
    </style>
@endsection
@section('content')

    <div class="slider-area2 section-bg2" data-background="{{asset('new_img/twitter-img/DGs_Visit_RMRCNE.jpg')}}">
        <div class="slider-height2 d-flex align-items-center">
            <div class="container">
                <div class="row">
                    <div class="col-xl-12">
                        <div class="hero-cap hero-cap2">
                            <h2>{{$name}}</h2>
                            <h4>
                                <a href="{{route('index')}}">Home</a> <span>/</span>
                                @if($first!=null)
                                     <a href="#">{{$first}}</a><span>/</span>
                                @endif
                                @if($second!=null)
                                    </span> <a href="#">{{$second}}</a><span>/</span>
                                @endif
                                    <a href="#">{{$name}}</a>
                            </h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @if($menu_id->id == 2)
        @include('content.staff')
    @else
        {{-- @if ($content != null) --}}
            <section class="home-blog-area section-padding40">
                <div class="container">
                    @if($menu_id->page_layout == 2)
                        <div class="section-tittle mb-100">
                            <span class="element_1">{{$menu_id->name}}</span>
                         </div>
                        <div class="row justify-content-between">
                            <div class="col-xl-8 col-lg-8 col-md-8">
                                @if ($content != null)
                                    <div class="about-caption subpage-content mb-50">
                                        <div class="section-tittle">
                                            <h4>{{$name}}</h4>
                                        </div>
                                        <p style="text-align:justify">{!!$content->content!!}</p>
                                    </div>
                                @else
                                    <h2 style="text-align: center;margin: 6rem; color:red;">PAGE UNDER CONSTRUCTION</h2>
                                @endif
                            </div>
                            <div class="col-xl-4 col-lg-8 col-md-4">
                                @php
                                    if($submenu != null){
                                        $sublinks = App\Models\SubMenu::where('menu_id',$menu_id->id)->where('id','!=',$submenu->id)->get();
                                    } else {
                                        $sublinks = [];
                                    }
                                        
                                @endphp
                                <div class="sidebar pl">
                                    <ul>
                                        <h5><span style="color: #f4582d;">Other</span> Links</h5>
                                        @forelse($sublinks as $d)
                                            <li><a href="{{route('menu.submenu.content',[$menu_id->slug,$d->slug])}}">{{$d->name}}</a></li>
                                            <hr>
                                        @empty
                                            <li><a href="#">No Research Areas Updated</a></li>
                                        <hr>
                                        @endforelse

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @else
                        <div class="row">
                            @if ($content != null)
                                {!! $content->content!!}
                            @else
                                 <h2 style="text-align: center;margin: 6rem; color:red;">PAGE UNDER CONSTRUCTION</h2>
                            @endif
                        </div>
                    @endif
                </div>
            </section>

    @endif


@endsection

@section('js')
    <script type="text/javascript">
        $(document).ready( function(){
            new DataTable('#table');
        });
    </script>
@endsection