{{ define "main" }}
<article>
    <header class="article-header">
        {{ if .Params.banner }}
        <div class="article-banner">
            <img src="{{ .Params.banner }}" alt="{{ .Title }} banner" class="case-detail-banner" />
            {{ if .Params.image }}
            <img src="{{ .Params.image }}" alt="{{ .Title }} logo" class="case-detail-logo-overlay" />
            {{ end }}
        </div>
        {{ else if .Params.image }}
        <img src="{{ .Params.image }}" alt="{{ .Title }} logo" class="case-detail-logo" />
        {{ end }}
        <h1>{{ .Title }}</h1>
        {{ if .Description }}
        <p class="lead">{{ .Description }}</p>
        {{ end }}
        {{ if .Params.url }}
        <p><strong>URL:</strong> <a href="{{ .Params.url }}" target="_blank">{{ .Params.url }}</a></p>
        {{ end }}
        {{ if .Date }}
        <p><small>Last updated: {{ .Date.Format "January 2, 2006" }}</small></p>
        {{ end }}
        <div class="tags-and-button">
            {{ if .Params.external_url }}
            <div class="article-external-button"><a href="{{ .Params.external_url }}" target="_blank" class="btn">Visit Website</a></div>
            {{ end }}
            {{ if .Params.tags }}
            <div class="tags">
                {{ range .Params.tags }}
                <a href="/{{ $.Section }}/?tag={{ . | urlize }}" class="tag">{{ . }}</a>
                {{ end }}
            </div>
            {{ end }}
        </div>
    </header>
    
    <div class="article-content">
        {{ .Content }}
    </div>
</article>

{{ partial "explore-e2c.html" . }}

{{ end }}
