library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2024-11-14 11:14:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Use mp4 videos

Browse Source
This commit is contained in:
Jeremy Thomas 2018-05-25 20:48:08 +02:00
parent 5d8aec3530
commit 6033a2c7b8
6 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs/images/videos/blog.mp4 Normal file
View File

Binary file not shown.

BIN
docs/images/videos/blog.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 748 KiB

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
docs/images/videos/slide.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 413 KiB

After

Width:  |  Height:  |  Size: 400 KiB

BIN
docs/images/videos/tesla.mp4 Normal file
View File

Binary file not shown.

BIN
docs/images/videos/tesla.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 673 KiB

After

Width:  |  Height:  |  Size: 3.1 MiB

9
docs/videos.html
View File

@ -23,7 +23,7 @@ videos:
subtitle: 4 videos – 15 min
content: Create web-based presentation slides with Bulma.
video_url: https://scrimba.com/p/pV5eHk/cGym4Ta
no_gif: true
no_video: true
---
{% include global/navbar.html id="Videos" %}
@ -101,11 +101,12 @@ videos:
<div class="column is-8 is-offset-1">
<a class="image" href="{{ video.video_url }}" target="_blank" rel="nofollow">
{% if video.no_gif %}
{% if video.no_video %}
<img src="/images/videos/{{ video.id }}.png" alt="{{ video.title }} screenshot">
{% else %}
<img class="is-hidden-touch" src="/images/videos/{{ video.id }}.gif" alt="{{ video.title }} screenshot">
<img class="is-hidden-desktop" src="/images/videos/{{ video.id }}.png" alt="{{ video.title }} screenshot">
<video autoplay loop muted>
<source media="(min-width: 640px)" src="/images/videos/{{ video.id }}.mp4">
</video>
{% endif %}
</a>
</div>