@section('content')
{{-- <x-other.titleHeader judul="{{$title}}" /> --}}
<!--begin::Subheader-->
<div class="subheader py-2 py-lg-4 subheader-transparent" id="kt_subheader">
    <div class="container-fluid d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
        <!--begin::Details-->
        <div class="d-flex align-items-center flex-wrap mr-2">
            <!--begin::Title-->
            <h5 class="text-dark font-weight-bold mt-2 mb-2 mr-5">Daftar Team</h5>
            <!--end::Title-->
            <!--begin::Separator-->
            <div class="subheader-separator subheader-separator-ver mt-2 mb-2 mr-5 bg-gray-200"></div>
            <!--end::Separator-->
            <!--begin::Search Form-->
            <div class="d-flex align-items-center" id="kt_subheader_search">                
                {{-- <form class="ml-5"> --}}
                    <div class="input-group input-group-sm input-group-solid" style="max-width: 175px">
                        <input type="text" class="form-control" id="keyword" placeholder="Search..." />
                        <div class="input-group-append">
                            <span class="input-group-text">
                                <span class="svg-icon">
                                    <!--begin::Svg Icon | path:assets/media/svg/icons/General/Search.svg-->
                                    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                        <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                            <rect x="0" y="0" width="24" height="24" />
                                            <path d="M14.2928932,16.7071068 C13.9023689,16.3165825 13.9023689,15.6834175 14.2928932,15.2928932 C14.6834175,14.9023689 15.3165825,14.9023689 15.7071068,15.2928932 L19.7071068,19.2928932 C20.0976311,19.6834175 20.0976311,20.3165825 19.7071068,20.7071068 C19.3165825,21.0976311 18.6834175,21.0976311 18.2928932,20.7071068 L14.2928932,16.7071068 Z" fill="#000000" fill-rule="nonzero" opacity="0.3" />
                                            <path d="M11,16 C13.7614237,16 16,13.7614237 16,11 C16,8.23857625 13.7614237,6 11,6 C8.23857625,6 6,8.23857625 6,11 C6,13.7614237 8.23857625,16 11,16 Z M11,18 C7.13400675,18 4,14.8659932 4,11 C4,7.13400675 7.13400675,4 11,4 C14.8659932,4 18,7.13400675 18,11 C18,14.8659932 14.8659932,18 11,18 Z" fill="#000000" fill-rule="nonzero" />
                                        </g>
                                    </svg>
                                    <!--end::Svg Icon-->
                                </span>
                                <!--<i class="flaticon2-search-1 icon-sm"></i>-->
                            </span>
                        </div>
                    </div>
                {{-- </form> --}}
            </div>
            <!--end::Search Form-->            
        </div>
        <!--end::Details-->        
    </div>
</div>
<!--end::Subheader-->
<div id="team_view">
    {{-- <div class="row">
        <div class="col-md-4">
            <div class="card card-custom">
                <!--begin::Body-->
                <div class="card-header bg-success">
                    <div class="d-flex align-items-center mb-7 mt-7">
                        <!--begin::Pic-->
                        <div class="flex-shrink-0 mr-4">
                            <div class="symbol symbol-lg-75">
                                <img src="/gallery/Logo_20210827_103202_maxresdefault.jpg" class="img-fluid" alt="image">
                            </div>
                        </div>
                        <!--end::Pic-->
                        <!--begin::Title-->
                        <div class="d-flex flex-column">
                            <a href="#" class="text-dark font-weight-bold text-hover-primary font-size-h4 mb-0">Project Musik Nayeon</a>                            
                            <span class="text-white font-weight-bold">Divisi Teknologi Informasi</span>
                            <span class="text-white font-weight-bold">Team Code: TM0001</span>
                        </div>
                        <!--end::Title-->
                    </div>
                </div>
                <div class="card-body">   
                    <h3>Members</h3>                 
                    <!--begin:Users-->
                    <div class="mt-7 scroll scroll-pull" data-scroll="true" data-wheel-propagation="true" data-mobile-height="350" style="height: 340px; overflow: hidden;">
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_12.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Matt Pears</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Head of Development</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">35 mins</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_11.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Charlie Stone</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Art Director</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">7 hrs</span>
                                <span class="label label-sm label-success">4</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_10.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Teresa Fox</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Web Designer</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">3 hrs</span>
                                <span class="label label-sm label-danger">5</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_13.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Giannis Nelson</a>
                                    <span class="text-muted font-weight-bold font-size-sm">IT Consultant</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">2 days</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_15.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Carles Puyol</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Operator</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">5 mins</span>
                                <span class="label label-sm label-success">9</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_16.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Ana Torn</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Head Of Finance</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">2 days</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_18.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Lisa Pears</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Web Designer</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">6 mins</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_20.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Amanda Bold</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Art Director</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">3 hrs</span>
                                <span class="label label-sm label-warning">7</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_21.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Nick Jhonson</a>
                                    <span class="text-muted font-weight-bold font-size-sm">IT Consultant</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">10 mins</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_19.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Sarah Larson</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Web Designer</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">4 hrs</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_22.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Matt Pears</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Head of Development</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">35 mins</span>
                                <span class="label label-sm label-success">5</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_23.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Tim Stone</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Web Developer</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">5 hrs</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_17.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Jhon Richardson</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Head of Development</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">1 week</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_18.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Ana Kiskia</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Web Master</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">35 mins</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_14.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Nick Stone</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Art Director</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">3 hrs</span>
                            </div>
                        </div>
                        <!--end:User-->
                        <!--begin:User-->
                        <div class="d-flex align-items-center justify-content-between mb-5">
                            <div class="d-flex align-items-center">
                                <div class="symbol symbol-circle symbol-50 mr-3">
                                    <img alt="Pic" src="assets/media/users/300_13.jpg">
                                </div>
                                <div class="d-flex flex-column">
                                    <a href="#" class="text-dark-75 text-hover-primary font-weight-bold font-size-lg">Nick Nilson</a>
                                    <span class="text-muted font-weight-bold font-size-sm">Software Arcitect</span>
                                </div>
                            </div>
                            <div class="d-flex flex-column align-items-end">
                                <span class="text-muted font-weight-bold font-size-sm">3 days</span>
                            </div>
                        </div>
                        <!--end:User-->
                    <div class="ps__rail-x" style="left: 0px; bottom: 0px;"><div class="ps__thumb-x" tabindex="0" style="left: 0px; width: 0px;"></div></div><div class="ps__rail-y" style="top: 0px; height: 340px; right: -2px;"><div class="ps__thumb-y" tabindex="0" style="top: 0px; height: 109px;"></div></div></div>
                    <!--end:Users-->
                </div>
                <!--end::Body-->
            </div>    
        </div>
    </div> --}}
</div>
<div class="d-flex justify-content-between align-items-center flex-wrap mt-4">
    <div class="d-flex flex-wrap mr-3">
        <div class="pagination-wrapper"></div>
    </div>
</div>
@endsection
@section('script')        
@include('content.others.team.action')
@endsection