diff options
| author | stephanchrst <stephanchrst@gmail.com> | 2022-05-10 21:51:50 +0700 |
|---|---|---|
| committer | stephanchrst <stephanchrst@gmail.com> | 2022-05-10 21:51:50 +0700 |
| commit | 3751379f1e9a4c215fb6eb898b4ccc67659b9ace (patch) | |
| tree | a44932296ef4a9b71d5f010906253d8c53727726 /addons/website/static/src/snippets/s_image_gallery/000.xml | |
| parent | 0a15094050bfde69a06d6eff798e9a8ddf2b8c21 (diff) | |
initial commit 2
Diffstat (limited to 'addons/website/static/src/snippets/s_image_gallery/000.xml')
| -rw-r--r-- | addons/website/static/src/snippets/s_image_gallery/000.xml | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/addons/website/static/src/snippets/s_image_gallery/000.xml b/addons/website/static/src/snippets/s_image_gallery/000.xml new file mode 100644 index 00000000..a50a1af5 --- /dev/null +++ b/addons/website/static/src/snippets/s_image_gallery/000.xml @@ -0,0 +1,68 @@ +<?xml version="1.0" encoding="UTF-8"?> +<templates xml:space="preserve"> + <!-- + ======================================================================== + Gallery Slideshow + + This template is used to display a slideshow of images inside a + bootstrap carousel. + + ======================================================================== + --> + <t t-name="website.gallery.slideshow"> + <div t-attf-id="#{id}" class="carousel slide" data-ride="carousel" t-attf-data-interval="#{interval}" style="margin: 0 12px;"> + <div class="carousel-inner" style="padding: 0;"> + <t t-foreach="images" t-as="image"> + <div t-attf-class="carousel-item #{image_index == index and 'active' or None}"> + <img t-attf-class="#{attrClass || 'img img-fluid d-block'}" t-att-src="image.src" t-att-style="attrStyle" t-att-alt="image.alt" data-name="Image"/> + </div> + </t> + </div> + + <ul class="carousel-indicators"> + <li class="o_indicators_left text-center d-none" aria-label="Previous" title="Previous"> + <i class="fa fa-chevron-left"/> + </li> + <t t-foreach="images" t-as="image"> + <li t-attf-data-target="##{id}" t-att-data-slide-to="image_index" t-att-class="image_index == index and 'active' or None" t-attf-style="background-image: url(#{image.src})"></li> + </t> + <li class="o_indicators_right text-center d-none" aria-label="Next" title="Next"> + <i class="fa fa-chevron-right"/> + </li> + </ul> + + <a class="carousel-control-prev o_we_no_overlay" t-attf-href="##{id}" data-slide="prev" aria-label="Previous" title="Previous"> + <span class="fa fa-chevron-left fa-2x text-white"></span> + <span class="sr-only">Previous</span> + </a> + <a class="carousel-control-next o_we_no_overlay" t-attf-href="##{id}" data-slide="next" aria-label="Next" title="Next"> + <span class="fa fa-chevron-right fa-2x text-white"></span> + <span class="sr-only">Next</span> + </a> + </div> + </t> + + <!-- + ======================================================================== + Gallery Slideshow LightBox + + This template is used to display a lightbox with a slideshow. + + This template wraps website.gallery.slideshow in a bootstrap modal + dialog. + ======================================================================== + --> + <t t-name="website.gallery.slideshow.lightbox"> + <div role="dialog" class="modal o_technical_modal fade s_gallery_lightbox p-0" aria-labbelledby="Image Gallery Dialog"> + <div class="modal-dialog m-0" role="Picture Gallery" + t-attf-style=""> + <div class="modal-content bg-transparent"> + <main class="modal-body o_slideshow bg-transparent"> + <button type="button" class="close text-white" data-dismiss="modal" style="position: absolute; right: 10px; top: 10px;"><span role="img" aria-label="Close">×</span><span class="sr-only">Close</span></button> + <t t-call="website.gallery.slideshow"></t> + </main> + </div> + </div> + </div> + </t> +</templates> |
