<txp:output_form form="--variables--gallery" />
<section<txp:evaluate> class="<txp:if_yield name="align">align-<txp:yield name="align" /> </txp:if_yield><txp:if_yield name="padding-y">py-<txp:yield name="padding-y" /></txp:if_yield>"</txp:evaluate>>
    <txp:if_yield><txp:yield /><txp:else /><h2 class="sr-only"><txp:text item="gallery" /></h2></txp:if_yield>
    <div class="layout-text<txp:variable name="--gallery-columns" />col gallery<txp:if_variable name="--gallery-gap" not value=""> gap-<txp:variable name="--gallery-gap" /></txp:if_variable>">
        <txp:evaluate>
            <txp:images category="gallery" break="" sort="date desc" limit="96">
                <txp:if_variable name="--gallery-additional-img-formats" not value="">
                    <picture>
                        <txp:if_variable name="--gallery-additional-img-formats" match="any" value="jxl"><source srcset="<txp:image_url trim="/\.(gif|png|jpe?g)$/" />.jxl" type="image/jxl" /></txp:if_variable>
                        <txp:if_variable name="--gallery-additional-img-formats" match="any" value="avif"><source srcset="<txp:image_url trim="/\.(gif|png|jpe?g)$/" />.avif" type="image/avif" /></txp:if_variable>
                        <txp:if_variable name="--gallery-additional-img-formats" match="any" value="webp"><source srcset="<txp:image_url trim="/\.(gif|png|jpe?g)$/" />.webp" type="image/webp" /></txp:if_variable>
                        <img loading="lazy" src="<txp:image_url />" alt="<txp:image_info type='alt' />" itemprop="image">
                    </picture>
                <txp:else />
                    <img loading="lazy" src="<txp:image_url />" alt="<txp:image_info type='alt' />" itemprop="image">
                </txp:if_variable>
            </txp:images>
        <txp:else />
            <txp:variable name="gallery-fallback" value="1" />
            <img loading="lazy" src="<txp:page_url type="theme_path" />/assets/img/placeholders/img-1080x1080-6.png" alt="Placeholder Image 1" itemprop="image">
            <img loading="lazy" src="<txp:page_url type="theme_path" />/assets/img/placeholders//img-hd-1.png" alt="Placeholder Image 2" itemprop="image">
            <img loading="lazy" src="<txp:page_url type="theme_path" />/assets/img/placeholders//img-hd-2.png" alt="Placeholder Image 3" itemprop="image">
            <img loading="lazy" src="<txp:page_url type="theme_path" />/assets/img/placeholders/img-1080x1080-4.png" alt="Placeholder Image 4" itemprop="image">
            <img loading="lazy" src="<txp:page_url type="theme_path" />/assets/img/placeholders/img-1080x1080-5.png" alt="Placeholder Image 5" itemprop="image">
            <img loading="lazy" src="<txp:page_url type="theme_path" />/assets/img/placeholders//img-hd-3.png" alt="Placeholder Image 6" itemprop="image">
        </txp:evaluate>
    </div>
    <txp:if_variable name="gallery-fallback"><txp:output_form form="instructions">To use this module, please create an an image category named <code>gallery</code> and assign one of more images to that category. Grid layout options can be adjusted by editing the <code>--variables--gallery</code> form template. Module also accepts <code>align=""</code> (allowed values: <code>left</code>, <code>right</code>, <code>center</code>, <code>inline-start</code>, <code>inline-end</code>) and <code>padding-y=""</code> (allowed values: <code>0</code> to <code>5</code>). If used as a container tag, any contained content is yielded above gallery content.</txp:output_form></txp:if_variable>
</section>
