video index material
This commit is contained in:
parent
feed72fa26
commit
fd3eca33e8
@ -35,6 +35,7 @@
|
||||
<video autoplay loop muted class="fillWidth">
|
||||
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
|
||||
</video>
|
||||
<img class="full-picture" src="{{ video.generate_thumbnail("900") }}">
|
||||
</div>
|
||||
{% set video = "" %}
|
||||
{% else %}
|
||||
|
@ -151,12 +151,10 @@ div#bg-section {
|
||||
margin-top: 20px
|
||||
}
|
||||
|
||||
.parallax video {
|
||||
video.fillWidth {
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
.parallax video.fillWidth {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
@ -8,24 +8,29 @@
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
{% for galleries_line in galleries|reverse|batch(3)|reverse %}
|
||||
{% for galleries_line in galleries|reverse|batch(2)|reverse %}
|
||||
{% for gallery in galleries_line|reverse %}
|
||||
{% if loop.length is divisibleby 2 %}
|
||||
<div class="col s12 m12 l6">
|
||||
{% else %}
|
||||
{% if loop.last %}
|
||||
<div class="col s12 m12 l6">
|
||||
{% else %}
|
||||
<div class="col s12 m12 l6">
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<div class="col s12 m12 l{{ 12 // galleries_line|length }}">
|
||||
<a href="{{ gallery.link }}">
|
||||
<div class="card hoverable blue-grey lighten-5">
|
||||
<div class="card-image">
|
||||
{% if gallery.cover_type == "video" %}
|
||||
{% set video = Video(gallery.cover) %}
|
||||
{{ video.copy() }}
|
||||
{% else %}
|
||||
{% set cover = Image(gallery.cover) %}
|
||||
{{ cover.copy() }}
|
||||
<img class="responsive-img hide-on-large-only" src="{{ cover.generate_thumbnail("x900") }}">
|
||||
<img class="small-card hide-on-med-and-down" src="{{ cover.generate_thumbnail("x900") }}">
|
||||
{% endif %}
|
||||
{% if video %}
|
||||
<img class="responsive-img" src="{{ video.generate_thumbnail("900") }}">
|
||||
<video autoplay loop muted class="fillWidth">
|
||||
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
|
||||
</video>
|
||||
{% set video = "" %}
|
||||
{% else %}
|
||||
<img src="{{ cover.generate_thumbnail("x900") }}">
|
||||
{% endif %}
|
||||
|
||||
<span class="card-title truncate">{{ gallery.title }}
|
||||
{% if gallery.sub_title %} : {{ gallery.sub_title }}{% endif %}
|
||||
</span>
|
||||
@ -61,9 +66,9 @@
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="static/js/jquery-2.1.4.min.js" charset="utf-8"></script>
|
||||
<script type="text/javascript" src="static/js/materialize.min.js" charset="utf-8"></script>
|
||||
|
@ -10,13 +10,13 @@
|
||||
{% endif %}
|
||||
<div class="bordered-picture baguette caption">
|
||||
{% if video %}
|
||||
<img class="lazy" src="{{ video.generate_thumbnail("2000") }}">
|
||||
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted="">
|
||||
<img class="lazy" data-original="{{ video.generate_thumbnail("2000") }}" alt="">
|
||||
<video class="lazy" poster="{{ video.generate_thumbnail("2000") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted="">
|
||||
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
|
||||
</video>
|
||||
{% else %}
|
||||
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}>
|
||||
<img class="responsive-img" src="{{ image.generate_thumbnail("x2000") }}">
|
||||
<img class="responsive-img lazy" data-original="{{ image.generate_thumbnail("x2000") }}" alt="">
|
||||
{% if caption %}
|
||||
<div class="caption__overlay card-panel center">
|
||||
<h5 class="black-white">{{ caption }}</h5>
|
||||
|
@ -1,5 +1,5 @@
|
||||
{% if section.background or section.color %}
|
||||
<div style="{% if section.background -%}padding: 1px 0px;background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
|
||||
<div id="bg-section" style="{% if section.background -%}background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
|
||||
{% endif %}
|
||||
<section class="html">
|
||||
<center>
|
||||
|
@ -1,5 +1,5 @@
|
||||
{% if section.background or section.color %}
|
||||
<div style="{% if section.background -%}padding: 1px 0px;background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
|
||||
<div id="bg-section" style="{% if section.background -%}background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
{% if section.title %}
|
||||
|
@ -18,11 +18,12 @@
|
||||
<div class="card">
|
||||
{% if video %}
|
||||
<div class="picture card-image">
|
||||
<img class="lazy" src="{{ video.generate_thumbnail("600") }}">
|
||||
<img class="lazy" data-original="{{ video.generate_thumbnail("600") }}">
|
||||
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted="">
|
||||
<source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
|
||||
</video>
|
||||
</div>
|
||||
{% set video = "" %}
|
||||
{% else %}
|
||||
<div class="picture card-image caption">
|
||||
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}>
|
||||
|
@ -1,5 +1,5 @@
|
||||
{% if section.background or section.color %}
|
||||
<div style="{% if section.background -%}padding: 1px 0px;background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
|
||||
<div id="bg-section" style="{% if section.background -%}background: {{ section.background }};{% endif %}{% if section.color -%}color: {{ section.color }};{% endif %}">
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
<p class="flow-text">
|
||||
|
Loading…
x
Reference in New Issue
Block a user