nitdoc: make the menu follows the scroll.
authorAlexandre Terrasa <alexandre@moz-concept.com>
Mon, 30 Apr 2012 01:36:54 +0000 (21:36 -0400)
committerAlexandre Terrasa <alexandre@moz-concept.com>
Mon, 30 Apr 2012 15:32:40 +0000 (11:32 -0400)
Signed-off-by: Alexandre Terrasa <alexandre@moz-concept.com>

share/nitdoc/scripts/js-facilities.js
share/nitdoc/styles/main.css
src/nitdoc.nit

index 7911cb8..0c9f42b 100644 (file)
@@ -20,12 +20,12 @@ var currentIndex = -1;
 * Add folding and filtering facilities to class description page.\r
 */\r
 $(document).ready(function() {\r
-\r
+       \r
        /*\r
        * Highlight the spoted element\r
        */\r
-       highlightBlock(currentAnchor());
-       \r
+       highlightBlock(currentAnchor());\r
+\r
        /*\r
        * Nav block folding\r
        */\r
@@ -226,14 +226,6 @@ $(document).ready(function() {
                }\r
         });\r
        \r
-       /*\r
-       * Anchors jumps\r
-       */\r
-       $("a[href^='#']").click( function() {\r
-               var a = $(this).attr("href").replace(/#/, "");\r
-               highlightBlock(a);\r
-       });\r
-       \r
        // Insert filter field\r
        $("article.filterable h2, nav.filterable h3")\r
        .after(\r
@@ -349,9 +341,16 @@ $(document).ready(function() {
                        \r
                        $(this).toggleClass("hidden");\r
                })\r
-       );
-       
-       //Preload filter fields with query string
+       );\r
+\r
+       /*\r
+       * Anchors jumps\r
+       */\r
+       $("a[href*='#']").click( function() {\r
+               highlightBlock($(this).attr("href").split(/#/)[1]);\r
+       });\r
+       \r
+       //Preload filter fields with query string\r
        preloadFilters();\r
 });\r
 \r
index 07214ec..0a0352e 100644 (file)
@@ -58,6 +58,83 @@ h3 {
        font-weight: bold;\r
 }\r
 \r
+/* Page display */\r
+\r
+body {\r
+       overflow: hidden;\r
+       height: 100%;\r
+}\r
+\r
+header {\r
+}\r
+\r
+.page {\r
+       width: 937px;\r
+       margin: auto;\r
+}\r
+\r
+.menu {\r
+       position: fixed;\r
+       top: 50px;\r
+       bottom: 2em;\r
+       width: 250px;\r
+       overflow-y:     scroll;\r
+}\r
+\r
+.content {\r
+       position: fixed;\r
+       top: 50px;\r
+       bottom: 2em;\r
+       margin-left: 265px;\r
+       width: 667px;\r
+       overflow-y:     scroll;\r
+       padding-right: 10px;\r
+}\r
+\r
+.content.fullpage {\r
+       margin-left: 20px;\r
+       width: 910px;\r
+}\r
+\r
+footer {\r
+       position: fixed;\r
+       bottom: 0;\r
+       width: 100%;\r
+}\r
+\r
+/* Webkit scroll bars */\r
+\r
+.menu {\r
+    overflow-y: hidden;\r
+}\r
+\r
+.menu:hover {\r
+    overflow-y: scroll;\r
+}\r
+\r
+.menu::-webkit-scrollbar, .content::-webkit-scrollbar {\r
+    width: 10px;\r
+}\r
+\r
+.menu::-webkit-scrollbar-thumb, .content::-webkit-scrollbar-thumb {\r
+       background: #CCC;\r
+       -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,0.10),inset 0 -1px 0 rgba(0,0,0,0.07);\r
+}\r
+\r
+.menu::-webkit-scrollbar-thumb:hover, .content::-webkit-scrollbar-thumb:hover {\r
+       background: #999;\r
+}\r
+\r
+.menu::-webkit-scrollbar-corner, .content::-webkit-scrollbar-corner {\r
+       background: transparent;\r
+}\r
+\r
+.menu::-webkit-scrollbar-button, .content::-webkit-scrollbar-button {\r
+       width: 0;\r
+       height: 0;\r
+       display: none;\r
+}\r
+\r
 /* Header, Footer */\r
 \r
 header nav ul {\r
@@ -84,8 +161,7 @@ header nav ul li a:hover {
 \r
 footer {\r
        text-align: center;\r
-       padding: 20px 10px;\r
-       margin: 10px 100px;\r
+       padding-bottom: 10px;\r
        color: #CCC;\r
 }\r
 \r
@@ -101,22 +177,11 @@ header nav.main ul li.current {
        color: white;\r
 }\r
 \r
-/* Page content */\r
-\r
-.page {\r
-       width: 940px;\r
-       margin: auto;\r
-}\r
-\r
 /* Latteral Menu */\r
 \r
-.menu {\r
-       width: 250px;\r
-       float: left;\r
-}\r
-\r
 .menu nav {\r
        margin: 20px;\r
+       width: 208px;\r
        border: 1px solid #CCC;\r
 }\r
 \r
@@ -155,14 +220,6 @@ header nav.main ul li.current {
 \r
 /* Content */\r
 \r
-.content {\r
-       margin: 20px 20px 20px 260px;\r
-}\r
-\r
-.content.fullpage {\r
-       margin: 20px;\r
-}\r
-\r
 .content section {\r
        margin: 20px 0;\r
 }\r
index 59c3f72..a7ec4bd 100644 (file)
@@ -213,7 +213,6 @@ class DocContext
                op.append("\}\n")
                self.gen_dot(op.to_s, "dep", "Modules hierarchy")
                add("</article></div>")
-               add("<div class='clear'></div>")
                add("</div>")
                add("<footer>{footer_text}</footer>")
                add("</body></html>\n")