MOVU Components

Gallery Slideshow: With Comment 

<div class="movu-slideshow-wrapper ">
    <movu-gallery-slideshow comment_text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget metus tortor. Sed massa velit, luctus ac leo nec, lobortis hendrerit enim. Vestibulum eu tellus eu elit vulputate luctus. Praesent vestibulum eleifend feugiat. Curabitur interdum tincidunt egestas. Vestibulum elementum ex non lacus fermentum hendrerit. " auto-play="false" show-pointers="false" show-buttons="true" show-thumbnails="true" commentText="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget metus tortor. Sed massa velit, luctus ac leo nec, lobortis hendrerit enim. Vestibulum eu tellus eu elit vulputate luctus. Praesent vestibulum eleifend feugiat. Curabitur interdum tincidunt egestas. Vestibulum elementum ex non lacus fermentum hendrerit. ">
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80">
            <div class="item-background" style="background-image: url('https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
        <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
            <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
        </div>
    </movu-gallery-slideshow>
</div>
 
<div class="movu-slideshow-wrapper {% if carouselClass %} {{ carouselClass }}{% endif %}">
  <movu-gallery-slideshow  {% if commentText %} comment_text="{{ commentText }}"{% endif %} auto-play="false" show-pointers="false" show-buttons="true" show-thumbnails="true" {% if commentText %} commentText="{{ commentText }}"{% endif %}>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80">
      <div class="item-background" style="background-image: url('https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
    <div class="slim-slide" data-thumb="https://demo-01.movu.ch/public/build/assets/images/image.jpg">
      <div class="item-background" style="background-image: url('https://demo-01.movu.ch/public/build/assets/images/image.jpg'); background-size: contain; background-position: center center; background-repeat: no-repeat;"></div>
    </div>
  </movu-gallery-slideshow>
</div>
 
{
  "commentText": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget metus tortor. Sed massa velit, luctus ac leo nec, lobortis hendrerit enim. Vestibulum eu tellus eu elit vulputate luctus. Praesent vestibulum eleifend feugiat. Curabitur interdum tincidunt egestas. Vestibulum elementum ex non lacus fermentum hendrerit. "
}
  • Handle: @gallery-slideshow--with-comment
  • Preview:
  • Filesystem Path: src/components/02components/booking/gallery-slideshow/gallery-slideshow.hbs

No notes defined.