KeJunMao/jekyll-theme-mdui

<style>
.k-post-media {
    display:block
    cursor: pointer;
    max-height: 245px;
    min-height: 245px;
    background-position: 50% 50%;
    background-size: cover;
    background-color: white;
}
.k-post-media .mdui-card-primary-title a {
    text-decoration: none;
}
</style>
{% include content/component/lazyload.html %}
<div id="postpage" class="mdui-container k-container">
    <div class="k-posts-list"></div>
    <div class="mdui-row">
        <div class="mdui-col-sm-12 k-page-col">
            <div class="mdui-card k-postcontent">
                {% if page.img == "" or page.img == null %}
                <div class="mdui-card-media mdui-ripple k-post-media mdui-valign k-noimg">
                    <h1><a>{{page.title}}</a></h1>
                </div>
                {% else %}
                <div class="mdui-card-media k-post-media" style="background-image: url({{page.img}});">
                    <div class="mdui-card-media-covered mdui-card-media-covered-gradient">
                        <div class="mdui-card-primary">
                            <h1 class="mdui-card-primary-title"><a class="mdui-text-color-white-text">{{page.title}}</a></h1>
                            {% if page.describe != null %}
                            <div class="mdui-card-primary-subtitle">
                                {{page.describe}}
                            </div>
                            {% endif %}
                        </div>
                    </div>
                </div>
                {% endif %}
                <div class="mdui-card-header">
                    <div class="mdui-card-menu">
                    {% include content/component/qrcode.html %}
                    {% include content/component/sns_share.html %}
                    </div>
                    {% if site.data.site.many_authors == true %}
                    {% if page.author != null %}
                    {% assign author = site.data.authors[page.author] %}
                    <img class="mdui-card-header-avatar" src="{{author.avatar}}" />
                    <div class="mdui-card-header-title">{{author.name}}</div>
                    {% else %}
                    <img class="mdui-card-header-avatar" src="{{site.data.site.img.avatar}}" />
                    <div class="mdui-card-header-title">{{site.author}}</div>
                    {% endif %}
                    {% else %}
                    <img class="mdui-card-header-avatar" src="{{site.data.site.img.avatar}}" />
                    <div class="mdui-card-header-title">{{site.author}}</div>
                    {% endif %}
                    <div class="mdui-card-header-subtitle k-page-date" date="{% if page.lastupdate != null %}{{page.lastupdate | date: "%b %-d, %Y"}}{% else %}{{page.date | date: "%b %-d, %Y"}}{% endif %}">{{ page.date | date: "%b %-d, %Y" }}</div>
                </div>
                {% include content/component/readtime.html %}
                {% include content/component/lastupdate.html %}
                <div class="mdui-card-content mdui-typo">
                    {{ content }}
                </div>
                {% include comment/comment.html %}
            </div>
        </div>
    </div>
    <br>
</div>
{% include content/component/highlight.html %}