* change page section toggle UI.

docs/2/css/doc.css

@@ -1569,7 +1569,7 @@ body.query-enabled[data-query='icons'] #grid .card.open.section-preview-show .se
 }
 #pageTogger {
   position: absolute;
-  top: 18px;
+  bottom: -36px;
   left: 35px;
   z-index: 10;
   width: 19px;
@@ -1604,7 +1604,7 @@ body.query-enabled[data-query='icons'] #grid .card.open.section-preview-show .se
   width: 9px;
   height: 1px;
 }
-#pageBody.collapsed #pageTogger:before {
+#page.page-collapsed #pageTogger:before {
   display: block;
 }
 body.compact-mode #header,

docs/2/index.html

@@ -63,13 +63,13 @@
               <i class="icon icon-star"></i>
               <h2><a class="name" href="###">图标</a></h2>
               <small class="text-muted desc">使用和查找图标</small>
+              <button type="button" class="btn btn-link" id="pageTogger"></button>
             </div>
             <button data-toggle="tooltip" title="最大化" type="button" class="btn btn-link path-max-btn path-btn"><i class="path-1"></i></button>
             <button data-toggle="tooltip" title="关闭（ESC）" type="button" class="btn btn-link path-close-btn path-btn"><i class="path-1"></i></button>
           </div>
           <div id="pageBody" class="scrollbar-hover">
             <div class="text-muted loader"><i class="icon icon-spin icon-spinner"></i> 正在拼命加载中...</div>
-            <button type="button" class="btn btn-link" id="pageTogger"></button>
             <div id="pageContent"></div>
             <nav></nav>
           </div>

src/js/doc.js

@@ -970,13 +970,13 @@
             var $setions = $pageContent.children('section');
             var sectionsCount = $setions.length, collapsedSectionCount = $setions.filter('.collapsed').length;
             if(collapsedSectionCount === 0) {
-                $pageBody.removeClass('collapsed');
+                $page.removeClass('page-collapsed');
             } else if(collapsedSectionCount === sectionsCount) {
-                $pageBody.addClass('collapsed');
+                $page.addClass('page-collapsed');
             }
         } else {
-            $pageBody.toggleClass('collapsed');
-            if($pageBody.hasClass('collapsed')) {
+            $page.toggleClass('page-collapsed');
+            if($page.hasClass('page-collapsed')) {
                 $pageContent.children('section').addClass('collapsed');
             } else {
                 $pageContent.children('section').removeClass('collapsed');
@@ -1110,7 +1110,7 @@
         }).on('mouseleave', 'section > header > h3', function(){
             $(this).closest('section').removeClass('hover');
         });
-        $pageBody.on('click', '#pageTogger', function(){
+        $page.on('click', '#pageTogger', function(){
             togglePageSection();
         });
 

src/less/doc.less

@@ -1306,7 +1306,7 @@ body.query-enabled {
 }
 #pageTogger {
   position: absolute;
-  top: 18px;
+  bottom: -36px;
   left: 35px;
   width: 19px;
   height: 19px;
@@ -1341,7 +1341,7 @@ body.query-enabled {
     height: 1px;
   }
 }
-#pageBody.collapsed {
+#page.page-collapsed {
   #pageTogger:before {
     display: block;
   }