--- layout: default menu: components page-header: Tabler components og-component: true --- {% assign columns = page.columns | default: 0 %} {% capture demo-html %}
{{ content }}
{% endcapture %} {% capture demo-css %} .tabler-demo { padding: 3rem; -webkit-font-smoothing: antialiased; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; width: 100%; } {% endcapture %}
{% assign components = site.components | sort: 'title' %} {% for component in components %} {{ component.title }} {% endfor %}
{{ page.title }}

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi autem dignissimos doloribus, fuga iste omnis reprehenderit ullam veritatis. Ab aut blanditiis dolore eos exercitationem iste quis rerum, tempore unde voluptatem!

0 %}class="flex-fill" style="max-width: {{ columns | times: 298 | minus: 24 }}px"{% endif %}> {{ content }}
{{ content | highlight_tidy: 'html' }}
{% include ui/button.html icon="clipboard" text="Copy code" color="white" block=true class="mt-4" %}
{% include ui/button.html icon="codesandbox" text="Edit in CodePen" color="primary" block=true class="mt-4" element="button" type="submit" %}