author.hbs

{{!< default}}

{{> header}}

<main id="site-main" class="site-main">
    {{#author}}
    {{!-- Everything inside the #author tags pulls data from the author --}}
        <header>
            {{> header-background background=@site.cover_image}} {{!--Special header-image.hbs partial to generate the background image--}}
            <div class="container py-5">
                <div class="row justify-content-center">
                    <div class="col-xl-8 col-md-10">
                        <div class="card card-body">
                            <div class="author-header d-flex p-lg-4">
                                {{#if profile_image}}
                                    <img class="avatar avatar-128 rounded-circle me-2" src="{{profile_image}}"
                                         alt="{{name}}"/>
                                {{else}}
                                    <span class="avatar avatar-128 rounded-circle me-2">{{> "icons/avatar"}}</span>
                                {{/if}}
                                <div class="author-header-content col pl-4 text-left">
                                    <h1 class="h1">{{name}}</h1>
                                    {{#if bio}}
                                        <h2 class="author-bio h5">{{bio}}</h2>
                                    {{/if}}
                                    <div class="author-meta">
                                        {{#if location}}
                                            <div class="author-location">{{location}}</div>
                                        {{/if}}
                                        <div class="author-stats pb-3">
                                            {{plural ../pagination.total empty='No posts' singular='% post'
                                                     plural='% posts'}}
                                        </div>
                                        <div class="nav">
                                            {{#if website}}
                                                <span class="author-social-link me-1"><a class="avatar avatar-32 rounded-circle bg-info text-white me-1 p-2" href="{{website}}"
                                                                                         target="_blank"
                                                                                         rel="noopener">{{> icons/themify/link}}</a></span>
                                            {{/if}}
                                            {{#if twitter}}
                                                <span class="author-social-link me-1"><a class="avatar avatar-32 rounded-circle bg-info text-white me-1 p-2" href="{{twitter_url}}"
                                                                                         target="_blank"
                                                                                         rel="noopener">{{> icons/themify/twitter-alt}}</a></span>
                                            {{/if}}
                                            {{#if facebook}}
                                                <span class="author-social-link me-1"><a class="avatar avatar-32 rounded-circle bg-info text-white me-1 p-2" href="{{facebook_url}}"
                                                                                         target="_blank"
                                                                                         rel="noopener">{{> icons/themify/facebook}}</a></span>
                                            {{/if}}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </header>
    {{/author}}

    <section class="container post-feed mt-5">
        <div class="row row-cols-1 row-cols-md-3">
            {{#foreach posts limit=9}}
                {{> "post-card"}}
            {{/foreach}}
        </div>
    </section>
</main>

{{> footer }}