* add style for classic layout.

docs/css/doc.css

 /*!
- * ZUI - v1.3.0 - 2015-05-06
+ * ZUI - v1.3.0 - 2015-05-10
  * http://zui.sexy
  * GitHub: https://github.com/easysoft/zui.git 
  * Copyright (c) 2015 cnezsoft.com; Licensed MIT
@@ -2585,5 +2585,61 @@ body.page-show[data-page-accent="purple"] #pageTogger:hover:after {
     display: none;
   }
 }
+body.layout-classic #heading {
+  display: none;
+}
+body.layout-classic #navbar {
+  top: 0;
+  left: 0;
+  width: 400px;
+  padding: 10px 0;
+  margin-bottom: 0;
+}
+body.layout-classic #navbar .navbar-header {
+  float: none;
+}
+body.layout-classic #navbar .navbar-toggle {
+  display: block;
+  float: right;
+  margin-right: 0;
+}
+body.layout-classic #navbar .navbar-collapse {
+  display: none!important;
+}
+body.layout-classic #navbar .navbar-collapse.in,
+body.layout-classic #navbar .navbar-collapse.collapsing {
+  display: block!important;
+  width: 140px;
+}
+body.layout-classic #navbar .navbar-collapse.in:before,
+body.layout-classic #navbar .navbar-collapse.collapsing:before {
+  right: 10px;
+}
+body.layout-classic #navbar .navbar-collapse.in > .navbar-right,
+body.layout-classic #navbar .navbar-collapse.collapsing > .navbar-right {
+  float: none!important;
+}
+body.layout-classic #navbar .navbar-collapse.in > .navbar-nav > li,
+body.layout-classic #navbar .navbar-collapse.collapsing > .navbar-nav > li {
+  float: none;
+}
+body.layout-classic #search {
+  padding: 0;
+}
+body.layout-classic #header {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 400px;
+  height: 200px;
+  padding-top: 60px;
+}
+body.layout-classic #grid {
+  position: fixed;
+  top: 100px;
+  bottom: 0;
+  left: 0;
+  width: 400px;
+}
 
 /*# sourceMappingURL=doc.css.map */

src/js/doc.js

@@ -29,7 +29,7 @@
     }
 
     var saveTraffic = false;
-    var debug = 0;
+    var debug = 2;
     if(debug) console.error("DEBUG ENABLED.");
 
     var chapters = {
@@ -1535,6 +1535,7 @@
         var scrollHeight = $('#navbar').outerHeight();
         var lastScrollTop;
         $window.on('scroll', function(e){
+            if($body.hasClass('layout-classic')) return;
             var isScrollAnimating = $body.data('isScrollAnimating');
             if(isScrollAnimating) {
                 $window.scrollTop(1);

src/less/doc.less

@@ -1978,3 +1978,72 @@ body.page-show {
     #navbar .navbar-brand {display: none}
   }
 }
+
+body.layout-classic
+{
+  #heading {display: none}
+
+  #navbar {
+    width: 400px;
+    left: 0;
+    top: 0;
+    padding: 10px 0;
+    margin-bottom: 0;
+
+    .navbar-header {
+      float: none;
+    }
+
+    .navbar-toggle {
+      display: block;
+      float: right;
+      margin-right: 0;
+    }
+
+    .navbar-collapse {
+      display: none!important;
+
+      &.in, &.collapsing {
+        &:before {
+          right: 10px;
+        }
+
+        > .navbar-right {
+          float: none!important;
+        }
+
+        display: block!important;
+        width: 140px;
+
+        > .navbar-nav > li {
+          float: none;
+        }
+      }
+    }
+  }
+
+  #search {
+    padding: 0;
+  }
+
+  #header {
+    position: fixed; 
+    left: 0; 
+    top: 0; 
+    height: 200px;
+    width: 400px;
+    padding-top: 60px;
+  }
+
+  #searchInput {
+
+  }
+
+  #grid {
+    position: fixed;
+    top: 100px;
+    left: 0;
+    bottom: 0;
+    width: 400px;
+  }
+}