XW-4724 | Add video icons to video type.

This commit is contained in:
JamesHawking 2018-03-05 17:46:11 +01:00
parent f412c3a9bd
commit 4b7c4eff2a
2 changed files with 38 additions and 1 deletions

View file

@ -14,6 +14,24 @@
<noscript>
<img src="{{url}}" alt="{{alt}}"{{#width}} width="{{width}}"{{/width}}{{#height}} height="{{height}}"{{/height}} />
</noscript>
{{#isVideo}}
<div class="video-icon-container">
<svg class="wds-player-icon-play-medium" viewBox="0 0 180 180" width="100%" height="100%">
<g fill="none" fill-rule="evenodd">
<g opacity=".9" transform="rotate(90 75 90)">
<g fill="#000" filter="url(#a)">
<rect id="b" width="150" height="150" rx="75"></rect>
</g>
<g fill="#FFF">
<rect id="b" width="150" height="150" rx="75"></rect>
</g>
</g>
<path fill="#00D6D6" fill-rule="nonzero"
d="M80.87 58.006l34.32 25.523c3.052 2.27 3.722 6.633 1.496 9.746a6.91 6.91 0 0 1-1.497 1.527l-34.32 25.523c-3.053 2.27-7.33 1.586-9.558-1.527A7.07 7.07 0 0 1 70 114.69V63.643c0-3.854 3.063-6.977 6.84-6.977 1.45 0 2.86.47 4.03 1.34z"></path>
</g>
</svg>
</div>
{{/isVideo}}
</a>
{{#caption}}<figcaption class="pi-item-spacing pi-caption">{{{caption}}}</figcaption>{{/caption}}
</figure>

View file

@ -8,8 +8,27 @@
{{#width}} width="{{width}}"{{/width}}
{{#height}} height="{{height}}"{{/height}} />
<noscript>
<img src="{{url}}" alt="{{alt}}"{{#width}} width="{{width}}"{{/width}}{{#height}} height="{{height}}"{{/height}} />
<img src="{{url}}" alt="{{alt}}"{{#width}}
width="{{width}}"{{/width}}{{#height}} height="{{height}}"{{/height}} />
</noscript>
{{#isVideo}}
<div class="video-icon-container">
<svg class="wds-player-icon-play-medium" viewBox="0 0 180 180" width="100%" height="100%">
<g fill="none" fill-rule="evenodd">
<g opacity=".9" transform="rotate(90 75 90)">
<g fill="#000" filter="url(#a)">
<rect id="b" width="150" height="150" rx="75"></rect>
</g>
<g fill="#FFF">
<rect id="b" width="150" height="150" rx="75"></rect>
</g>
</g>
<path fill="#00D6D6" fill-rule="nonzero"
d="M80.87 58.006l34.32 25.523c3.052 2.27 3.722 6.633 1.496 9.746a6.91 6.91 0 0 1-1.497 1.527l-34.32 25.523c-3.053 2.27-7.33 1.586-9.558-1.527A7.07 7.07 0 0 1 70 114.69V63.643c0-3.854 3.063-6.977 6.84-6.977 1.45 0 2.86.47 4.03 1.34z"></path>
</g>
</svg>
</div>
{{/isVideo}}
</a>
</figure>
</div>