{% load i18n %}
{% if feature %}
    <div class="alert alert-light border d-flex gap-3 mb-4" id="example-about">
        <i class="fa-solid fa-circle-info fs-4 text-secondary mt-1" aria-hidden="true"></i>
        <div>
            <h6 class="mb-1">{% blocktranslate with title=feature.title %}About this example — {{ title }}{% endblocktranslate %}</h6>
            <p class="mb-2">{{ feature.about }}</p>
            <p class="mb-0 small text-muted" id="example-look-at">
                <i class="fa-solid fa-code" aria-hidden="true"></i>
                {% translate "Look at" %}: <code>examples/bootstrap5/{{ feature.app }}/</code> — {{ feature.look_at }}
            </p>
        </div>
    </div>
{% endif %}