@extends('layouts.app')

@section('content')
<div class="container" id="index">

<h1>Most surprising anime</h1>
@foreach($surprising_anime as $anime)
	<div class="row">
		<div class="col-sm-4 col-lg-3">
			<a href="/anime/{{ $anime->mal_id}}" title="Click for more data">
				<img src="{{ $anime->image_url }}" class="img-fluid" style="margin-bottom: 10px;">
			</a>
		</div>
		<div class="col-sm-8 col-lg-9">
			<h2>{{ $anime->title_pref }}</h2>
			Score diff: {{ $anime->score_today - $anime->score_begin }} Points
			<br>
			First score: {{ $anime->score_begin }}
			<br>
			Score now: {{ $anime->score_today }}
			<br>
			<a href="/anime/{{ $anime->mal_id}}" title="Click for more data">
				Click for more data
			</a>
		</div>
	</div>
@endforeach

{{ $surprising_anime ->links() }}
</div>
@endsection