@model CoreWiki.Models.ArticleCommentListViewModel

@foreach (var item in Model.Comments)
{
    <div class="flex flex-col border rounded mb-3">
        <div class="bg-gray-50 p-2 border-b flex items-center">
            <img class="me-2" width="40" height="40" src="https://gravatar.com/avatar/@item.GravatarHash?d=identicon" alt="avatar"/>
            <div class="d-flex flex-column">
                <span class="text-blue-600">@item.DisplayName</span>
                <div class="flex">
                    <span class="text-sm text-gray-500">Commented on <span data-value="@item.Submitted" class="timeStampValue text-muted">@item.Submitted</span></span>
                </div>
            </div>
        </div>
        <div class="py-4 px-2">
            <markdown>@item.Content</markdown>
        </div>
    </div>
}
@if (Model.Comments.Count() == 10)
{
    <div class="h-100 align-items-center d-flex" hx-get hx-page="Details" hx-route-slug="@Model.Slug" hx-route-pageNumber="@(Model.PageNumber + 1)" hx-swap="outerHTML" hx-trigger="intersect once">
        <div id="spinner" class="htmx-indicator spinner-border"></div>
    </div>
}