{% use '@Contao/component/_stylesheet.html.twig' %}

{# Add the colorbox style sheet #}
{% add 'colorbox' to stylesheets %}
    {% with {file: 'assets/colorbox/css/colorbox.min.css'} %}{{ block('stylesheet_component') }}{% endwith %}
{% endadd %}

<script src="{{ asset('js/colorbox.min.js', 'contao-components/colorbox') }}"></script>
<script{{ attrs().setIfExists('nonce', csp_nonce('script-src')) }}>
    jQuery(function($) {
        $('a[data-lightbox]').map(function() {
            $(this).colorbox({
                // Put custom options here
                loop: false,
                rel: $(this).attr('data-lightbox'),
                maxWidth: '95%',
                maxHeight: '95%'
            });
        });
    });
</script>
