{block name='snippets-alert'}
    <div role="alert"
        class="alert-wrapper alert {if $alert->getCssType()}alert-{$alert->getCssType()}{/if}"
        {if $alert->getId()}id="{$alert->getId()}"{/if}
        data-fade-out="{$alert->getFadeOut()}"
        data-key="{$alert->getKey()}"
        aria-live="assertive"
        aria-atomic="true"
    >
        <div class="sr-only">x</div>

        {if $alert->getIcon()}
            <i class="{if $alert->getIcon() === 'success'}{et_getIcon key="alertSuccess"}{elseif $alert->getIcon() === 'wrning'}{et_getIcon key="alertWarning"}{elseif $alert->getIcon() === 'danger'}{et_getIcon key="alertDanger"}{elseif $alert->getIcon() === 'info'}{et_getIcon key="alertInfo"}{/if}"></i>
        {/if}
        {if $alert->getDismissable()}<div class="close"><i class="{et_getIcon key="close"}"></i></div>{/if}
        {if !empty($alert->getLinkHref()) && empty($alert->getLinkText())}
            <a href="{$alert->getLinkHref()}">{$alert->getMessage()}</a>
        {elseif !empty($alert->getLinkHref()) && !empty($alert->getLinkText())}
            {$alert->getMessage()}
            <a href="{$alert->getLinkHref()}">{$alert->getLinkText()}</a>
        {else}
            {$alert->getMessage()}
        {/if}
    </div>
{/block}
