@page
@model CoreWiki.Pages.All

@{
    ViewData["Title"] = "All articles";
}

<h1>All articles</h1>

<partial name="_articleList" model="Model.Articles"/>

<div class="col-md-12 flex">
    <nav class="flex-1">
        <ul class="flex -space-x-px">
            @for (var i = 1; i <= Model.TotalPages; i++)
            {
                var i1 = i;
                <li>
                    <a class="block p-3 text-sm leading-tight border border-gray-300 bg-white @(i1 == Model.PageNumber ? "bg-blue-100 text-blue-700" : "hover:bg-gray-50")"
                       asp-page="All"
                       asp-route-PageNumber="@i1"
                       asp-route-PageSize="@Model.PageSize">@i1</a>
                </li>
            }
        </ul>
    </nav>
    <form class="ml-auto" method="get" asp-page="All">
            <input hidden name="@nameof(Model.PageNumber)" value="@Model.PageNumber"/>
            <select class="bg-gray-50 border border-gray-300 text-gray-900 text-sm focus:ring-blue-500 focus:border-blue-500 block w-full p-3" asp-for="@Model.PageSize" onchange="this.form.submit()">
                <option value="2">2</option>
                <option value="10">10</option>
                <option value="25">25</option>
                <option value="50">50</option>
            </select>
        </form>
</div>