move API to bottom

site/templates/component.html

@@ -17,5 +17,6 @@
   {%- if post.meta.template === 'component' && !post.meta.nodemos %}
   {%- include "demos.html" %}
   {%- endif %}
+  <div class="api-container markdown"></div>
 </section>
 {% endblock %}

site/templates/demos.html

@@ -8,7 +8,7 @@
   </a>
   {%- endif %}
 </h2>
-<div class="code-boxes clearfix">
+<div class="code-boxes">
   {%- set items = resource.pages|find_demo_in_component(post.meta.directory) %}
   {%- if post.meta.cols == 1 %}
     <div class="code-boxes-col-1-1">

static/script.js

@@ -33,6 +33,10 @@ $(function() {
       $(this).parent().parent().addClass('expand');
     }
   });
+
+  // 移动 API 文档到演示下方
+  $('.markdown #api').nextAll().andSelf().appendTo('.api-container');
+
   $.easing['jswing'] = $.easing['swing'];
   $.extend($.easing,{
     easeInCirc: function (x, t, b, c, d) {
@@ -46,6 +50,7 @@ $(function() {
       return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
     }
   });
+
   var navFunc = {
     navStrArr: [],
     init: function() {

static/style.css

@@ -1671,6 +1671,10 @@ footer ul li > a {
   color: #3B4357;
 }
 
+.code-boxes {
+  overflow: hidden;
+}
+
 .code-boxes-col-1-1 {
   width: 80%;
 }