fix caption on video

This commit is contained in:
Adrien Beudin 2016-05-26 12:09:01 +02:00
parent d3c0e1e466
commit ef199a5d52
3 changed files with 21 additions and 9 deletions

View File

@ -256,7 +256,7 @@ footer a {
} }
.share, .author { .share, .author-meta {
text-align: center; text-align: center;
height: auto; height: auto;
position: relative; position: relative;
@ -310,25 +310,30 @@ a.google {
background-position: -172px 0 !important; background-position: -172px 0 !important;
} }
.author img.circle { .author-meta img.circle {
border-radius: 50%; border-radius: 50%;
width: 80px; width: 80px;
} }
.author { .author-meta {
padding-bottom: 7em; padding-bottom: 7em;
} }
.author-meta { .author-info {
color: #ccc; color: #ccc;
font-style: italic; font-style: italic;
font-size: 19px; font-size: 19px;
} }
.author h4 { .author-info h4 {
text-transform: uppercase; text-transform: uppercase;
text-align: center;
font-family: 'crimson', serif;
color: black;
font-style: normal;
font-weight: bold;
} }
.author .desc { .author-info .desc {
width: 350px; width: 350px;
margin: auto; margin: auto;
padding-bottom: 10px; padding-bottom: 10px;
@ -343,7 +348,7 @@ a.google {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 2; z-index: 0;
width: 100%; width: 100%;
height: auto; height: auto;
} }

View File

@ -1,13 +1,14 @@
{% set image = Image(section.image) %} {% set image = Image(section.image) %}
{{ image.copy() }} {{ image.copy() }}
<div class="author"> <div class="author-meta">
<img src={{ image.generate_thumbnail("200x200") }} alt="" class="circle"> <img src={{ image.generate_thumbnail("200x200") }} alt="" class="circle">
<div> <div>
<span class=author-meta>Story by</span> <span class=author-info>Story by
<h4>{{ section.name }}</h4> <h4>{{ section.name }}</h4>
{% if section.text %} {% if section.text %}
<div class=desc>{{ section.text }}</div> <div class=desc>{{ section.text }}</div>
{% endif %} {% endif %}
</span>
</div> </div>
<div class="separator"></div> <div class="separator"></div>
<div> <div>

View File

@ -6,6 +6,7 @@
<div class="pictures-line"> <div class="pictures-line">
{% for image in line %} {% for image in line %}
{% if image.type == "video" %} {% if image.type == "video" %}
{% set caption = image.text %}
{% set video = Video(image) %} {% set video = Video(image) %}
{{ video.copy() }} {{ video.copy() }}
{% else %} {% else %}
@ -19,6 +20,11 @@
<video class="lazy" id="video" poster="{{ video.generate_thumbnail("600") }}" alt="" autoplay="autoplay" loop="loop" preload="auto" muted> <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"> <source src="{{ video }}" type="video/webm" data-source="{{ video }}" data-format="vp8" data-extension="webm">
</video> </video>
{% if caption %}
<div class="caption__overlay">
<h5 class="caption__overlay__title">{{ caption }}</h5>
</div>
{% endif %}
{% set video = "" %} {% set video = "" %}
{% else %} {% else %}
<a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}> <a href="{{ image }}" {% if caption %}data-caption="{{ caption }}"{% endif %}>