<div class="col-md-3 col-lg-3 col-sm-13 col-xs-13 aside visible-md visible-lg">

<div class="row">

<div class="col-md-2 col-xs-2 aside1">

<br>

<a class="pjaxlink" href="/"><img src="{{ site.gavatar }}" class="img-ronuded avatar" style="border-width:0px; border-color:#000"></a>

<br><br><br><br>

<ul class="nav nav-pills nav-stacked" id="ul_category">

<!-- collect all categories -->

{% for category in site.categories %}

<li><a href="#{{ category | first }}" data-toggle="tab">{{ category[0] }}</a></li>

{% endfor %}

<li><a data-toggle="tab" href="#tags">{{ site.locals.tags }}</a></li>

</ul>

<div class="aside1_bottom">

<ul class="nav nav-pills nav-stacked" id="ul_about">

<li><a class="pjaxlink" href="/pages/archive.html">{{ site.locals.archive }}</a></li>

<li><a class="pjaxlink" href="/pages/about.html">{{ site.locals.about }}</a></li>

</ul>

<table class="table table-condensed">

<tr>

<td><a href="mailto:{{ site.author.email }}"><i class="fa fa-envelope-o fa-lg" style="color:#fff;"></i></a></td>

<td><a href="http://github.com/wcccode" target="_blank"><i class="fa fa-github fa-lg" style="color:#fff;"></i></a></td>

</tr>

</table>

</div>

</div>

<div class="col-md-10 col-xs-10 aside2" id="div_tab">

<div class="row">

<div class="tab-content">

{% for category in site.categories %}

<div class="tab-pane" id="{{ category[0] }}">

<div class="list-group">

<!-- collect all articles under this category -->

{% for post in category[1] %}

<a href="{{ post.url }}" class="list-group-item-terry pjaxlink">{{post.title}}</a>

{% endfor %}

</div>

</div>

{% endfor %}

<div class="tab-pane" id="tags">

<div class="panel-group" id="accordion">

<!-- collect all tags -->

{% for tag in site.tags %}

<div class="panel panel-info panel-terry">

<div class="panel-heading">

<h4 class="panel-title">

<a data-toggle="collapse" data-toggle="collapse" data-parent="#accordion" href="#{{ tag[0] }}">{{ tag[0] }}</a>

<span class="badge pull-right">{{ tag[1].size }}</span>

</h4>

</div>

<div id="{{ tag[0] }}" class="panel-collapse collapse">

<!-- collect all articles with this tag -->

{% for post in tag[1] %}

<a href='{{ post.url }}' class="list-group-item-terry pjaxlink">

{{post.title}}

</a>

{% endfor %}

</div>

</div>

{% endfor %}

</div>

</div>

</div>

</div>

</div>

</div>