refactor(article): add default padding (#166)

* refactor(article): add default padding

closes https://github.com/CaiJimmy/hugo-theme-stack/issues/165

* fix(article): video iframe margin

* fix: remove youtube iframe border

layouts/shortcodes/bilibili.html

@@ -12,13 +12,12 @@
     <p>当前视频av或BV号：{{ $vid }}，视频分P：{{ $videopage }}</p>
 {{ end }}
 
-<div style="position: relative; width: 100%; height: 0; padding-bottom: 56.25%;">
+<div class="video-wrapper">
     <iframe src="//player.bilibili.com/player.html?{{ $basicQuery | safeURL }}&{{ $videoQuery | safeURL }}"
             scrolling="no"
             frameborder="no"
             framespacing="0"
             allowfullscreen="true"
-            style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;"
     >
     </iframe>
 </div>

layouts/shortcodes/tencent.html

@@ -1,10 +1,10 @@
 {{ $vid := .Get 0 }}
-<div style="position: relative; width: 100%; height: 0; padding-bottom: 56.25%;">
+<div class="video-wrapper">
     <iframe src="http://v.qq.com/txp/iframe/player.html?vid={{ $vid }}&auto=0" 
             scrolling="no" 
             frameborder="no"
             framespacing="0" 
-            allowfullscreen="true" 
-            style="position: absolute; width: 100%; height: 100%;">
+            allowfullscreen="true"
+    >
     </iframe>
 </div>

layouts/shortcodes/youtube.html

@@ -2,8 +2,12 @@
 {{- if not $pc.Disable -}}
 {{- $ytHost := cond $pc.PrivacyEnhanced  "www.youtube-nocookie.com" "www.youtube.com" -}}
 {{- $id := .Get "id" | default (.Get 0) -}}
-{{- $class := .Get "class" | default (.Get 1) }}
-<div {{ with $class }}class="{{ . }}"{{ else }}style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"{{ end }}>
-  <iframe loading="lazy" src="https://{{ $ytHost }}/embed/{{ $id }}{{ with .Get "autoplay" }}{{ if eq . "true" }}?autoplay=1{{ end }}{{ end }}" {{ if not $class }}style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" {{ end }}allowfullscreen title="YouTube Video"></iframe>
+<div class="video-wrapper">
+    <iframe loading="lazy" 
+            src="https://{{ $ytHost }}/embed/{{ $id }}{{ with .Get "autoplay" }}{{ if eq . "true" }}?autoplay=1{{ end }}{{ end }}" 
+            allowfullscreen 
+            title="YouTube Video"
+    >
+    </iframe>
 </div>
 {{ end -}}