@extends('site.layouts.master')
@section('title', 'دبیران')
@section('content')


    <section class="page-header -type-3 pt-0">
        {{--        <div class="page-header__bg bg-purple-1"></div> --}}
        <div class="row justify-center" style="padding: 0 20px;display: flex;align-items: center;">
            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                <div class="page-header__content">
                    <div class="page-header__img">
                        <img src="{{ $teacher->image }}" alt="image">
                    </div>




                </div>
            </div>
            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                <div class="tabs -active-purple-2 js-tabs">
                    <div class="tabs__controls d-flex js-tabs-controls">
                        <button class="tabs__button js-tabs-button is-active" data-tab-target=".-tab-item-1" type="button">
                            توضیحات
                        </button>
                        {{-- <button class="tabs__button js-tabs-button mr-30" data-tab-target=".-tab-item-2" type="button">
                    دوره ها
                  </button> --}}
                    </div>

                    <div class="tabs__content pt-20 lg:pt-40 js-tabs-content over-teach">
                        <div class="tabs__pane -tab-item-1 is-active info-teacher">
                            <div class="page-header__info pt-10">
                                <h1 class="text-30 lh-14 fw-700">{{ $teacher->name }}</h1>
                                <div class="">{{ $teacher->uni }}</div>
                                <div class="d-flex x-gap-20 pt-15">

                                    {{--                        <div class="d-flex items-center top-teach"> --}}
                                    {{--                          <div class="icon-star ml-10"></div> --}}
                                    {{--                          <div class="text-13 lh-1">امتیاز</div> --}}
                                    {{--                        </div> --}}

                                    {{--                        <div class="d-flex items-center top-teach"> --}}
                                    {{--                          <div class="icon-video-file ml-10"></div> --}}
                                    {{--                          <div class="text-13 lh-1">23,987 دیدگاه</div> --}}
                                    {{--                        </div> --}}

                                    {{--                        <div class="d-flex items-center top-teach"> --}}
                                    {{--                          <div class="icon-person-3 ml-10"></div> --}}
                                    {{--                          <div class="text-13 lh-1">692 دانشجو</div> --}}
                                    {{--                        </div> --}}

                                    @foreach ($teacher->courses as $item)
                                        <a href="{{ route('course', $item->slug) }}">
                                            <div class="d-flex items-center top-teach">
                                                <div class="icon-play ml-10"></div>
                                                <div class="text-13 lh-1">{{ $item->name }}</div>
                                            </div>
                                        </a>
                                    @endforeach

                                </div>
                            </div>
                            <p class="text-light-1 mt-30">
                                {!! $teacher->description !!}
                            </p>
                            {{-- <button class="button underline text-purple-1 mt-30">مشاهده بیشتر</button> --}}
                        </div>

                        {{-- <div class="tabs__pane -tab-item-2">
                    <div class="row">

                      <div data-anim="slide-up delay-1" class="col-md-6">

                        <a href="" class="coursesCard -type-1 rounded-8 shadow-3 bg-white">
                          <div class="relative">
                            <div class="coursesCard__image overflow-hidden rounded-top-8">
                              <img class="w-1/1" src="img/coursesCards/1.png" alt="image">
                              <div class="coursesCard__image_overlay rounded-top-8"></div>
                            </div>
                            <div class="d-flex justify-between py-10 px-10 absolute-full-center z-3">

                            </div>
                          </div>

                          <div class="h-100 pt-20 pb-15 px-30">
                            <div class="d-flex items-center">
                              <div class="text-14 lh-1 text-yellow-1 ml-10">4.5</div>
                              <div class="d-flex x-gap-5 items-center">
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                              </div>
                              <div class="text-13 lh-1 mr-10">(1991)</div>
                            </div>

                            <div class="text-17 lh-15 fw-500 text-dark-1 mt-10">آموزش NodeJs</div>

                            <div class="d-flex x-gap-10 items-center pt-10">

                              <div class="d-flex items-center">
                                <div class="ml-8">
                                  <img src="img/coursesCards/icons/1.svg" alt="icon">
                                </div>
                                <div class="text-14 lh-1">6 دوره</div>
                              </div>

                              <div class="d-flex items-center">
                                <div class="ml-8">
                                  <img src="img/coursesCards/icons/2.svg" alt="icon">
                                </div>
                                <div class="text-14 lh-1">8ساعت 20دقیقه</div>
                              </div>

                              <div class="d-flex items-center">
                                <div class="ml-8">
                                  <img src="img/coursesCards/icons/3.svg" alt="icon">
                                </div>
                                <div class="text-14 lh-1">مقدماتی</div>
                              </div>

                            </div>

                            <div class="coursesCard-footer">
                              <div class="coursesCard-footer__author">
                                <img src="img/general/avatar-1.png" alt="image">
                                <div>علی صالحی</div>
                              </div>

                              <div class="coursesCard-footer__price">
                                <div>179</div>
                                <div>79000 تومان</div>
                              </div>
                            </div>
                          </div>
                        </a>

                      </div>

                      <div data-anim="slide-up delay-2" class="col-md-6">

                        <a href="" class="coursesCard -type-1 rounded-8 shadow-3 bg-white">
                          <div class="relative">
                            <div class="coursesCard__image overflow-hidden rounded-top-8">
                              <img class="w-1/1" src="img/coursesCards/2.png" alt="image">
                              <div class="coursesCard__image_overlay rounded-top-8"></div>
                            </div>
                            <div class="d-flex justify-between py-10 px-10 absolute-full-center z-3">

                              <div>
                                <div class="px-15 rounded-200 bg-purple-1">
                                  <span class="text-11 lh-1 uppercase fw-500 text-white">ویژه</span>
                                </div>
                              </div>

                              <div>
                                <div class="px-15 rounded-200 bg-green-1">
                                  <span class="text-11 lh-1 uppercase fw-500 text-dark-1">پرفروش</span>
                                </div>
                              </div>

                            </div>
                          </div>

                          <div class="h-100 pt-20 pb-15 px-30">
                            <div class="d-flex items-center">
                              <div class="text-14 lh-1 text-yellow-1 ml-10">4.5</div>
                              <div class="d-flex x-gap-5 items-center">
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                                <div class="icon-star text-9 text-yellow-1"></div>
                              </div>
                              <div class="text-13 lh-1 mr-10">(1991)</div>
                            </div>

                            <div class="text-17 lh-15 fw-500 text-dark-1 mt-10">آموزش Angular</div>

                            <div class="d-flex x-gap-10 items-center pt-10">

                              <div class="d-flex items-center">
                                <div class="ml-8">
                                  <img src="img/coursesCards/icons/1.svg" alt="icon">
                                </div>
                                <div class="text-14 lh-1">6 دوره</div>
                              </div>

                              <div class="d-flex items-center">
                                <div class="ml-8">
                                  <img src="img/coursesCards/icons/2.svg" alt="icon">
                                </div>
                                <div class="text-14 lh-1">8ساعت 20دقیقه</div>
                              </div>

                              <div class="d-flex items-center">
                                <div class="ml-8">
                                  <img src="img/coursesCards/icons/3.svg" alt="icon">
                                </div>
                                <div class="text-14 lh-1">مقدماتی</div>
                              </div>

                            </div>

                            <div class="coursesCard-footer">
                              <div class="coursesCard-footer__author">
                                <img src="img/general/avatar-1.png" alt="image">
                                <div>علی صالحی</div>
                              </div>

                              <div class="coursesCard-footer__price">
                                <div>179</div>
                                <div>79000 تومان</div>
                              </div>
                            </div>
                          </div>
                        </a>

                      </div>

                    </div>
                  </div> --}}
                    </div>
                </div>
            </div>
        </div>
    </section>

    {{--      <div class="layout-pt-md layout-pb-lg"> --}}
    {{--        <div class="container"> --}}
    {{--          <div class="row justify-center"> --}}
    {{--            <div class="col-xl-8 col-lg-9 col-md-11"> --}}
    {{--              <div class="tabs -active-purple-2 js-tabs"> --}}
    {{--                <div class="tabs__controls d-flex js-tabs-controls"> --}}
    {{--                  <button class="tabs__button js-tabs-button is-active" data-tab-target=".-tab-item-1" type="button"> --}}
    {{--                    توضیحات --}}
    {{--                  </button> --}}
    {{--                  --}}{{-- <button class="tabs__button js-tabs-button mr-30" data-tab-target=".-tab-item-2" type="button"> --}}
    {{--                    دوره ها --}}
    {{--                  </button> --}}
    {{--                </div> --}}

    {{--                <div class="tabs__content pt-60 lg:pt-40 js-tabs-content"> --}}
    {{--                  <div class="tabs__pane -tab-item-1 is-active"> --}}
    {{--                    <h4 class="text-20">توضیحات</h4> --}}
    {{--                    <p class="text-light-1 mt-30"> --}}
    {{--                        {!! $teacher->description !!} --}}
    {{--                    </p> --}}
    {{--                    --}}{{-- <button class="button underline text-purple-1 mt-30">مشاهده بیشتر</button> --}}
    {{--                  </div> --}}

    {{--                  --}}{{-- <div class="tabs__pane -tab-item-2"> --}}
    {{--                    <div class="row"> --}}

    {{--                      <div data-anim="slide-up delay-1" class="col-md-6"> --}}

    {{--                        <a href="" class="coursesCard -type-1 rounded-8 shadow-3 bg-white"> --}}
    {{--                          <div class="relative"> --}}
    {{--                            <div class="coursesCard__image overflow-hidden rounded-top-8"> --}}
    {{--                              <img class="w-1/1" src="img/coursesCards/1.png" alt="image"> --}}
    {{--                              <div class="coursesCard__image_overlay rounded-top-8"></div> --}}
    {{--                            </div> --}}
    {{--                            <div class="d-flex justify-between py-10 px-10 absolute-full-center z-3"> --}}

    {{--                            </div> --}}
    {{--                          </div> --}}

    {{--                          <div class="h-100 pt-20 pb-15 px-30"> --}}
    {{--                            <div class="d-flex items-center"> --}}
    {{--                              <div class="text-14 lh-1 text-yellow-1 ml-10">4.5</div> --}}
    {{--                              <div class="d-flex x-gap-5 items-center"> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                              </div> --}}
    {{--                              <div class="text-13 lh-1 mr-10">(1991)</div> --}}
    {{--                            </div> --}}

    {{--                            <div class="text-17 lh-15 fw-500 text-dark-1 mt-10">آموزش NodeJs</div> --}}

    {{--                            <div class="d-flex x-gap-10 items-center pt-10"> --}}

    {{--                              <div class="d-flex items-center"> --}}
    {{--                                <div class="ml-8"> --}}
    {{--                                  <img src="img/coursesCards/icons/1.svg" alt="icon"> --}}
    {{--                                </div> --}}
    {{--                                <div class="text-14 lh-1">6 دوره</div> --}}
    {{--                              </div> --}}

    {{--                              <div class="d-flex items-center"> --}}
    {{--                                <div class="ml-8"> --}}
    {{--                                  <img src="img/coursesCards/icons/2.svg" alt="icon"> --}}
    {{--                                </div> --}}
    {{--                                <div class="text-14 lh-1">8ساعت 20دقیقه</div> --}}
    {{--                              </div> --}}

    {{--                              <div class="d-flex items-center"> --}}
    {{--                                <div class="ml-8"> --}}
    {{--                                  <img src="img/coursesCards/icons/3.svg" alt="icon"> --}}
    {{--                                </div> --}}
    {{--                                <div class="text-14 lh-1">مقدماتی</div> --}}
    {{--                              </div> --}}

    {{--                            </div> --}}

    {{--                            <div class="coursesCard-footer"> --}}
    {{--                              <div class="coursesCard-footer__author"> --}}
    {{--                                <img src="img/general/avatar-1.png" alt="image"> --}}
    {{--                                <div>علی صالحی</div> --}}
    {{--                              </div> --}}

    {{--                              <div class="coursesCard-footer__price"> --}}
    {{--                                <div>179</div> --}}
    {{--                                <div>79000 تومان</div> --}}
    {{--                              </div> --}}
    {{--                            </div> --}}
    {{--                          </div> --}}
    {{--                        </a> --}}

    {{--                      </div> --}}

    {{--                      <div data-anim="slide-up delay-2" class="col-md-6"> --}}

    {{--                        <a href="" class="coursesCard -type-1 rounded-8 shadow-3 bg-white"> --}}
    {{--                          <div class="relative"> --}}
    {{--                            <div class="coursesCard__image overflow-hidden rounded-top-8"> --}}
    {{--                              <img class="w-1/1" src="img/coursesCards/2.png" alt="image"> --}}
    {{--                              <div class="coursesCard__image_overlay rounded-top-8"></div> --}}
    {{--                            </div> --}}
    {{--                            <div class="d-flex justify-between py-10 px-10 absolute-full-center z-3"> --}}

    {{--                              <div> --}}
    {{--                                <div class="px-15 rounded-200 bg-purple-1"> --}}
    {{--                                  <span class="text-11 lh-1 uppercase fw-500 text-white">ویژه</span> --}}
    {{--                                </div> --}}
    {{--                              </div> --}}

    {{--                              <div> --}}
    {{--                                <div class="px-15 rounded-200 bg-green-1"> --}}
    {{--                                  <span class="text-11 lh-1 uppercase fw-500 text-dark-1">پرفروش</span> --}}
    {{--                                </div> --}}
    {{--                              </div> --}}

    {{--                            </div> --}}
    {{--                          </div> --}}

    {{--                          <div class="h-100 pt-20 pb-15 px-30"> --}}
    {{--                            <div class="d-flex items-center"> --}}
    {{--                              <div class="text-14 lh-1 text-yellow-1 ml-10">4.5</div> --}}
    {{--                              <div class="d-flex x-gap-5 items-center"> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                                <div class="icon-star text-9 text-yellow-1"></div> --}}
    {{--                              </div> --}}
    {{--                              <div class="text-13 lh-1 mr-10">(1991)</div> --}}
    {{--                            </div> --}}

    {{--                            <div class="text-17 lh-15 fw-500 text-dark-1 mt-10">آموزش Angular</div> --}}

    {{--                            <div class="d-flex x-gap-10 items-center pt-10"> --}}

    {{--                              <div class="d-flex items-center"> --}}
    {{--                                <div class="ml-8"> --}}
    {{--                                  <img src="img/coursesCards/icons/1.svg" alt="icon"> --}}
    {{--                                </div> --}}
    {{--                                <div class="text-14 lh-1">6 دوره</div> --}}
    {{--                              </div> --}}

    {{--                              <div class="d-flex items-center"> --}}
    {{--                                <div class="ml-8"> --}}
    {{--                                  <img src="img/coursesCards/icons/2.svg" alt="icon"> --}}
    {{--                                </div> --}}
    {{--                                <div class="text-14 lh-1">8ساعت 20دقیقه</div> --}}
    {{--                              </div> --}}

    {{--                              <div class="d-flex items-center"> --}}
    {{--                                <div class="ml-8"> --}}
    {{--                                  <img src="img/coursesCards/icons/3.svg" alt="icon"> --}}
    {{--                                </div> --}}
    {{--                                <div class="text-14 lh-1">مقدماتی</div> --}}
    {{--                              </div> --}}

    {{--                            </div> --}}

    {{--                            <div class="coursesCard-footer"> --}}
    {{--                              <div class="coursesCard-footer__author"> --}}
    {{--                                <img src="img/general/avatar-1.png" alt="image"> --}}
    {{--                                <div>علی صالحی</div> --}}
    {{--                              </div> --}}

    {{--                              <div class="coursesCard-footer__price"> --}}
    {{--                                <div>179</div> --}}
    {{--                                <div>79000 تومان</div> --}}
    {{--                              </div> --}}
    {{--                            </div> --}}
    {{--                          </div> --}}
    {{--                        </a> --}}

    {{--                      </div> --}}

    {{--                    </div> --}}
    {{--                  </div> --}}
    {{--                </div> --}}
    {{--              </div> --}}
    {{--            </div> --}}
    {{--          </div> --}}
    {{--        </div> --}}
    {{--      </div> --}}


@endsection