@extends('layouts.app')

@section('title')
    <title>{{$page->title}}</title>  
    <meta name="description" content="{{$page->meta_description}}">
    <!-- Open Graph / Facebook -->
    <meta property="og:url" content="{{Request::url()}}" />
    <meta property="og:type" content="website">
    <meta property="og:title" content="{{$page->title}}">
    <meta property="og:description" content="{{$page->meta_description}}">
    <meta property="og:image" content="{{Voyager::image($page->banner)}}">
    <!-- Twitter -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:title" content="{{$page->title}}" />
    <meta name="twitter:description" content="{{$page->meta_description}}" />
    <meta name="twitter:image" content="{{Voyager::image($page->banner)}}" />
    <link rel="canonical" href="{{Request::url()}}" />
@endsection

@section('body') 

      <section class="banner" style="background: url({{Voyager::image($page->banner)}})">
				<div class="container">
					<div class="row">
						<div class="col-lg-12">
							<div class="breadcrumb-info text-center" data-lag="0.2" data-stagger="0.08" data-speed="1" style="translate: none; rotate: none; scale: none; transform: translate(0px, 0px); will-change: transform;">
								<h1>{{$page->title}} {{$full->year}}</h1>
							</div>
						</div>
					</div>
				</div>
			</section>


<div class="container">
<div class="row">
    <div class="col-md-9">
      <div class="event_text e_tab p90">
        <ul class="nav nav-tabs" role="tablist">
          @if($ultra)
          <li class="nav-item" role="presentation">
            <button @if($ultra && !$full && !$half) class="active" @endif data-bs-toggle="tab" data-bs-target="#tab1" type="button">
              {{ $ultra->title }}
            </button>
          </li>
          @endif
          @if($full)
          <li class="nav-item" role="presentation">
            <button class="active" data-bs-toggle="tab" data-bs-target="#tab2" type="button">
            {{ $full->title }}
            </button>
          </li>
          @endif
          @if($half)
          <li class="nav-item" role="presentation">
            <button data-bs-toggle="tab" data-bs-target="#tab3" type="button">
            {{ $half->title }}
            </button>
          </li>
          @endif


        </ul>

      </div>

      <section class="result_table" style="padding-bottom:90px;">
        <div class="tab-content" id="myTabContent">
          @if($ultra)
            <div class="tab-pane fade @if($ultra && !$full && !$half) active show @endif" id="tab1" role="tabpanel">
              {!!$ultra->table!!}
            </div>
          @endif

          @if($full)
            <div class="tab-pane fade active show " id="tab2" role="tabpanel">
            {!!$full->table!!}
            </div>
          @endif 

          @if($half)
            <div class="tab-pane fade @if(!$full && !$ultra && $half) active show @endif" id="tab3" role="tabpanel">
            {!!$half->table!!}
            </div>
          @endif
        </div>     
      </section>
    </div>

    <div class="col-md-3">
      <div class="archives">
          <h4><i class="fa-regular fa-folder-open"></i> Race Results</h4>

          <div class="wrap">
            @foreach($years as $fu)
              <a href="/results/{{$fu->year}}" @if($fu->year == Request::segment(2)) class="active" @endif @if($loop->first && !Request::segment(2)) class="active" @endif>Race Result {{$fu->year}}</a>
            @endforeach
          </div>

        </div>
    </div>
  </div>
</div>


@endsection