Forráskód Böngészése

Support article catalogue

zhengxiaopeng 10 éve
szülő
commit
7fb9ff1dec
2 módosított fájl, 54 hozzáadás és 1 törlés
  1. 6 0
      layout/_partial/article.ejs
  2. 48 1
      source/css/_partial/article.styl

+ 6 - 0
layout/_partial/article.ejs

@@ -22,6 +22,12 @@
           </p>
         <% } %>
       <% } else { %>
+                <% if (!index && post.toc){ %>
+                    <div id="toc" class="toc-article">
+                    <strong class="toc-title">文章目录</strong>
+    <%- toc(post.content) %>
+  </div>
+<% } %>
         <%- post.content %>
       <% } %>
     </div>

+ 48 - 1
source/css/_partial/article.styl

@@ -325,4 +325,51 @@ $article-share-link
   img
     display: block
     max-width: 100%
-    margin: 0 auto
+    margin: 0 auto
+
+/*  toc */
+.toc-article
+  background #F9F9F9
+  margin 2em 0 0 0.2em
+  padding 1em
+  border-radius 0px
+  .toc-title
+    font-size 120%
+  strong
+    padding 0.3em 1
+ol.toc
+  width 100%
+  margin 1em 2em 0 0
+#toc
+  line-height 1em
+  font-size 0.8em
+  float right
+  .toc
+    padding 0 
+    li
+      list-style-type none
+  .toc-child 
+    padding-left 0em
+#toc.toc-aside
+  display none
+  width 13%
+  position fixed
+  right 2%
+  top 320px
+  overflow hidden
+  line-height 1.5em
+  font-size 1em
+  color color-heading
+  opacity .6
+  transition opacity 1s ease-out
+  strong
+    padding 0.3em 0
+    color color-font
+  &:hover
+    transition opacity .3s ease-out
+    opacity 1
+  a
+    transition color 1s ease-out
+    &:hover
+      color color-theme
+      transition color .3s ease-out