Etat Pur Design System

Template Push 

<div class="push push-">
    <div class="flex flex-col flex-grow">
        <span class="text-body-base">

        </span>
    </div>
    <button type="button" aria-label="Label text" class=" btn  btn-light  btn-simple  btn-size-md btn-only-icon">
        <svg class=" shrink-0" width="24" height="24" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
            <path d="M6 18 18 6M6 6l12 12" stroke="currentColor" stroke-width="1.5" fill="none" />

        </svg>

    </button>
</div>
 
<div class="push push-{{ color }}">
    {% if(icon.name) %}
        {% render "@icons-" ~ icon.name with {
            width: 32,
            height: 32,
            iconClass: 'push-svg'
        } %}
    {% endif %}
    <div class="flex flex-col flex-grow">
        {% if title %}
            <span class="text-body-base font-bold">
                {{ title }}
            </span>
        {% endif %}
        <span class="text-body-base">
            {{ description }}
        </span>
    </div>
    {% if showCross|default(true) %}
        {% render "@template-button" with {
            color: color,
            size: 'md',
            type: 'simple',
            icon_type: 'only-icon',
            icon: {
                name: 'heroicons--x-mark-outline',
            }
        } %}
    {% endif %}
</div>
 
{
  "label": "Link"
}

No notes defined.