{{ template "widget-base.html" . }}

{{ define "widget-content-classes" }}widget-content-frameless{{ end }}

{{ define "widget-content" }}
<div class="carousel-container">
    <div class="cards-horizontal carousel-items-container">
        {{ range .Posts }}
        <div class="card widget-content-frame relative">
            {{ if ne "" .ThumbnailUrl }}
            <div class="reddit-card-thumbnail-container">
                <img class="reddit-card-thumbnail" loading="lazy" src="{{ .ThumbnailUrl }}" alt="">
            </div>
            {{ end }}
            <div class="padding-widget flex flex-column grow relative">
                {{ if ne "" .TargetUrl }}
                <a class="color-highlight size-h5 text-truncate visited-indicator" href="{{ .TargetUrl }}" target="_blank" rel="noreferrer">{{ .TargetUrlDomain }}</a>
                {{ else }}
                <div class="color-highlight size-h5 text-truncate">/r/{{ $.Subreddit }}</div>
                {{ end }}
                <a href="{{ .DiscussionUrl }}" class="text-truncate-3-lines color-primary-if-not-visited margin-top-7 margin-bottom-auto" target="_blank" rel="noreferrer">{{ .Title }}</a>
                <ul class="list-horizontal-text margin-top-7">
                    <li {{ dynamicRelativeTimeAttrs .TimePosted }}></li>
                    <li>{{ .Score | formatApproxNumber }} points</li>
                </ul>
            </div>
        </div>
        {{ end }}
    </div>
</div>
{{ end }}
