<header class="panel-cover {% if page.layout == 'post' or page.layout == 'page' %}panel-cover--collapsed{% endif %}" style="background-image: url('/images/background-cover.jpg')">

<div class="panel-main">

<div class="panel-main__inner panel-inverted">

<div class="panel-main__content">

<!-- 头像效果-start -->

<div class="ih-item circle effect right_to_left">

<a href="/about" title="前往 {{ site.title }} 的主页" class="blog-button">

<div class="img"><img src="/images/avatar.jpg" alt="img"></div>

<div class="info">

<div class="info-back">

<h2>

{% if site.avatarTitle %}

{{site.avatarTitle}}

{% endif %}

</h2>

<p>

{% if site.avatarDesc %}

{{site.avatarDesc}}

{% endif %}

</p>

</div>

</div>

</a>

</div>

<!-- 头像效果-end -->

<h1 class="panel-cover__title panel-title"><a href="/about" title="link to homepage for {{ site.title }}" class="blog-button">{{ site.title }}</a></h1>

{% if site.subtitle %}

<span class="panel-cover__subtitle panel-subtitle">{{site.subtitle}}</span>

{% endif %}

<hr class="panel-cover__divider" />

<p class="panel-cover__description">{{ site.description }}</p>

<hr class="panel-cover__divider panel-cover__divider--secondary" />

{% if site.welcome_message %}

<p class="panel-cover__description">{{ site.welcome_message }}</p>

{% endif %}

<div class="navigation-wrapper">

<div>

<nav class="cover-navigation cover-navigation--primary">

<ul class="navigation">

<li class="navigation__item"><a href="/about" title="{{site.blog_button.description}}" class="blog-button">{{site.blog_button.title}}</a></li>

{% for item in site.nav %}

<li class="navigation__item"><a href="{{item.url}}" title="{{item.description}}">{{item.title}}</a></li>

{% endfor %}

</ul>

</nav>

</div>

</div>

</div>

</div>

</div>

{% if site.cover_color %}

<div class="panel-cover--overlay cover-{{site.cover_color}}"></div>

{% else %}

<div class="panel-cover--overlay cover-disabled"></div>

{% endif %}

</div>