Card

Definition

A card is a container that groups related information in a cohesive block, often with a consistent look and feel. Cards are used to present information in a structured and organized manner, making it easier for users to digest content.

Common examples include:

• app_name_list_card.html
• app_name_detail_card.html

Example

{% extends 'django_spire/card/title_card.html' %}

{% block card_title %}
    🍔 Food Card 🍕
{% endblock %}

{% block card_title_content %}
    <div class="card-body">
        🍦 This card contains delicious food emojis! 🍩
    </div>
{% endblock %}

{% block card_button %}
    <div @click="toggle_card_title_dropdown()">
        <a class="btn btn-sm btn-primary" href="#">
            Toggle Food Dropdown
        </a>
    </div>
{% endblock %}

{% block card_dropdown_content %}
    <p>Chicken 🍗 and Beer 🍻</p>
{% endblock %}