diff --git a/assets/scss/partials/layout/article.scss b/assets/scss/partials/layout/article.scss index 5331a61..4309039 100644 --- a/assets/scss/partials/layout/article.scss +++ b/assets/scss/partials/layout/article.scss @@ -385,7 +385,7 @@ padding-bottom: 56.25%; overflow: hidden; - & > iframe { + & > iframe, & > video { position: absolute; width: 100%; height: 100%; diff --git a/layouts/shortcodes/video.html b/layouts/shortcodes/video.html new file mode 100644 index 0000000..733761a --- /dev/null +++ b/layouts/shortcodes/video.html @@ -0,0 +1,13 @@ +<div class="video-wrapper"> + <video + controls + {{ with .Get "poster" }}poster="{{- . -}}"{{ end }} + {{ with .Get "src" }}src="{{- . -}}"{{ end }} + {{ with .Get "autoplay" }}autoplay{{ end }} + > + <p> + Your browser doesn't support HTML5 video. Here is a + <a href="{{ with .Get "src" }}{{- . -}}{{ end }}">link to the video</a> instead. + </p> + </video> +</div>