<section
    id="id_applet_my_sign"
    style="--applet-cols: {{ entry.applet.grid_cols }}; --applet-rows: {{ entry.applet.grid_rows }};"
>
    <h2><a href="{% url 'billboard:my_sign' %}">My Sign</a></h2>
    <div class="my-sign-applet-body">
        {% if request.user.significator %}
            {% with card=request.user.significator %}
            <div class="my-sign-applet-card{% if request.user.significator_reversed %} stage-card--reversed{% endif %}"
                 data-card-id="{{ card.id }}">
                <div class="fan-card-corner fan-card-corner--tl">
                    <span class="fan-corner-rank">{{ card.corner_rank }}</span>
                    {% if card.suit_icon %}<i class="fa-solid {{ card.suit_icon }}"></i>{% endif %}
                </div>
                <p class="fan-card-name">{{ card.name_title }}</p>
            </div>
            {% endwith %}
        {% else %}
            <p class="my-sign-applet-empty">No sign chosen yet.</p>
        {% endif %}
    </div>
</section>
