@extends('layouts.app')

@section('title',"Team Overview | Your Website")

@section('content')

	@include('layouts._secondary-menu',['secondaryMenus' => ['News','Standings','Fixtures','Scorer','Teams','History']])

	@include('layouts._breadcrumb',['pageName'=> ['Football','Premier League','Teams','Chelsea']])
	
	<div class="wrap-width">

			@include('layouts._team-secondary-menu',
			['secondaryMenus' => ['Overview','News','Photos','Standings','Fixtures','Squad']],
			['isActive'=>"Overview"])

			{{-- <a href="" class="btn-favorite" title="">
				<i class="icon icon-favorite"></i>
				<span class="label">Add to Favorite</span>
			</a> --}}

			<div class="grid">
				<div class="col-minus-sidebar-1">
					<img src="../resources/image/temp/news-1.jpg" alt="" class="team-photo mt-3">
	
					<div class="widget widget-news-article-share">
						<strong class="share-count">1.4k</strong>
						<span class="share-divider"></span>
						<ul class="share-media">
							<li class="share-media-item">
								<a href="" title="" target="_blank" class="share-media-like"></a>
							</li>
							<li class="share-media-item">
								<a href="" title="" target="_blank" class="share-media-facebook"></a>
							</li>
							<li class="share-media-item">
								<a href="" title="" target="_blank" class="share-media-twitter"></a>
							</li>
							<li class="share-media-item">
								<a href="" title="" target="_blank" class="share-media-whatsapp"></a>
							</li>
							<li class="share-media-item">
								<a href="" title="" target="_blank" class="share-media-google"></a>
							</li>
							<li class="share-media-item">
								<a href="" title="" target="_blank" class="share-media-mail"></a>
							</li>
						</ul>
					</div>

					<div class="widget widget-team-vote">
						<h2 class="title heading-md">
							<a href="" title="">Team Rating</a>
						</h2>

						<div class="vote-wrap">
							<div class="vote-rating">
								<span class="value">4.2</span>
								<span class="icon-stars icon-stars-large">
									<span class="stars-0"></span>
								</span>
							</div>
							<div class="vote-action">
								<button class="btn-generic">Vote</button>
							</div>
						</div>

						<p class="vote-count">(1024 Votes)</p>
					</div> <!-- widget -->

					<div class="widget widget-team-vote">
						<h2 class="title heading-md">
							<a href="" title="">Team Rating</a>
						</h2>

						<div class="vote-wrap">
							<div class="vote-rating">
								<span class="value">4.2</span>
								<span class="icon-stars icon-stars-large">
									<span style="width: 91.5%;"></span>
								</span>
							</div>
							
							<ul class="vote-results">
								<li class="vote-results-row">
									<div class="vote-results-stars">
										<span class="icon-stars-results icon-stars stars-5"></span>
									</div>
									<span class="vote-results-track">
										<span class="vote-results-fill" style="width: 80%;"></span>
									</span>
								</li>
								<li class="vote-results-row">
									<div class="vote-results-stars">
										<span class="icon-stars-results icon-stars stars-4"></span>
									</div>
									<span class="vote-results-track">
										<span class="vote-results-fill" style="width: 20%;"></span>
									</span>
								</li>
								<li class="vote-results-row">
									<div class="vote-results-stars">
										<span class="icon-stars-results icon-stars stars-3"></span>
									</div>
									<span class="vote-results-track">
										<span class="vote-results-fill" style="width: 4%;"></span>
									</span>
								</li>
								<li class="vote-results-row">
									<div class="vote-results-stars">
										<span class="icon-stars-results icon-stars stars-2"></span>
									</div>
									<span class="vote-results-track">
										<span class="vote-results-fill" style="width: 1%;"></span>
									</span>
								</li>
								<li class="vote-results-row">
									<div class="vote-results-stars">
										<span class="icon-stars-results icon-stars stars-1"></span>
									</div>
									<span class="vote-results-track">
										<span class="vote-results-fill" style="width: 10%;"></span>
									</span>
								</li>
							</ul>
						</div>

						<p class="vote-count">(1024 Votes)</p>
					</div> <!-- widget -->
					
					<div class="widget widget-team-info">
						<header class="widget widget-heading-small">
							<h2 class="title heading-md">
								<a href="" title="">Team Info</a>
							</h2>
						</header>

						<ul class="team-properties">
							<li class="entry">
								<span class="label">Founded</span>
								<span class="divider"></span>
								<span class="content">1905</span>
							</li>
							<li class="entry">
								<span class="label">League</span>
								<span class="divider"></span>
								<span class="content">Premier League</span>
							</li>
							<li class="entry">
								<span class="label">Coach</span>
								<span class="divider"></span>
								<span class="content">Maurizio Sarri</span>
							</li>
							<li class="entry">
								<span class="label">President</span>
								<span class="divider"></span>
								<span class="content">Roman Abramovich</span>
							</li>
							<li class="entry">
								<span class="label">Stadium</span>
								<span class="divider"></span>
								<span class="content">Stamford Bridge</span>
							</li>
							<li class="entry">
								<span class="label">City</span>
								<span class="divider"></span>
								<span class="content">London</span>
							</li>
							<li class="entry">
								<span class="label">Capacity</span>
								<span class="divider"></span>
								<span class="content">41,841</span>
							</li>
							<li class="entry">
								<span class="label">Website</span>
								<span class="divider"></span>
								<span class="content"><a href="" target="_blank" title="">www.chelseafc.com</a></span>
							</li>
						</ul>
					</div>
					<div class="widget widget-team-match widget-prediction-poll mt-3 pb-2">
						<header class="widget widget-heading-small">
							<h2 class="title heading-md">
								<a href="" title="">Next Match</a>
							</h2>
						</header>

						<div class="prediction-content">
							<h5 class="match-league">Premier League</h5>
							<h6 class="match-week">Game Week 12, 23 November 2018</h6>

							<div class="match-teams">
								<div class="match-team">
									<h6 class="team-name">Chelsea</h6>
									<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">	
								</div>
								<div class="match-status">
									<div class="match-result">22:00</div>
								</div>
								<div class="match-team">
									<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">	
									<h6 class="team-name">Fulham</h6>
								</div>
							</div>

							<div class="prediction-vote">
								<h5 class="vote-heading">Vote and give your prediction for this game</h5>

								<form action="" class="vote-panel">
									<div class="vote-item">
										<button type="submit" class="vote-home vote-button">1</button>
									</div>
									<div class="vote-item">
										<button type="submit" class="vote-draw vote-button">X</button>
									</div>
									<div class="vote-item">
										<button type="submit" class="vote-away vote-button">2</button>
									</div>
								</form>

								<p class="vote-count">(1023 Votes)</p>
							</div>
						</div> <!-- prediction-content -->

						<div class="widget widget-odds">
							<a href="" title="" target="_blank" class="odds-provider">
								<img src="../resources/image/temp/odds-1.jpg" alt="">
							</a>
							
							<div class="match-bet-wrap">
								<ul class="match-bet">
									<li class="bet-home">
										<span class="bet-label">1</span>
										<strong class="bet-odds">3.50</strong>
									</li>
									<li class="bet-draw">
										<span class="bet-label">X</span>
										<strong class="bet-odds">3.30</strong>
									</li>
									<li class="bet-away">
										<span class="bet-label">2</span>
										<strong class="bet-odds">2.10</strong>
									</li>
								</ul>
							</div>		

							<a href="" title="" class="btn-view-more widget-view-more">
								<span class="label">View More</span>
								<i class="icon icon-view-more"></i>
							</a>
						</div> <!-- odds -->
					</div> <!-- widget -->

					<header class="widget widget-heading-small mt-3">
						<h2 class="title heading-md">
							<a href="" title="">Team News</a>
						</h2>

						<ul class="heading-tabs">
							<li>
								<a href="" title="">All News</a>
							</li>
						</ul>
					</header>

					<div class="box-generic">
						<div class="widget widget-news-grid">
							<div class="photo">
								<a href="" title="">
									<img src="../resources/image/temp/news-2.jpg" alt="" class="news-photo">
								</a>
							</div>
	
							<a href="" title="" class="item">
								<h2 class="title heading-xm">Lorem ipsum dolor sit amet, illud tempor dissentias ne vel. Facete audire molestiae duo at</h2>
								<em class="time">23 November 2018 | 18:18</em>
								<p class="excerpt">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
							</a>
						</div> <!-- widget -->
						
						<div class="widget widget-news-grid">
							<div class="grid">
								<a href="" title="" class="item col-1-2">
									<div class="photo">
										<img src="../resources/image/temp/news-3.jpg" alt="">
									</div>
									<h2 class="title heading-sm">Lorem ipsum dolor sit amet, consectetur adipiscing elit</h2>
									<em class="time">23 November 2018 | 18:18</em>
								</a>
		
								<a href="" title="" class="item col-1-2">
									<div class="photo">
										<img src="../resources/image/temp/news-3.jpg" alt="">
									</div>
									<h2 class="title heading-sm">Lorem ipsum dolor sit amet</h2>
									<em class="time">23 November 2018 | 18:18</em>
								</a>
							</div>
						</div> <!-- widget -->

						<div class="widget widget-news-grid">
							<div class="grid">
								<a href="" title="" class="item col-1-3">
									<div class="photo">
										<img src="../resources/image/temp/news-3.jpg" alt="">
									</div>
									<h2 class="title heading-xxs">Lorem ipsum dolor sit amet, consectetur</h2>
								</a>

								<a href="" title="" class="item col-1-3">
									<div class="photo">
										<img src="../resources/image/temp/news-3.jpg" alt="">
									</div>
									<h2 class="title heading-xxs">Lorem ipsum dolor sit amet, consectetur adipiscing</h2>
								</a>

								<a href="" title="" class="item col-1-3">
									<div class="photo">
										<img src="../resources/image/temp/news-3.jpg" alt="">
									</div>
									<h2 class="title heading-xxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit</h2>
								</a>
							</div> <!-- grid -->
						</div> <!-- widget -->
					</div> <!-- box -->
					
				</div> <!-- col-minus-sidebar-1 -->
				<div class="col-sidebar">
					@include('layouts.side-bar-components._vertical-banner',['bannerURL'=>'../resources/image/temp/banner-300-2.jpg'])

					{{-- @include('layouts.side-bar-components._next-match') --}}
					
					@include('layouts.side-bar-components._standings')
	
					@include('layouts.side-bar-components._poll')

					@include('layouts.side-bar-components._vertical-banner',['bannerURL'=>'../resources/image/temp/banner-300.jpg'])
				</div> <!-- col-sidebar -->
				
			</div> <!-- grid -->

			{{-- <header class="widget widget-heading-small mt-3">
				<h2 class="title heading-md">
					<a href="" title="">Matches</a>
				</h2>

				<ul class="heading-tabs">
					<li>
						<a href="" title="">View All</a>
					</li>
				</ul>
			</header> --}}

			{{-- <div class="box-generic">
				<div class="widget widget-carousel-5 widget-carousel-matches">
					<div class="content">
						<a href="" title="" class="match-entry">
							<h5 class="match-week">Game Week 12</h5>
	
							<div class="match-teams">
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
								<div class="match-result">
									<p class="result-content">2 - 0</p>
									<p class="result-status">FT</p>
								</div>
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
							</div>
	
							<div class="match-teams-names match-finished">
								<h6 class="team-name team-home">Man City</h6>
								<h6 class="team-name team-away">Fulham</h6>
							</div>
						</a>
	
						<a href="" title="" class="match-entry">
							<h5 class="match-week">Game Week 12</h5>
	
							<div class="match-teams">
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
								<div class="match-result">
									<p class="result-content">1 - 3</p>
									<p class="result-status">FT</p>
								</div>
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
							</div>
	
							<div class="match-teams-names match-finished">
								<h6 class="team-name team-home">Tottenham</h6>
								<h6 class="team-name team-away">Liverpool</h6>
							</div>
						</a>
	
						<a href="" title="" class="match-entry">
							<h5 class="match-week">Game Week 12</h5>
	
							<div class="match-teams">
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
								<div class="match-result">
									<p class="result-content">1 - 0</p>
									<p class="result-status">[ 69’ ]</p>
								</div>
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
							</div>
	
							<div class="match-teams-names match-live">
								<h6 class="team-name team-home">Chelsea</h6>
								<h6 class="team-name team-away">Arsenal</h6>
							</div>
						</a>
	
						<a href="" title="" class="match-entry match-upcoming">
							<h5 class="match-week">Game Week 12</h5>
	
							<div class="match-teams">
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
								<div class="match-result">
									<p class="result-content">22.11</p>
									<p class="result-status">18:00</p>
								</div>
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
							</div>
	
							<div class="match-teams-names">
								<h6 class="team-name team-home">Watford</h6>
								<h6 class="team-name team-away">Man United</h6>
							</div>
						</a>
	
						<a href="" title="" class="match-entry match-upcoming">
							<h5 class="match-week">Game Week 12</h5>
	
							<div class="match-teams">
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
								<div class="match-result">
									<p class="result-content">23.11</p>
									<p class="result-status">19:30</p>
								</div>
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
							</div>
	
							<div class="match-teams-names">
								<h6 class="team-name team-home">Everton</h6>
								<h6 class="team-name team-away">West Ham</h6>
							</div>
						</a>
	
						<a href="" title="" class="match-entry match-upcoming">
							<h5 class="match-week">Game Week 12</h5>
							<div class="match-teams">
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
								<div class="match-result">
									<p class="result-content">22.11</p>
									<p class="result-status">18:00</p>
								</div>
								<img src="../resources/image/temp/team-1.png" alt="" class="team-logo">
							</div>
	
							<div class="match-teams-names">
								<h6 class="team-name team-home">Watford</h6>
								<h6 class="team-name team-away">Man United</h6>
							</div>
						</a>
					</div>
		
					<nav class="arrows">
						<button class="prev"></button>
						<button class="next"></button>
					</nav>
				</div> <!-- widget -->
			</div> <!-- box-generic --> --}}

		</div>
@endsection