List Item: Transaction State

No notes defined.

<a href="" class="sds-listItem sds-hoverContentSecondary">
    <div class="sds-transactionState -paid -textHelper -hasBg sds-listItem__transactionState">
        <div class="sds-icon sds-icon-checkcircleborder" aria-hidden="true"></div>
        <div class="sds-transactionState__text">Comptabilisé</div>

    </div>

    <div class="sds-listItem__rightContent">

        <div class="sds-amount -amountSm -secondary100">
            <span class="sds-amount__value">{#.###.###}</span>

            <span class="sds-amount__currency">€</span>

        </div>

        <span class="sds-iconCircle sds-hoverContentSecondary__icon" aria-hidden="true">

            <span class="sds-icon sds-icon-chevronright"></span>

        </span>

    </div>

</a>
 
<{{ eltType }}
{% if eltType === "button" %} type="button"{% elseif eltType === "a" %} href="{{ href }}"{%- endif -%}
class="{{ namespace }}listItem {{ namespace }}hoverContentSecondary{% for mod in modifiers %} {{ mod }}{% endfor %}{% for mod in classes %} {{ mod }}{% endfor %}"
{% for attrKey, attr in attrs %} {{ attrKey }}="{{ attr }}"{% endfor %}
>
{% render "@snet-transaction-state"+stateType,{
	text: stateText,
	icon: stateIcon,
	classes: stateClasses
}, true %}
{% if rightContent %}
	<div class="{{ namespace }}listItem__rightContent">
		{% if helperText %}
{#			<div class="{{ namespace }}listItem__secondary100 {{ namespace }}textSemiBold {{ namespace }}textHelper">{{ helperText }}</div>#}
			{% render "@amount--medium",{
				classes: ["-secondary100"],
				text: "{#.###.###}"
			},true %}
		{% endif %}
		{% if iconRight %}
			{%- if (eltType === "button") or (eltType === "a") %}
				{% render "@icon-circle-regular--default",{classes: [namespace+"hoverContentSecondary__icon"], icon: iconRight.icon},true %}
			{% else %}
				{% render "@icon-btn-regular--secondary-10",{icon: iconRight.icon},true %}
			{%- endif %}
		{% endif %}
	</div>
{% endif %}
</{{ eltType }}>