Skip to content

Latest commit

 

History

History
41 lines (31 loc) · 1.67 KB

components-status-indicator.md

File metadata and controls

41 lines (31 loc) · 1.67 KB

Components

This theme ships some components (as twig macros) that hide the complexity of rendering the same elements over and over again with the correct HTML.

Status indicator

Status indicator has been implemented to simplify the use of the Tabler Status indicator component

Parameters

status_indicator() macro, waits for 1 parameter:

Parameter Description Type Default
options Options object object {}

Options

Parameter Description Type Default
color Color of the indicator string green
animated Set if the indicator is animated boolean true
extraClass Allow to add extra classes string empty string

Usage

{% from '@Tabler/components/status_indicator.html.twig' import status_indicator %}

<div class="row align-items-center text-start">
    <div class="col p-0">
        {{ status_indicator({color : item.open ? 'green' : 'red', animated : false, extraClass :'float-end' }) }}
    </div>
    <div class="col p-0">
        {{ item.open ? 'label.opened'|trans : 'label.closed'|trans }}
    </div>
</div>

Preview

image

Next steps

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