@extends('layouts.front')

@section('content')
	<div id="news" class="page">

		{{--*************************
		* Titre de la page
		*************************--}}
	  <div class="titre_section">
      <h1>{{trans('menu.actu')}}</h1>
    </div>


		{{--*************************
		* Contenu de la page
		*************************--}}
    <div class="content">
	    
	    {{-- ========================================================
	    * Zone de gauche où se trouvent les news principales
	    ======================================================== --}}    
	    <div class="news_generales">
				@foreach ($news_generale as $news)
					<div class="newsitem" id="news{{$news->id}}">
						{{--*************************
						* La date et l'image
						*************************--}}
						<div class="date-image">
							<div class="date">
								{!!$news->created_at!!}
							</div>
						
							@if ($news->url!="")
								<div class="image">
									<img src="{{$news->url}}" alt="{{$news->titre()}}">
								</div>
							@endif
						</div>

						{{--*************************
						* Le contenu de la news
						*************************--}}
						<div class="news_generale_text">
							<div class="news__title">{{$news->titre()}}</div>
							
							{{-- le texte raccourci pour la version mobile --}}
							<p class="news__text ellipsis" :class="{'newsOpen': newsOpen, 'newsClose': !newsOpen}">
								{!!nl2br(str_limit(
									$news->body(), 
									75,
									$end = '... <span class="openNews" @click="newsOpen = true">'.trans('news.suite').'</span>'))
								!!}
							</p>
							
							{{-- le texte complet --}}
							<p class="news__text fullText" :class="{'newsOpen': newsOpen, 'newsClose': !newsOpen}">{!!nl2br($news->body())!!}</p>
						</div>
					</div>
				@endforeach
	    </div>

	    
	    {{-- ========================================================
	    * Zone de droite où se trouvent les news d'évènements
	    ======================================================== --}}
	    <div class="events">
	    	<div class="introduction">
					<h2>{{trans('news.next-events')}}</h2>
				</div>

				@foreach ($events as $event)
					<div class="event">
						{{-- Image --}}
						@if($event->url!="")
							<img src="{{$event->url}}" alt="{{$event->titre()}}">
				 		@endif


						{{-- Titre et texte --}}
						<div class="news__title">{{$event->titre()}}</div>
						<p class="news__body">{!!nl2br($event->body())!!}</p>
					</div>
				@endforeach


				{{--*************************
				* Inscription à la newsletter
				*************************--}}
				<div class="newsletter">
					<a href="https://my.sendinblue.com/users/subscribe/js_id/s93/id/1" target="_blank">
						{{trans('news.abo-newsletter')}}
					</a>
				</div>				
	    </div>
    </div>
	</div>

@endsection