{% extends 'layout-vertical.html' %}

{% load static i18n %}

{% block title %}Rizz{% endblock %}

{% block page_content %}

<div class="row justify-content-center">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <div class="row align-items-center">
                    <div class="col">
                        <h4 class="card-title mb-1">Iconoir Icons</h4>
                        <p class="text-muted mb-0">Use <code
                                class="fs-14">&lt;i class="iconoir-cycling"&gt;&lt;/i&gt;</code></p>
                    </div><!--end col-->
                </div> <!--end row-->
            </div><!--end card-header-->
            <div class="card-body pt-0">
                <div class="row icon-demo-content">
                    <div class="col-sm-6 col-md-4 col-lg-3 d-grid">
                        <i class="iconoir-cycling"></i> iconoir-cycling
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-cinema-old"></i> iconoir-cinema-old
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-flower"></i> iconoir-flower
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-fire-flame"></i> iconoir-fire-flame
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-no-smoking-circle"></i> iconoir-no-smoking-circle
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-palette"></i> iconoir-palette
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-report-columns"></i> iconoir-report-columns
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-reports-solid"></i> iconoir-reports-solid
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-soccer-ball"></i> iconoir-soccer-ball
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-trophy"></i> iconoir-trophy
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-wolf"></i> iconoir-wolf
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-keyframes-couple"></i> iconoir-keyframes-couple
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-microphone"></i> iconoir-microphone
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-microphone-mute"></i> iconoir-microphone-mute
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-priority-down"></i> iconoir-priority-down
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-dollar-circle"></i> iconoir-dollar-circle
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-umbrella"></i> iconoir-umbrella
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-quote-solid"></i> iconoir-quote-solid
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-suitcase"></i> iconoir-suitcase
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-cloud-upload"></i> iconoir-cloud-upload
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-bell"></i> iconoir-bell
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-bell-off"></i> iconoir-bell-off
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-chat-bubble"></i> iconoir-chat-bubble
                    </div>
                    <div class="col-sm-6 col-md-4 col-lg-3  d-grid">
                        <i class="iconoir-mail"></i> iconoir-mail
                    </div>
                </div><!--end row-->
                <div class="p-3 border border-primary bg-primary-subtle rounded">
                    <div class="row">
                        <div class="col">
                            <h5 class="text-primary fs-18 mb-1 fw-semibold">Iconoir Icons</h5>
                            <p class="text-muted mb-0 fs-14">A high-quality selection of free icons. Your new
                                alternative to Noun Project, Flaticon, and all Figma resources. Available in SVG, Font,
                                React, React Native, Flutter, Figma and Framer.</p>
                        </div> <!--end col-->
                        <div class="col-auto align-self-center">
                            <a href="https://iconoir.com/" target="_blank" type="button" class="btn btn-primary">More
                                Icons</a>
                        </div> <!--end col-->
                    </div><!--end row-->
                </div><!--end div-->
            </div><!--end card-body-->
        </div><!--end card-->
    </div> <!--end col-->
</div><!--end row-->

{% endblock page_content %}