feat(theme): Flexible sidebar for default theme

documentationjs · Jul 31, 2017 · 6509ae8 · 6509ae8
1 parent 9433ec6
commit 6509ae8
Show file tree

Hide file tree

Showing 10 changed files with 1,036 additions and 196 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,6 +1,8 @@
 {
   "presets": ["flow"],
   "plugins": [
-    "transform-es2015-modules-commonjs"
+    ["transform-es2015-modules-commonjs", {
+      "allowTopLevelThis": true
+    }]
   ]
 }
diff --git a/__tests__/__snapshots__/bin.js.snap b/__tests__/__snapshots__/bin.js.snap
@@ -10,11 +10,11 @@ exports[`--config 1`] = `
   <link href='assets/bass.css' type='text/css' rel='stylesheet' />
   <link href='assets/style.css' type='text/css' rel='stylesheet' />
   <link href='assets/github.css' type='text/css' rel='stylesheet' />
+  <link href='assets/split.css' type='text/css' rel='stylesheet' />
 </head>
-<body class='documentation'>
-  <div class='max-width-4 mx-auto'>
-    <div class='clearfix md-mxn2'>
-      <div class='fixed xs-hide fix-3 overflow-auto max-height-100'>
+<body class='documentation m0'>
+    <div class='flex'>
+      <div id='split-left' class='overflow-auto fs0 height-viewport-100'>
         <div class='py1 px2'>
           <h3 class='mb0 no-anchor'>documentation</h3>
           <div class='mb1'><code>5.0.1</code></div>
@@ -219,7 +219,7 @@ exports[`--config 1`] = `
           </div>
         </div>
       </div>
-      <div class='fix-margin-3'>
+      <div id='split-right' class='relative overflow-auto height-viewport-100'>
         
           
             <div class='keyline-top-not py2'><section class='py2 clearfix'>
@@ -1355,8 +1355,8 @@ like a <a href=\\"#klass\\">klass</a>. This needs a <a href=\\"https://developer
         
       </div>
     </div>
-  </div>
   <script src='assets/anchor.js'></script>
+  <script src='assets/split.js'></script>
   <script src='assets/site.js'></script>
 </body>
 </html>

diff --git a/__tests__/__snapshots__/test.js.snap b/__tests__/__snapshots__/test.js.snap
@@ -753,11 +753,11 @@ exports[`html nested.input.js 1`] = `
   <link href='assets/bass.css' type='text/css' rel='stylesheet' />
   <link href='assets/style.css' type='text/css' rel='stylesheet' />
   <link href='assets/github.css' type='text/css' rel='stylesheet' />
+  <link href='assets/split.css' type='text/css' rel='stylesheet' />
 </head>
-<body class='documentation'>
-  <div class='max-width-4 mx-auto'>
-    <div class='clearfix md-mxn2'>
-      <div class='fixed xs-hide fix-3 overflow-auto max-height-100'>
+<body class='documentation m0'>
+    <div class='flex'>
+      <div id='split-left' class='overflow-auto fs0 height-viewport-100'>
         <div class='py1 px2'>
           <h3 class='mb0 no-anchor'>documentation</h3>
           <div class='mb1'><code>5.0.1</code></div>
@@ -952,7 +952,7 @@ exports[`html nested.input.js 1`] = `
           </div>
         </div>
       </div>
-      <div class='fix-margin-3'>
+      <div id='split-right' class='relative overflow-auto height-viewport-100'>
         
           
             <section class='p2 mb2 clearfix bg-white minishadow'>
@@ -2060,8 +2060,8 @@ like a <a href=\\"#klass\\">klass</a>. This needs a <a href=\\"https://developer
         
       </div>
     </div>
-  </div>
   <script src='assets/anchor.js'></script>
+  <script src='assets/split.js'></script>
   <script src='assets/site.js'></script>
 </body>
 </html>