archives.html

#include('./partial/header.html', {title: '文章归档'})
  <div id="container" class="container"> 
   <div class="row"> 
    <section id="main" class="col-md-8"> 
     <article> 
      <div class="kratos-hentry kratos-post-inner clearfix"> 
       <div class="kratos-post-content"> 
        <div id="archives"> 
         <h2 class="title-h2" style="text-align:center;font-size:18pt">文章归档</h2> 
         <p style="text-align:center"><span style="color:#999">文章归档页。点击月份可展开文章~<a href="javascript:;" id="al_collapse" style="color:#999;display:none">[折叠全部]</a><a href="javascript:;" id="al_expand" style="color:#999">[展开全部]</a></span></p> 
         <hr /> 
         <h4>Tags</h4> 
         <div class="arc-tag">
		#for(tag : tags())
          <a href="/tag/${tag.name}/" class="tag-cloud-link tag-link tag-link-position" style="font-size: 14px;">${tag.name}</a>
		#end
         </div>
		 #for(archive : archives)
         <h4 class="al_year">${fmtdate(archive.date, 'yyy')}年</h4>
         <div class="al_mon_list">
          <section id="mon" style="overflow:hidden">
           <div class="al_mon">
			◉ ${fmtdate(archive.date, 'MM')}月
           </div>
           <div class="mon_arc" style="display:none">
		   #for(article : archive.articles)
            <div class="arc-t">
             <div class="arc-tile">
              <a href="${(permalink())}">${title()}</a>
              <br />
              <span>${created('yyyy-MM-dd')}</span>
             </div>
            </div>
			#end
           </div>
          </section>
         </div>
		#end
        </div> 
        <hr /> 
       </div>
      </div>
     </article>
    </section>
	#include('./partial/sidebar.html')
   </div>
        <script type="text/javascript">
            $('#archives section#mon').each(function(){
            var num=$(this).find('.arc-t').size();
            var text=$(this).find('.al_mon').text();
				$(this).find('.al_mon').html(text+'（'+num+' 篇文章）');
            });
            $('#archives h4.al_year').click(function(){
                $(this).next().slideToggle(400);return false;
            });
            $('#archives div.al_mon').click(function(){
                $(this).next().slideToggle(400);return false;
            });
            $('#al_collapse').click(function(){
                $('.mon_arc').hide(400);$('#al_collapse').hide();$('#al_expand').show();
            });
            $('#al_expand').click(function(){
                $('.mon_arc').show(400);$('#al_expand').hide();$('#al_collapse').show();
            });
		</script>
</div>
</div>
#include('./partial/footer.html')