[feat] bilibili video #348

scripts/tags/lib/audio.js

@@ -14,7 +14,7 @@ module.exports = ctx => function(args) {
     args.type = 'audio/mp3'
   }
   return `
-  <div class="tag-plugin video">
+  <div class="tag-plugin audio">
   <audio controls preload>
   <source src="${args.src}" type="${args.type}">Your browser does not support the audio tag.
   </audio>

scripts/tags/lib/video.js

@@ -9,7 +9,15 @@
 'use strict';
 
 module.exports = ctx => function(args) {
-  args = ctx.args.map(args, ['type'], ['src'])
+  args = ctx.args.map(args, ['type', 'bilibili', 'ratio'], ['src'])
+  if (args.bilibili) {
+    return `
+    <div class="tag-plugin video" style="aspect-ratio:${args.ratio || 16/9}">
+    <iframe src="https://player.bilibili.com/player.html?bvid=${args.bilibili}" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true">
+    </iframe>
+    </div>
+    `
+  }
   if (args.type == null) {
     args.type = 'video/mp4'
   }

source/css/_common/media.styl

@@ -1,9 +1,4 @@
 audio,video
-  border-radius: $border-block
   max-width: 100%
 video
-  z-index: 1
+  z-index: 1
-  box-shadow: $boxshadow-card-float
-.video
-  line-height: 0
-  text-align: center

source/css/_layout/tag-plugins/media.styl

@@ -0,0 +1,11 @@
+.tag-plugin.video
+  line-height: 0
+  text-align: center
+  video, iframe
+    border-radius: $border-card
+    box-shadow: $boxshadow-card-float
+    z-index 1
+    background: var(--block)
+    width: 100%
+    height: 100%
+    margin: 0