feat($theme-default): markdown details custom block (close vuejs#768)

meteorlxy · Nov 28, 2019 · 396da81 · 396da81
1 parent 50196a3
commit 396da81
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 2 deletions.
diff --git a/packages/@vuepress/theme-default/index.js b/packages/@vuepress/theme-default/index.js
@@ -48,6 +48,11 @@ module.exports = (options, ctx) => {
           '/zh/': '警告'
         }
       }],
+      ['container', {
+        type: 'details',
+        before: info => `<details class="custom-block details">${info ? `<summary>${info}</summary>` : ''}\n`,
+        after: () => '</details>\n'
+      }],
       ['smooth-scroll', enableSmoothScroll]
     ]
   }

diff --git a/packages/@vuepress/theme-default/styles/custom-blocks.styl b/packages/@vuepress/theme-default/styles/custom-blocks.styl
@@ -26,5 +26,19 @@
       color darken(red, 40%)
     a
       color $textColor
-
-
+  &.details
+    display block
+    position relative
+    border-radius 2px
+    margin 1.6em 0
+    padding 1.6em
+    background-color #eee
+    h4
+      margin-top 0
+    figure, p
+      &:last-child
+        margin-bottom 0
+        padding-bottom 0
+    summary
+      outline none
+      cursor pointer