layout: default
{% if page.image %}
{% capture page_image %} {{ page.image | relative_url | default: '' }} {% endcapture %} {% capture page_image_alt %} {{ page.image_alt | default: 'page image default alt' }} {% endcapture %} {% capture page_image_caption %} {{ page.image_caption | default: '' }} {% endcapture %}
{% endif %}
{% assign blog_author = site.data.blog.authors %} {% capture bl_au_avatar %} {{ '/assets/images/' | relative_url | append: blog_author.avatar }} {% endcapture %}
{% capture bl_au_av_alt %} {{ blog_author.name }} avatar. {% endcapture %}
<section class=“container mt-3 blog-post”>
<div class="row"> <div class="col-md-8 pb-3"> {% if page.show_hero and page_image %} <!-- post hero --> <figure class="figure"> <img class="img-fluid shadow-sm rounded mb-2 blog-post-hero-img" src="{{ page_image | strip }}" alt="{{ page_image_alt | strip }}"> <figcaption class="figure-caption text-center">{{ page_image_caption | strip }}</figcaption> </figure> {% endif %} <!-- post title --> <h1>{{ page.title }}</h1> <p class="font-italic text-muted">{{ page.date | date: "%b %-d, %Y" }}</p> {% if page.show_author %} <!-- post author, share --> <div class="row align-items-center py-2 border-top border-bottom blog-post-author"> <div class="col-auto pr-0 pb-1"> <img src="{{ bl_au_avatar | strip }}" alt="{{ bl_au_av_alt | strip }}" class="rounded-circle shadow-sm blog-post-author-avatar "> </div> <div class="col pr-0 pb-1"> <p class="blog-post-author-name p-0 m-0">{{ blog_author.name }}</p> <p class="blog-post-author-headline p-0 m-0">{{ blog_author.headline }}</p> </div> <div class="col-auto justify-content-end blog-post-author-follow"> <div class="dropdown"> <button class="btn btn-outline-info dropdown-toggle" type="button" id="followMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Follow</button> <div class="dropdown-menu dropdown-menu-right" aria-labelledby="followMenuButton"> {% for follow in blog_author.follow %} <a class="dropdown-item pb-2 text-info" href="{{ follow.url }}"><i class="{{ follow.icon }}"></i>{{ follow.label }}</a> {% endfor %} </div> </div> </div> </div> {% endif %} {% if page.show_toc %} <!-- post TOC --> <nav class="border mt-3 d-inline-block rounded"> <div class="p-1 bg-info text-white"> <i class="fas fa-list"></i> <span class="pl-1">Contents</span> </div> <div class="blog-post-toc m-1"> {% include toc.html html=content %} </div> </nav> {% endif %} <!-- Post content --> <article class="mt-3 blog-post-article"> {{ content }} </article> {% if page.share %} <div class="blog-post-social-share"> {% include social-share.html %} </div> {% endif %} </div> <!-- blog post sidebar --> <div class="col-md-4 blog-post-sidebar"> {% include blog-post-sidebar.html %} </div> </div> <div class="row mt-3"> <div class="col-md-8"> {% if page.show_comments %} <!-- Post comments --> {%- include comments.html -%} {% endif %} </div> </div>
</section>