fix: scale (#202)
diff --git a/layouts/shortcodes/bilibili.html b/layouts/shortcodes/bilibili.html
index 3badb35..c04b73e 100644
--- a/layouts/shortcodes/bilibili.html
+++ b/layouts/shortcodes/bilibili.html
@@ -2,7 +2,7 @@
{{ $pageNum := index .Params 1 | default 1}}
{{ if (findRE "^[bB][vV][0-9a-zA-Z]+$" $videoID) }}
-<div><iframe id="biliplayer" src="//player.bilibili.com/player.html?bvid={{ $videoID }}&page={{ $pageNum }}" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" loading="lazy" width="100%" height="500"> </iframe></div>
+<div class="bilibili-container"><iframe id="biliplayer" src="//player.bilibili.com/player.html?bvid={{ $videoID }}&page={{ $pageNum }}" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" loading="lazy"> </iframe></div>
{{ else }}
-<div><iframe id="biliplayer" src="//player.bilibili.com/player.html?aid={{ $videoID }}&page={{ $pageNum }}" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" loading="lazy" width="100%" height="500"> </iframe></div>
+<div class="bilibili-container"><iframe id="biliplayer" src="//player.bilibili.com/player.html?aid={{ $videoID }}&page={{ $pageNum }}" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" loading="lazy"> </iframe></div>
{{ end }}
diff --git a/themes/docsy/assets/scss/_blog.scss b/themes/docsy/assets/scss/_blog.scss
index 475e40d..f96ff5a 100644
--- a/themes/docsy/assets/scss/_blog.scss
+++ b/themes/docsy/assets/scss/_blog.scss
@@ -75,3 +75,19 @@
}
}
+.bilibili-container {
+ position: relative;
+ width: 100%;
+ height: 0;
+ padding-bottom: 57%;
+ margin: 3% auto;
+ text-align: center;
+
+ iframe {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ left: 0;
+ top: 0;
+ }
+}