@extends('layouts.page')

@section('meta')

    <meta property="og:url"           content="{{url()->full()}}" />
    <meta property="og:type"          content="website" />
    @if(isset($news))
        <meta property="og:title"         content="{!! str_replace("''", '“', str_replace('"', '“', $news->title)) !!}" />
        <meta property="og:description"   content="{{strip_tags($news->text)}}" />
        <meta property="og:image"         content="{{env('APP_URL')}}/files/news/{{$news->image}}" />
        <meta property="og:image:secure_url"         content="{{env('APP_URL')}}/files/news/{{$news->image}}" />
    @else
        <meta property="og:title"         content="{{$page->title}}" />
        <meta property="og:description"   content="" />
        <meta property="og:image"         content="{{url()->current()}}/files/pages/{{$page->image}}" />
    @endif

@stop

@section('banner_top')

    @include('partials.page_adv', ['advs' => $page->getAdvs(), 'position' => 'Sopra'])

@stop

@section('content')
<style>
    .single-page p{
        margin-left:15px!important;
    }
</style>

    <div class="container" style="min-height: 450px;margin-top:50px;">
        <div class="row">

            <div class="col-sm-9 single-page">

                @if(isset($news))
                    @if($news->image != '')
                    <div class="row" style="margin-right: 15px;">
                        <img src="/files/news/{{$news->image}}" align="left" class="img-responsive" style="margin-left:15px;">
                        <h1 style="font-size:30px;margin-left:15px;">{{$news->title}}</h1>
                        <p>{!!$news->text!!}</p>
                    </div>
                    @endif
                    <p style="margin-left:0!important;">{{date("d/m/Y H:i", strtotime($news->date))}}</p>
                    <h5>{!!$news->text_short!!}</h5>

                    @if(sizeof($aImages) > 0)
                        <br>
                        <div class="title-section">
                            <h1 style="width: 90%"><span>Galleria</span></h1>
                        </div>
                    @endif

                    <div class="row gallery">
                        @foreach($aImages as $idx => $img)
                            <div class="col-sm-2 ">
                                <a href="/files/news/{{$img}}"><img src="/files/news/{{$img}}" class="img-responsive"></a>
                            </div>
                        @endforeach
                    </div>

                    @if($news->video != '')
                        <br>
                        <div class="title-section">
                            <h1 style="width: 90%"><span>Video</span></h1>
                        </div>
                        <div class="row" style="margin-top:30px">
                            <iframe width="560" height="315" src="{{$news->video}}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                        </div>
                    @endif

                @endif

                <div class="fb-share-button"  data-href="{{url()->full()}}"  data-layout="button_count"></div>
            </div>

            <div class="col-sm-3 text-center" >

                @if ($page->image != '')
                    <br><img src="/files/pages/{{$page->image}}" style="max-width:100px" />
                @endif
                <h4>{{$page->title}}</h4>
                @if($page->web != '')
                    <p style:><a href="{{$page->web}}">{{$page->web}}</a></p>
                @endif
                @if($page->email != '')
                    <p><a href="mailto:{{$page->email}}">{{$page->email}}</a></p><br />
                @endif
                @if($page->facebook != '')
                    <a href="{{$page->facebook}}" class="fa fa-facebook" style="background: #3B5998;padding:10px;color:white;border-radius: 50%;width:35px; margin: 10px;"></a>
                @endif
                @if($page->twitter != '')
                    <a href="{{$page->twitter}}" class="fa fa-twitter"  style="background: #55ACEE;padding:10px;color:white;border-radius: 50%; margin: 10px;"></a>
                @endif
                @if($page->youtube != '')
                    <a href="{{$page->youtube}}" class="fa fa-youtube"  style="background: #bb0000;padding:10px;color:white;border-radius: 50%; margin: 10px;"></a>
                @endif
                @if($page->instagram != '')
                    <a href="{{$page->instagram}}" class="fa fa-instagram" style="background: #125688;padding:10px;color:white;border-radius: 50%; margin: 10px;"></a>
                @endif

                <div class="item text-left" style="margin-top:20px;">

                    <div class="title-section">
                        <h1><span class="no-border">ALTRE NOTIZIE</span></h1>
                    </div>

                    <ul class="list-posts">

                        @foreach($elements as $e)
                            <li>
                                <div class="row">
                                    <div class="post-content col-md-12">
                                        <a href="/{{$e->slug}}"><img src="/files/news/{{$e->image}}" alt=""></a>
                                        <ul class="post-tags">
                                            <li><i class="fa fa-clock-o"></i>{{date("d/m/Y", strtotime($e->date))}}</li>
                                        </ul>
                                        <h2 style="font-size: 14px"><a href="/{{$e->slug}}">{{strlen($e->title) <= 40 ? $e->title : substr($e->title, 0, 40) . '...'}}</a></h2>
                                    </div>
                                </div>

                            </li>
                        @endforeach

                    </ul>

                    <div class="center-button">
                        <a href="/{{$page->slug}}/elenco">ARCHIVIO NEWS</a>
                    </div>
                    <br><br>
                    <div class="title-section">
                        <h4><span class="no-border">SEGUI CALCIO A 5 ANTEPRIMA SU</span></h4>
                    </div>

                    <div class="row">
                        <div class="col-md-2">
                            <a href="https://it-it.facebook.com/calcioa5anteprima/"><img src="/images/facebook.png"></a>
                        </div>
                        <div class="col-md-2">
                            <a href="https://twitter.com/ca5anteprima"><img src="/images/twitter.png"></a>
                        </div>
                        <div class="col-md-2">
                            <a href="#"><img src="/images/instagram.png"></a>
                        </div>
                    </div>

                </div>
            </div>

        </div>
    </div>

    <br><br>

@stop

@section('banner_bottom')

    @include('partials.page_adv', ['advs' => $page->getAdvs(), 'position' => 'Sotto'])

@stop

@section('extra_css')

<style>
    .fa-p {
      padding: 15px;
      font-size: 15px;
      width: 20px;
      text-align: center;
      text-decoration: none;

      border-radius: 50%;
    }

    .fa-p:hover {
        opacity: 0.7;
    }

    .facebook {
      background: #3B5998;
      color: white;
    }

    .twitter {
      background: #55ACEE;
      color: white;
    }

    .fa-youtube-p {
      background: #bb0000;
      color: white;
    }

    .fa-instagram-p {
      background: #125688;
      color: white;
    }

    </style>

@stop

@section('extra_js')

    <script>

        $(function () {




            //$('.carouselSopra2').carousel()
/*
            $('.carousello').owlCarousel({
                loop:true,
                nav:true
            })
  */

        });

    </script>

@stop