@extends('.frontend.default')

@section('content')
    <section class="tutor-d-fisrt">
        <div class="container">
            <div class="back-to-btn">
                <a href="{{route('.instructor.search')}}"><i class="fa fa-angle-left" aria-hidden="true"></i> 返回搜尋結果</a>
            </div>
            @include('frontend.template.instructor.card',[
                        'is_details' => true,
                    ])
        </div>
    </section>

<div class="Popular_services_sec" id="tut-details">
	<div class="container">
		<div class="row">
			<div class="col-lg-12">
				<div class="titel">
					<h2>現有服務提供</h2>
				</div>
			</div>
			<div class="col-lg-3 col-md-6">
				<div class="featured-main">
					<div class="featured">
						<a href="tutor-service-details.html"><img src="{{asset('custom-assets/images/featured-5.png')}}" alt="" /></a>
						<div class="featured-text">
							<div class="turs-mains">
								<div class="tutes-img"><img src="{{asset('custom-assets/images/tute-dtls-img.png')}}" /></div>
								<div class="tute-wraper">
									<h4>CT 面試技巧工作坊</h4>
									<p>馮嘉嘉導師</p>
								</div>
							</div>
							<div class="innovation_btn">
								<a class="innovation" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" /> 職涯/就業</a>
								<a class="workshops" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" />講座/工作坊</a>
							</div>

							<ul>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/heart.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/share-alt.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><i class="far fa-dollar-sign"></i> 100</a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/ionic-md-people.svg')}}" alt="" /> 30</a>
								</li>
							</ul>
							<div class="school">
								<h4>高中程度</h4>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-3 col-md-6">
				<div class="featured-main">
					<div class="featured">
						<img src="{{asset('custom-assets/images/featured-3.png')}}" alt="" />
						<div class="featured-text">
							<div class="turs-mains">
								<div class="tutes-img"><img src="{{asset('custom-assets/images/tute-dtls-img.png')}}" /></div>
								<div class="tute-wraper">
									<h4>雙語數學教室</h4>
									<p>馮嘉嘉導師</p>
								</div>
							</div>
							<div class="innovation_btn">
								<a class="innovation" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" />職涯/就業</a>
								<a class="workshops" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" />講座/工作坊</a>
							</div>

							<ul>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/heart.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/share-alt.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/material-attach-money.svg')}}" alt="" /> 1600</a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/ionic-md-people.svg')}}" alt="" /> 30</a>
								</li>
							</ul>
							<div class="school">
								<h4>高中程度</h4>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="col-lg-3 col-md-6">
				<div class="featured-main">
					<div class="featured">
						<img src="{{asset('custom-assets/images/featured-4.png')}}" alt="" />
						<div class="featured-text">
							<div class="turs-mains">
								<div class="tutes-img"><img src="{{asset('custom-assets/images/tute-dtls-img.png')}}" /></div>
								<div class="tute-wraper">
									<h4>團團芋圓</h4>
									<p>馮嘉嘉導師</p>
								</div>
							</div>
							<div class="innovation_btn">
								<a class="innovation" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" />職涯/就業</a>
								<a class="workshops" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" /> 講座/工作坊</a>
							</div>

							<ul>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/heart.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/share-alt.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/material-attach-money.svg')}}" alt="" /> 1600</a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/ionic-md-people.svg')}}" alt="" /> 30</a>
								</li>
							</ul>
							<div class="school">
								<h4>高中程度</h4>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-3 col-md-6">
				<div class="featured-main">
					<div class="featured">
						<img src="{{asset('custom-assets/images/featured-2.png')}}" alt="" />
						<div class="featured-text">
							<div class="turs-mains">
								<div class="tutes-img"><img src="{{asset('custom-assets/images/tute-dtls-img.png')}}" /></div>
								<div class="tute-wraper">
									<h4>課餘託管ZOOM</h4>
									<p>馮嘉嘉導師</p>
								</div>
							</div>
							<div class="innovation_btn">
								<a class="innovation" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" />職涯/就業</a>
								<a class="workshops" href="#"><img src="{{asset('custom-assets/images/material-label.png')}}" alt="" /> 講座/工作坊</a>
							</div>

							<ul>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/heart.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/share-alt.svg')}}" alt="" /></a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/material-attach-money.svg')}}" alt="" /> 2300</a>
								</li>
								<li>
									<a href="#"><img src="{{asset('custom-assets/images/ionic-md-people.svg')}}" alt="" /> 30</a>
								</li>
							</ul>
							<div class="school">
								<h4>高中程度</h4>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-12">
				<div class="tutor-deatils-drop text-center opn-table" id="table-drop-opn" style="margin-bottom: 80px;">
					<a class="drop-btns-details">過往已完成的服務 <i class="fa fa-angle-up" aria-hidden="true"></i></a>
					<div class="table-drop">
						<div class="main-table-drop">
							<table class="table">
								<thead>
									<tr>
										<th scope="col">報價日期</th>
										<th scope="col">服務名稱</th>
										<th scope="col">服務日期範圍</th>
										<th scope="col">服務學校</th>
										<th scope="col">服務對象</th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<td scope="row">10/6/2020</td>
										<td>互動體驗服務</td>
										<td>5/08/2020 - 10/8/2020</td>
										<td>聖心書院</td>
										<td>高中學生</td>
									</tr>
									<tr>
										<td scope="row">11/1/2020</td>
										<td>鋼琴助教</td>
										<td>4/02/2020 - 4/2/2020</td>
										<td>文理書院</td>
										<td>初中學生</td>
									</tr>
									<tr>
										<td scope="row">11/12/2019</td>
										<td>數學助教</td>
										<td>4/02/2020 - 4/2/2020</td>
										<td>文理書院</td>
										<td>初中學生</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

@section('pagescript')
    <script>
        $(document).ready(function () {
            $("a").click(function () {
                $("#table-drop-opn").toggleClass("opn-table");
            });
        });

        $(".mentor-quote-content .object_select").click(function () {
            $(this).toggleClass("active");
        });

        $("button.quote-button").click(function () {
            $("#exampleModalCenter1").modal("hide");
        });
    </script>
@endsection


@endsection