@extends('layouts.app')

@section('conteudo')

<br>
    <center>
      @if (session('erro'))
        <div class="alert alert-danger">
            {{ session('erro') }}
        </div>
      @endif
    </center>


        <!-- Hero -->
        <div class="bg-dark bg-image" style="background-image: url('{{$periodo->foto}}');">
          <div class="bg-black-75">
            <div class="content content-full content-top">
              <div class="py-4 text-center">
                <h1 class="fw-bold text-white mb-2">
                  {{$periodo->descricao}}
                </h1>
                 <h2 class="h3 fw-normal text-white-75">

                </h2>
                <a class="btn btn-hero btn-primary" href="/editar_periodo/{{$periodo->id}}" data-toggle="click-ripple">
                  <i class="fa fa-pencil-alt text-info"></i> Editar periodo
                </a>
              </div>
            </div>
          </div>
        </div>
        <!-- END Hero -->

        <!-- Page Content -->
        <div class="content content-boxed">
          <!-- Meta -->
          <div class="row items-push">
            <div class="col-md-6">
              <a class="block block-rounded block-bordered block-link-shadow h-100 mb-0" href="javascript:void(0)">
                <div class="block-content block-content-full text-center bg-body-light">
                  <img class="img-avatar img-avatar-thumb" src="{{$periodo->foto}}" alt="">
                  <div class="mt-2">
                    <p class="fw-semibold mb-0">
                        Curso: {{$periodo->cursos}}
                    </p>
                  </div>
                </div>
                <div class="block-content block-content-full text-center">
                  <div class="row g-sm">
                    <div class="col-6">
                      <div class="item item-circle mx-auto">
                        <i class="fa fa-fw fa-boxes fa-2x text-dark"></i>
                      </div>
                      <p class="text-muted mb-0">
                        {{$periodo->horario_inicio}}
                      </p>
                    </div>
                    <div class="col-6">
                      <div class="item item-circle mx-auto">
                        <i class="fa fa-fw fa-users fa-2x text-dark"></i>
                      </div>
                      <p class="text-muted mb-0">
                        {{$periodo->horario_termino}}
                      </p>
                    </div>
                  </div>
                </div>
              </a>
            </div>
            <div class="col-md-6">
              <div class="block block-rounded block-bordered block-link-shadow h-100 mb-0">
                <div class="block-content">
                  <table class="table table-borderless table-striped">
                    <tbody>
                      <!-- <tr>
                        <td class="fw-medium text-muted">
                          <i class="fa fa-fw fa-shopping-basket me-1"></i> Data Criação: {{$periodo->creat_at}}
                        </td>
                      </tr> -->
                      <tr>
                        <td>
                          <i class="fa fa-fw fa-tags me-1"></i>
                          <span class="badge bg-primary">CSS</span>
                          <span class="badge bg-primary">Sass</span>
                          <span class="badge bg-primary">Less</span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
          </div>
          <!-- END Meta -->

          <div class="row">
            <div class="col-sm-6">
              <!-- Billing Address -->
              <div class="block block-rounded">
                <div class="block-header block-header-default">
                  <h3 class="block-title">Endereço</h3>
                </div>
                <div class="block-content">
                  <div class="fs-4 mb-1">{{$periodo->endereco}}</div>
                  <address class="fs-sm">
                    {{$periodo->numero}}<br>
                    {{$periodo->complemento}}<br>
                    {{$periodo->bairro}}<br>
                    {{$periodo->telefone1}}<br>
                  </address>
                </div>
              </div>
              <!-- END Billing Address -->
            </div>
            <div class="col-sm-6">
              <!-- Shipping Address -->
              <div class="block block-rounded">
                <div class="block-header block-header-default">
                  <h3 class="block-title">Outras Informações</h3>
                </div>
                <div class="block-content">
                  <div class="fs-4 mb-1">Assinatura: {{$periodo->assinatura}}</div>
                  <address class="fs-sm">
                    Organização: {{$periodo->organizacao_id}}<br>
                    Projeto: {{$periodo->projeto_id}}<br>
                    Prestador: {{$periodo->funcionario_id}}<br>
                     Período:{{$periodo->periodo_id}}<br>
                  </address>
                </div>
              </div>
              <!-- END Shipping Address -->
            </div>
          </div>


              <br><br><br>


              <!-- Pagination -->
              <nav aria-label="Photos Search Navigation">
                <ul class="pagination justify-content-end mt-2">
                  <li class="page-item">
                    <a class="page-link" href="javascript:void(0)" tabindex="-1" aria-label="Previous">
                      Prev
                    </a>
                  </li>
                  <li class="page-item active">
                    <a class="page-link" href="javascript:void(0)">1</a>
                  </li>
                  <li class="page-item">
                    <a class="page-link" href="javascript:void(0)">2</a>
                  </li>
                  <li class="page-item">
                    <a class="page-link" href="javascript:void(0)">3</a>
                  </li>
                  <li class="page-item">
                    <a class="page-link" href="javascript:void(0)">4</a>
                  </li>
                  <li class="page-item">
                    <a class="page-link" href="javascript:void(0)" aria-label="Next">
                      Next
                    </a>
                  </li>
                </ul>
              </nav>
              <!-- END Pagination -->
            </div>
          </div>
          <!-- END All Products -->


        </div>
        <!-- END Page Content -->



    @endsection