@extends('layouts.master')

@section('page-title', 'Leaderboards')

@section('meta_description', 'Check the standings of the competition at the No Agenda Art Generator.')

@section('page-top')
<section class="inner-page-banner bg-2 bg-image">
    <div class="container">
        <div class="inner text-center">
            <h1 class="title">Leaderboards</h1>
            <nav class="mt-4">
                <ol class="breadcrumb justify-content-center">
                    <li class="breadcrumb-item"><a href="/">Home</a></li>
                    <li class="breadcrumb-item active">Leaderboards</li>
                </ol>
            </nav>
        </div>
    </div>
</section>
@endsection
@section('page-content')
<section class="pt-120 pb-90">
    <div class="container">
        <div class="row">
            <ul class="nav custom-tabs mb-4">
                <li><a class="active" data-bs-toggle="tab" href="#all-time">All Time</a></li>
                <li><a data-bs-toggle="tab" href="#rolling-annual">Rolling Annual</a></li>
                <li><a data-bs-toggle="tab" href="#rolling-six-months">Rolling Six Months</a></li>
                <li><a data-bs-toggle="tab" href="#rolling-ninety-days">Rolling 90 Days</a></li>
            </ul>
        </div>
    </div>
    <div class="container tab-content">
        <div class="tab-pane fade show active" id="all-time">
            <div class="row">
                @foreach($leaderboardAllTime as $leaderboardArtist)
                    @include('home.leaderboard.card')
                @endforeach
            </div>
        </div>
        <div class="tab-pane fade" id="rolling-annual">
            <div class="row">
                @foreach($leaderboardPastTwelveMonths as $leaderboardArtist)
                    @include('home.leaderboard.card')
                @endforeach
            </div>
        </div>
        <div class="tab-pane fade" id="rolling-six-months">
            <div class="row">
                @foreach($leaderboardRollingSixMonths as $leaderboardArtist)
                    @include('home.leaderboard.card')
                @endforeach
            </div>
        </div>
        <div class="tab-pane fade" id="rolling-ninety-days">
            <div class="row">
                @foreach($leaderboardRollingNinetyDays as $leaderboardArtist)
                    @include('home.leaderboard.card')
                @endforeach
            </div>
        </div>
    </div>
</section>
@endsection