<?xml version="1.0"?>
<data inherit_id="website.snippet_options">
    <xpath expr="//div[@data-js='layout_column']" position="after">
        <div data-js="MasonryLayout" data-selector=".s_masonry_block">
            <we-select string="Template" data-name="masonry_template_opt" data-attribute-name="masonryTemplate" data-attribute-default-value="default">
                <we-button title="Default" data-select-container-class="container" data-select-template="website.s_masonry_block_default_template" data-select-data-attribute="default" data-img="/website/static/src/img/snippets_options/masonry_template_default.svg"/>
                <we-button title="Default Reversed" data-select-container-class="container-fluid" data-select-template="website.s_masonry_block_reversed_template" data-select-data-attribute="default_reversed" data-img="/website/static/src/img/snippets_options/masonry_template_reversed.svg"/>
                <we-button title="Images" data-select-container-class="container" data-select-template="website.s_masonry_block_images_template" data-select-data-attribute="images" data-img="/website/static/src/img/snippets_options/masonry_template_images.svg"/>
                <we-button title="Image Text Image" data-select-container-class="container-fluid" data-select-template="website.s_masonry_block_image_texts_image_template" data-select-data-attribute="image_text_image" data-img="/website/static/src/img/snippets_options/masonry_template_image_texts_image.svg"/>
                <we-button title="Mosaic" data-select-container-class="container" data-select-template="website.s_masonry_block_mosaic_template" data-select-data-attribute="mosaic" data-img="/website/static/src/img/snippets_options/masonry_template_mosaic.svg"/>
                <we-button title="Text Image Text" data-select-container-class="container" data-select-template="website.s_masonry_block_texts_image_texts_template" data-select-data-attribute="text_image_text" data-img="/website/static/src/img/snippets_options/masonry_template_texts_image_texts.svg"/>
                <we-button title="Alternate Text" data-select-container-class="container-fluid" data-select-template="website.s_masonry_block_alternation_text_template" data-select-data-attribute="alternate_text" data-img="/website/static/src/img/snippets_options/masonry_template_alternate_texts.svg"/>
                <we-button title="Alternate Text Image" data-select-container-class="container" data-select-template="website.s_masonry_block_alternation_text_image_template" data-select-data-attribute="alternate_text_image" data-img="/website/static/src/img/snippets_options/masonry_template_alternate_text_image.svg"/>
                <we-button title="Alternate Image Text" data-select-container-class="container-fluid" data-select-template="website.s_masonry_block_alternation_image_text_template" data-select-data-attribute="alternate_image_text" data-img="/website/static/src/img/snippets_options/masonry_template_alternate_image_text.svg"/>
                <we-button title="Alternate Text Image Text" data-select-container-class="container-fluid" data-select-template="website.s_masonry_block_alternation_text_image_text_template" data-select-data-attribute="alternate_text_image_text" data-img="/website/static/src/img/snippets_options/masonry_template_alternate_text_image_text.svg"/>
            </we-select>
        </div>
    </xpath>

    <!--  Box Vertical Alignment -->
    <xpath expr="//div[@data-js='WebsiteAnimate']" position="after">
        <div data-selector=".s_masonry_block .o_grid_item" data-exclude=".o_grid_item_image">
            <we-button-group string="Vert. Alignment" title="Vertical Alignment">
                <we-button title="Align Top" data-select-class="justify-content-start" data-img="/website/static/src/img/snippets_options/align_solo_top.svg"/>
                <we-button title="Align Middle" data-select-class="justify-content-center" data-img="/website/static/src/img/snippets_options/align_solo_middle.svg"/>
                <we-button title="Align Bottom" data-select-class="justify-content-end" data-img="/website/static/src/img/snippets_options/align_solo_bottom.svg"/>
            </we-button-group>
        </div>
    </xpath>
</data>

