embeds-offcanvas.md

Embeds

This theme ships some embeds that hide the complexity of rendering the same elements over and over again with the correct HTML.

Offcanvas

Offcanvas has been implemented to simplify the use of the Tabler Canvas component

Parameters

offcanvas embed, can be used with 3 parameters:

Parameter	Description	Type	Default
id	Id of the container	string	offcanvas- + random numbers
position	Position of the offcanvas (top, end, bottom, start)	string	end
hidden	Defined if show class is used to immediately show offcanvas on create	boolean	true

Content

offcanvas embed, has 2 common blocks:

Block	Description
offcanvas_title	Title in the offcanvas header
offcanvas_body	Content of the offcanvas

See twig file for more customized blocks.

Usage

{% embed '@Tabler/embeds/offcanvas.html.twig' with {position : 'top'} %}
    {% block offcanvas_title 'Top offcanvas' %}
    {% block offcanvas_body %}
    <div>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab assumenda ea est, eum exercitationem
        illum itaque laboriosam magni necessitatibus, nemo nisi numquam quae reiciendis repellat sit soluta.
        Aut!
    </div>
    {% endblock %}
{% endembed %}

{% embed '@Tabler/embeds/offcanvas.html.twig' with {position : 'end', hidden : false} %}
    {% block offcanvas_title 'End offcanvas' %}
{% endembed %}

{% embed '@Tabler/embeds/offcanvas.html.twig' with {position : 'bottom'} %}
    {% block offcanvas_title 'Bottom offcanvas' %}
{% endembed %}

{% embed '@Tabler/embeds/offcanvas.html.twig' with {position : 'start'} %}
    {% block offcanvas_title 'Start offcanvas' %}
{% endembed %}

{% embed '@Tabler/embeds/offcanvas.html.twig' %}
    {% block header %}{% endblock %} {# No Header => Remove X close button #}
{% endembed %}

Next steps

Please go back to the Tabler bundle documentation to find out more about using the theme.