{% extends 'django_spire/theme/card/base_preview_card.html' %}

{% block card_title %}Typography{% endblock %}


{% block card_button %}
    {% url 'django_spire:theme:page:typography' as typography_url %}
    {% include 'django_spire/button/primary_button.html' with button_text='Full Preview' button_href=typography_url %}
{% endblock %}

{% block preview_card_icon %}bi bi-type{% endblock %}

{% block preview_card_subtitle %}
    Text Styles
{% endblock %}

{% block preview_card_description %}
    View all heading styles and font sizes
{% endblock %}

{% block preview_card_content %}
    <div class="preview-sample d-flex justify-content-center">
        <div class="col-4 text-start">
            <div class="fs-4">Heading</div>
            <div class="fs-6">Subheading</div>
            <div class="fs--1">Small text</div>
            <a href="#">Link</a>
        </div>
    </div>
{% endblock %}