---
layout: default
title: Category
permalink: /category/
icon: octicon-list-unordered
isNavItem: true
styles : [article-list.css,category.css]
scripts: [category.js]
---

<div class="row index">


    <div class="col-sm-10 col-sm-offset-1 col-lg-9 col-lg-offset-1_5">

        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                <span class="octicon octicon-list-unordered"></span>&nbsp;Categories
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                <li>
                    <a href="javascript:void(0);" class="categories-item" cate="All">
                        All&nbsp;<span class="categories-badge"> {{site.posts | size}}</span>
                    </a>
                </li>
                {% for category in site.categories %}
                <li>
                    <a href="javascript:void(0);" class="categories-item" cate="{{ category | first }}">
                        {{ category | first }}&nbsp;<span class="categories-badge">{{ category | last | size }}</span>
                    </a>
                </li>

                {% endfor %}
            </ul>
        </div>


        <div>
            <section class="category-slice" post-cate="All">
                {% for post in site.posts %}
                <article>
                    <header>
                        <a href="{{ site.baseurl | prepend: site.url  }}/archive/#{{ post.date | date: '%Y-%m-%d' }}"><span class="octicon octicon-calendar"></span>&nbsp;<span>{{ post.date | date: "%Y-%m-%d" }}</span></a>
                    </header>
                    <div class="module">
                        <a class="title" href="{{ post.url | prepend: site.baseurl | prepend: site.url }}">
                            {{ post.title }}
                        </a>
                        <p>{% if post.excerpt.size > 32 %}{{ post.excerpt }}{% else %}{{ post.content | strip_html | strip_newlines | truncate: 160 }}{% endif %}</p>
                        <a class="readmore" href="{{ post.url | prepend: site.baseurl | prepend: site.url }}">Read More</a>
                        <footer>
                            {% for tag in post.tags %}
                            <a class="word-keep" href="{{ site.baseurl | prepend: site.url }}/tags/#{{ tag }}"><span class="octicon octicon-tag"></span>&nbsp;{{ tag }}</a>
                            {% endfor %}
                      <span class="word-keep pull-right">
                          <a href="{{ post.url | prepend: site.baseurl | prepend: site.url }}#post-comment"><span class="octicon octicon-comment"></span>&nbsp;Comment</a>
                          <a href="{{ post.url | prepend: site.baseurl | prepend: site.url }}#post-share"><span class="octicon octicon-file-symlink-file"></span>&nbsp;Share</a>
                      </span>
                        </footer>
                    </div>
                </article>
                {% endfor %}
            </section>


            {% for category in site.categories %}
            <section class="category-slice" post-cate="{{category | first}}">
                {% for posts in category  %}
                {% for post in posts %}
                {% if post.url %}
                <article>
                    <header>
                        <a href="{{ site.baseurl | prepend: site.url  }}/archive/#{{ post.date | date: '%Y-%m-%d' }}"><span class="octicon octicon-calendar"></span>&nbsp;<span>{{ post.date | date: "%Y-%m-%d" }}</span></a>
                    </header>
                    <div class="module">
                        <a class="title" href="{{ post.url | prepend: site.baseurl | prepend: site.url }}">
                            {{ post.title }}
                        </a>
                        <p>{% if post.excerpt.size > 32 %}{{ post.excerpt }}{% else %}{{ post.content | strip_html | strip_newlines | truncate: 160 }}{% endif %}</p>
                        <a class="readmore" href="{{ post.url | prepend: site.baseurl | prepend: site.url  }}">Read More</a>
                        <footer>
                            {% for tag in post.tags %}
                            <a class="word-keep" href="{{ site.baseurl | prepend: site.url }}/tags/#{{ tag }}"><span class="octicon octicon-tag"></span>&nbsp;{{ tag }}</a>
                            {% endfor %}
                          <span class="word-keep pull-right">
                              <a href="{{ post.url | prepend: site.baseurl | prepend: site.url }}#post-comment"><span class="octicon octicon-comment"></span>&nbsp;Comment</a>
                              <a href="{{ post.url | prepend: site.baseurl | prepend: site.url }}#post-share"><span class="octicon octicon-file-symlink-file"></span>&nbsp;Share</a>
                          </span>
                        </footer>
                    </div>
                </article>
                {% endif %}
                {% endfor %}
                {% endfor %}
            </section>
            {% endfor %}
        </div>

    </div>
</div>