doc: decouple sidebar scrolling

This lets the doc sidebar have its own scrolling container, making the
page easier to navigate in cases where previously the menu was scrolled
far off.

PR-URL: https://github.com/iojs/io.js/pull/1274
Reviewed-by: Chris Dickinson <christopher.s.dickinson@gmail.com>
Reviewed-By: Brendan Ashworth <brendan.ashworth@me.com>

diff --git a/doc/api_assets/style.css b/doc/api_assets/style.css
index e816ce5..709a835 100644 (file)
--- a/doc/api_assets/style.css
+++ b/doc/api_assets/style.css
@@ -351,7 +351,20 @@ span.type {
 
 #column2.interior {
   width: 234px;
-  float: left;
+  position: fixed;
+  height: 100%;
+  overflow-y: scroll;
+}
+
+#column2.interior:after {
+  content: '';
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 234px;
+  height: 5em;
+  background: linear-gradient(rgba(242,245,240, 0), rgba(242,245,240, 1));
+  pointer-events: none;
 }
 
 #column2 ul {
@@ -360,7 +373,7 @@ span.type {
   margin-top: 1.25em;
   background: #f2f5f0;
   margin-bottom: 0;
-  padding-bottom: 2.5em;
+  padding-bottom: 4em;
 }
 
 #column2 ul li {