@extends('frontend.layouts.index')
@section('content')
    <div class="container mt3">
        <div class="row">
            <div class="bgw o-fix border" style="display: flex;">
                <div class="col-md-12">
                    <h2 class="title">{{ $committe->name }}</h2>
                    <section class="col-xs-12 col-sm-12 col-md-9">
                        <div>
                            <div class="members-cont">
                                @forelse($members as $member)
                                    <div class="members bgw border">
                                        <div>
                                            <div class="col-xs-4 p0 ">
                                                <div class="fit-image">
                                                    <img src="{{ asset('/uploads/members') }}/{{ $member->photo }}" />
                                                </div>
                                            </div>
                                            <div class="member-description col-xs-8 p1 mt1 mb1">
                                                <div class="blue">
                                                    <h4>
                                                        <a href="#">
                                                            {{ $member->name }}
                                                        </a>
                                                    </h4>
                                                </div>
                                                <div>
                                                    <strong>{{ $member->fullname }}</strong>
                                                </div>
                                                <div class="gray">{{ $member->subcat->name }}</div>
                                                <div class="gray">{!! $member->bio !!}</div>
                                                <div class="gray">{{ $member->email }}</div>
                                                <div class="gray">{{ $member->phone_number }}</div>
                                                <div class="gray">{{ $member->address }}</div>
                                                <div class="f3">
                                                    @if (!empty($member->linkedin))
                                                        <a href="{{ $member->linkedin }}" class="fa fa-linkedin-square"></a>
                                                    @endif
                                                    @if (!empty($member->facebook))
                                                        <a href="{{ $member->facebook }}"
                                                            class="fa fa-facebook-square"></a>
                                                    @endif
                                                    @if (!empty($member->gplus))
                                                        <a href="{{ $member->gplus }}"
                                                            class="fa fa-google-plus-square"></a>
                                                    @endif
                                                    @if (!empty($member->twitter))
                                                        <a href="{{ $member->twitter }}" class="fa fa-twitter-square"></a>
                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                @empty
                                    <div>
                                        <p>{{ 'Not published yet !!!' }}
                                        </p>
                                    </div>
                                @endforelse
                            </div>
                            <h2 class="title">{{ $committe->name . ' ' . 'Document' }}</h2>
                            <div style="text-align: center">
                                @if ($doc->file != null)
                                    @foreach ($doc->file as $file)
                                        @php
                                            $docName = explode('.', $file->filename);
                                            //dd($docName);
                                        @endphp


                                        @php
                                            // $path_info = pathinfo($docName[$i]);
                                            // dd($path_info);
                                            $extension = ['jpg', 'JPG', 'jpeg', 'JPEG', 'png', 'PNG'];
                                        @endphp
                                        @if (in_array($docName[1], $extension))
                                            <img src="{{ asset('/uploads/doc/' . $file->filename) }}"
                                                class="img-placeholder-bg" />
                                        @else
                                            <a href="{{ asset('/uploads/doc/' . $file->filename) }}" target="_blank"
                                                class="btn-download" style="margin: 20px">
                                                <i class="fa fa-eye" aria-hidden="true"></i>View
                                            </a><br />
                                            <a download="{{ $file->filename }}"
                                                href="{{ asset('/uploads/doc/' . $file->filename) }}" target="_blank"
                                                class="btn-download" style="margin: 20px" title="{{ $file->filename }}">
                                                <i class="fa fa-download" aria-hidden="true"></i>Click Here to Download
                                            </a><br />
                                        @endif
                                    @endforeach
                                @endif
                            </div>
                        </div>
                    </section>


                    @include('frontend.includes.aside')
                </div>
            </div>
        </div>
    </div>
@endsection