MOVU Components

Poster Banner Media: Image 

<div class="movu-poster-banner movu-poster-banner-media ">
    <div class="row movu-spacing-0-left-right">
        <div class="col-xs-12 col-md-6 no-padding-left no-padding-right col-md-push-6">
            <div class="movu-media-banner-left">

                <div class="movu-banner-image"></div>

            </div>
        </div>
        <div class="col-xs-12 col-md-6 col-md-pull-6">
            <div class="movu-media-banner-right  clearfix">

                <div class="movu-laptop-size col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 no-padding-left no-padding-right">

                    <h2>Suspendisse vitae felis nec mauris bibendum efficitur in vitae diam. </h2>
                    <p class="large">Usce felis nisi, semper consequat mauris in, congue blandit dolor. Vivamus sed neque nibh.</p>
                    <movu-button primary text="Click me"></movu-button>

                </div>

            </div>
        </div>
    </div>
</div>
 
{% extends "@poster-banner-media-template" %}
{% block posterBannerMediaContentLeft %}
{% if imgExists %}
<div class="movu-banner-image"></div>
{% else %}
<div class="movu-banner-video">
  {% render '@video-player', { videoClass: 'movu-video-player', videoId: 'movu-first-video-player', iframeUrl: 'https://www.youtube.com/embed/Wv_mCUYXzWE?rel=0&showinfo=0&enablejsapi=1'}, true %}
  {% render '@video-player', { videoClass: 'movu-video-player hidden', videoId: 'movu-second-video-player', iframeUrl: 'https://www.youtube.com/embed/KNbY0iolA48?rel=0&showinfo=0&enablejsapi=1'}, true %}
  {% render '@video-player', { videoClass: 'movu-video-player hidden', videoId: 'movu-third-video-player', iframeUrl: 'https://www.youtube.com/embed/KNbY0iolA48?rel=0&showinfo=0&enablejsapi=1'}, true %}
  {% render '@video-player', { videoClass: 'movu-video-player hidden', videoId: 'movu-fourth-video-player', iframeUrl: 'https://www.youtube.com/embed/Wv_mCUYXzWE?rel=0&showinfo=0&enablejsapi=1'}, true %}
</div>
{% endif %}
{% endblock %}
{% block posterBannerMediaContentRight %}
<div
  class="movu-laptop-size col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 no-padding-left no-padding-right">
  {% if videoFeedExists %}
  <div class="movu-video-feeds-section">
    <div class="col-xs-12 no-padding-left-xs">
      <h2 class="card-title">Experiences with MOVU</h2>
    </div>
    <div class="col-xs-6 col-sm-4 col-md-6 no-padding-left-xs padding-right-8">
      {% render '@video-feed', { feedId: 'movu-first-video', imgLink: '//cdn.movu.ch/assets/whyMovu/stefan-d5cb23c895d96aa04a4974cfd179f0863d1dfb3e0e6a2c271da9a62d1b62c843.png', usernameLink: "Stefan’s cleaning" }, true %}
    </div>
    <div class="col-xs-6 col-sm-4 col-md-6 no-padding-right-xs padding-left-8">
      {% render '@video-feed', { feedId: 'movu-second-video', imgLink: '//cdn.movu.ch/assets/whyMovu/family-363423f8a021ab231a3f6686a1a80a61de41655a83fbc5663fb8fd644a177977.png', usernameLink: "Family Bommer’s move and cleaning" }, true %}
    </div>
    <div class="col-xs-6 col-sm-4 col-md-6 no-padding-left-xs padding-right-8">
      {% render '@video-feed', { feedId: 'movu-third-video', imgLink: '//cdn.movu.ch/assets/whyMovu/family-363423f8a021ab231a3f6686a1a80a61de41655a83fbc5663fb8fd644a177977.png', usernameLink: "Nemanja's moving" }, true %}
    </div>
    <div class="col-xs-6 col-sm-4 col-md-6 no-padding-right-xs padding-left-8">
      {% render '@video-feed', { feedId: 'movu-fourth-video', imgLink: '//cdn.movu.ch/assets/whyMovu/family-363423f8a021ab231a3f6686a1a80a61de41655a83fbc5663fb8fd644a177977.png', usernameLink: "Nemanja's moving" }, true %}
    </div>
  </div>
  {% else %}
  <h2>{{ mediaHeading }} </h2>
  <p class="large">{{ mediaText }}</p>
   <movu-button primary text="Click me"></movu-button>
  {% endif %}
</div>
{% endblock %}
 
{
  "mediaHeading": "Suspendisse vitae felis nec mauris bibendum efficitur in vitae diam.",
  "mediaText": "Usce felis nisi, semper consequat mauris in, congue blandit dolor. Vivamus sed neque nibh.",
  "imgExists": true
}

No notes defined.