@extends('layouts.front.app')

@section('og')
<meta property="og:title" content="{{ config('app.name') }}-{{ $title }}" />
<meta property="og:description" content="{{ config('app.description') }}-{{ $title }}" />
@endsection
@section('css')
<style type="text/css">
  html,
  body {
    height: 40vh;
  }
  
  /*.carousel
  height: 400px;
}*/

@media (max-width: 740px) {
  
  html,
  body,
  .carousel {
    height: 100vh;
  }
}

@media (min-width: 800px) and (max-width: 850px) {
  
  html,
  body,
  header,
  .carousel {
    height: 100vh;
  }
}
</style>
<link href="https://fonts.googleapis.com/css?family=Changa" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=ABeeZee" rel="stylesheet">
@endsection

@section('content')
@section('content')
<!--Main layout-->
<main>
  <div class="container">
    <div class="row">
      <div class="float-left w-25">
        @include(config('site.domain').'.layouts.front.sidebar-left')
      </div>
      <div class="float-right w-75">
        <nav aria-label="breadcrumb">
          <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
            <li class="breadcrumb-item">Produtos</li>
            <li class="breadcrumb-item active">Destaques</li>
          </ol>
        </nav>
        @include(config('site.domain').'.front.products.product-list', $products)
      </div>
    </div>
  </div>
</main>
<!--Main layout-->
@endsection