fix(toc):fix toc menu list (#266)

* fix(toc):fix #167 * fix(toc):use max-height instead * fix(toc): set a custom scroll style * fix(toc): move css to style.css and minify
iblh · Apr 8, 2017 · d0af767 · d0af767
1 parent 95a1b44
commit d0af767
Show file tree

Hide file tree

Showing 4 changed files with 472 additions and 4 deletions.
diff --git a/layout/_partial/config_css.ejs b/layout/_partial/config_css.ejs
@@ -62,6 +62,7 @@
     color: <%= theme.uiux.hyperlink_color %>;
     text-decoration: underline;
   }
+
 </style>
 
 

diff --git a/layout/_partial/toc_button.ejs b/layout/_partial/toc_button.ejs
@@ -21,10 +21,11 @@
         <i class="material-icons">format_list_numbered</i>
     </button>
 
-    <ul class="post-toc-wrap mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" for="post-toc-trigger-btn">
+    <ul class="post-toc-wrap mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" for="post-toc-trigger-btn" style="max-height:80vh; overflow-y:scroll;">
         <%- toc(page.content, {
             class: 'post-toc',
-            list_number: true
+            list_number: true,
+            style: 'max-height:80vh; overflow-y:scroll;'
         }) %>
 
         <!--

diff --git a/source/css/style.css b/source/css/style.css
@@ -420,6 +420,26 @@ a {
     background-color: transparent;
     border: none;
 }
+
+.post-toc-wrap::-webkit-scrollbar{
+    width: 7px;
+    height: 7px;
+    border-radius: 4px;
+    background-color: #F1F1F1;
+    opacity: 0.4;
+}
+
+.post-toc-wrap::-webkit-scrollbar-thumb {
+    width: 7px;
+    height: 7px;
+    border-radius: 4px;
+    background-color: #DDDDDD;
+    opacity: 0.8;
+}
+.post-toc-wrap::-webkit-scrollbar-button {
+     display: none;
+}
+
 /****************/
 /* Scheme_Paradox */
 /****************/

diff --git a/source/css/style.min.css b/source/css/style.min.css