گروه فهرست

<ul class="list-group">
    <li class="list-group-item">
        <div class="d-flex align-items-center">
            <span class="avatar avatar-sm">
                <img src="/assets/images/faces/1.jpg" alt="img">
            </span>
            <div class="ms-2 fw-medium">
                نگین
            </div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="d-flex align-items-center">
            <span class="avatar avatar-sm">
                <img src="/assets/images/faces/3.jpg" alt="img">
            </span>
            <div class="ms-2 fw-medium">
                مهسا
            </div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="d-flex align-items-center">
            <span class="avatar avatar-sm">
                <img src="/assets/images/faces/6.jpg" alt="img">
            </span>
            <div class="ms-2 fw-medium">
               مریم
            </div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="d-flex align-items-center">
            <span class="avatar avatar-sm">
                <img src="/assets/images/faces/15.jpg" alt="img">
            </span>
            <div class="ms-2 fw-medium">
                مسیح
            </div>
        </div>
    </li>
    <li class="list-group-item">
        <div class="d-flex align-items-center">
            <span class="avatar avatar-sm">
                <img src="/assets/images/faces/13.jpg" alt="img">
            </span>
            <div class="ms-2 fw-medium">
                مهران
            </div>
        </div>
    </li>
</ul>

<ul class="list-group">
<li class="list-group-item active" aria-current="true">
    <div class="d-flex align-items-center">
        <div>
            <i class="bi bi-house-door fs-19"></i>
        </div>
        <div class="ms-2">
            خانه
        </div>
    </div>
</li>
<li class="list-group-item">
    <div class="d-flex align-items-center">
        <div>
            <i class="bi bi-bell fs-19"></i>
        </div>
        <div class="ms-2">
            اعلانات
        </div>
    </div>
</li>
<li class="list-group-item">
    <div class="d-flex align-items-center">
        <div>
            <i class="bi bi-gift fs-19"></i>
        </div>
        <div class="ms-2">
            ارسال پیام
        </div>
    </div>
</li>
<li class="list-group-item">
    <div class="d-flex align-items-center">
        <div>
            <i class="bi bi-person fs-19"></i>
        </div>
        <div class="ms-2">
           درخواست جدید
        </div>
    </div>
</li>
<li class="list-group-item">
    <div class="d-flex align-items-center">
        <div>
            <i class="bi bi-trash3 fs-19"></i>
        </div>
        <div class="ms-2">
           حذف پیام
        </div>
    </div>
</li>
</ul>

<ul class="list-group list-group-flush">
    <li class="list-group-item fw-medium"><i class="bi bi-envelope align-middle me-2 text-muted"></i>آقای محمدی<span class="ms-1 text-muted fw-normal d-inline-block">091212345678</span></li>
    <li class="list-group-item fw-medium"><i class="bi bi-tiktok align-middle me-2 text-muted"></i>آقای صالحی<span class="ms-1 text-muted fw-normal d-inline-block">091212345678</span></li>
    <li class="list-group-item fw-medium"><i class="bi bi-whatsapp align-middle me-2 text-muted"></i>خانم کمالی<span class="ms-1 text-muted fw-normal d-inline-block">091212345678</span></li>
    <li class="list-group-item fw-medium"><i class="bi bi-facebook align-middle me-2 text-muted"></i>خانم نوری<span class="ms-1 text-muted fw-normal d-inline-block">091212345678</span></li>
    <li class="list-group-item fw-medium"><i class="bi bi-instagram align-middle me-2 text-muted"></i>خانم نصیری<span class="ms-1 text-muted fw-normal d-inline-block">091212345678</span></li>
</ul>

<ul class="list-group">
                <li class="list-group-item disabled" aria-disabled="true">مورد غیرفعالی که قرار است غیرفعال باشد
                </li>
                <li class="list-group-item">متن نمونه‌ای ساده از چاپ</li>
                <li class="list-group-item">انواع مختلفی از متون وجود دارد</li>
                <li class="list-group-item">تمامی تولیدکنندگان لورم اپیسوم</li>
                <li class="list-group-item">در سال ۴۵ پیش از میلاد نوشته شده است. این کتاب یک رساله در مورد نظریه است</li>
            </ul>

<div class="list-group">
    <a href="javascript:void(0);" class="list-group-item list-group-item-action active"
        aria-current="true">
        <div class="d-flex align-items-center">
            <div>
                <span class="avatar avatar-xs bg-white text-default avatar-rounded">
                    C
                </span>
            </div>
            <div class="ms-2">کالیفرنیا</div>
        </div>
    </a>
    <a href="javascript:void(0);" class="list-group-item list-group-item-action">
        <div class="d-flex align-items-center">
            <div>
                <span class="avatar avatar-xs bg-secondary avatar-rounded">
                    N
                </span>
            </div>
            <div class="ms-2">نیوجرسی</div>
        </div>
    </a>
    <a href="javascript:void(0);" class="list-group-item list-group-item-action">
        <div class="d-flex align-items-center">
            <div>
                <span class="avatar avatar-xs bg-info avatar-rounded">
                    L
                </span>
            </div>
            <div class="ms-2">لس آنجلس</div>
        </div>
    </a>
    <a href="javascript:void(0);" class="list-group-item list-group-item-action">
        <div class="d-flex align-items-center">
            <div>
                <span class="avatar avatar-xs bg-warning avatar-rounded">
                    M
                </span>
            </div>
            <div class="ms-2">میامی فلوریدا</div>
        </div>
    </a>
    <a class="list-group-item list-group-item-action disabled">
        <div class="d-flex align-items-center">
            <div>
                <span class="avatar avatar-xs bg-success avatar-rounded">
                    W
                </span>
            </div>
            <div class="ms-2">واشنگتن دی سی</div>
        </div>
    </a>
</div>

<div class="list-group">
    <button type="button" class="list-group-item list-group-item-action active" aria-current="true">به سادگی متن ساختگی چاپ<span class="badge float-end bg-primary">243</span></button>
    <button type="button" class="list-group-item list-group-item-action">انواع مختلفی از معابر وجود دارد<span class="badge float-end bg-secondary-transparent">35</span></button>
    <button type="button" class="list-group-item list-group-item-action">تمام ژنراتورهای لورم ایپسوم<span class="badge float-end bg-info-transparent">132</span></button>
    <button type="button" class="list-group-item list-group-item-action">تمام ژنراتورهای لورم ایپسوم<span class="badge float-end bg-success-transparent">2525</span></button>
    <button type="button" class="list-group-item list-group-item-action" disabled>یک مورد غیرفعال به معنای غیرفعال شدن است<span class="badge float-end bg-danger-transparent">21</span></button>
</div>

<ul class="list-group">
            <li class="list-group-item">یک آیتم لیست پیش فرض ساده</li>
        
            <li class="list-group-item list-group-item-primary">یک آیتم لیست اصلی ساده</li>
            <li class="list-group-item list-group-item-secondary">یک آیتم لیست فرعی ساده</li>
            <li class="list-group-item list-group-item-success">یک آیتم لیست موفقیت ساده</li>
            <li class="list-group-item list-group-item-danger">یک آیتم لیست خطر ساده</li>
            <li class="list-group-item list-group-item-warning">یک آیتم لیست هشدار ساده</li>
            <li class="list-group-item list-group-item-info">یک آیتم لیست اطلاعاتی ساده</li>
            <li class="list-group-item list-group-item-light">یک آیتم لیست روشن ساده</li>
            <li class="list-group-item list-group-item-dark">یک آیتم لیست تاریک ساده</li>
        </ul>

<div class="list-group">
            <a href="javascript:void(0);" class="list-group-item list-group-item-action">یک آیتم لیست پیش فرض ساده</a>
        
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-primary">آیتم گروه لیست اولیه ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-secondary">آیتم گروه لیست ثانویه ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-success">آیتم گروه لیست موفقیت ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-danger">آیتم گروه لیست خطرناک ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-warning">آیتم گروه لیست هشدار ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-info">آیتم گروه لیست اطلاعات ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-light">آیتم گروه لیست روشن ساده</a>
            <a href="javascript:void(0);"
                class="list-group-item list-group-item-action list-group-item-dark">آیتم گروه لیست تاریک ساده</a>
        </div>

<ul class="list-group">
                <li class="list-group-item">یک آیتم لیست پیش فرض ساده</li>
            
                <li class="list-group-item list-item-solid-primary">یک آیتم ساده در گروه لیست اصلی</li>
                <li class="list-group-item list-item-solid-secondary">یک آیتم ساده در گروه لیست فرعی</li>
                <li class="list-group-item list-item-solid-success">یک آیتم ساده در گروه لیست موفق</li>
                <li class="list-group-item list-item-solid-danger">یک آیتم ساده در گروه لیست خطرناک</li>
                <li class="list-group-item list-item-solid-warning">یک آیتم ساده در گروه لیست هشدار</li>
                <li class="list-group-item list-item-solid-info">یک آیتم ساده در گروه لیست اطلاعات</li>
                <li class="list-group-item list-item-solid-light">یک آیتم ساده در گروه لیست روشن</li>
                <li class="list-group-item list-item-solid-dark text-white">یک آیتم ساده در گروه لیست تاریک</li>
            </ul>

<div class="list-group">
            <a href="javascript:void(0);" class="list-group-item list-group-item-action active"
                aria-current="true">
                <div class="d-flex w-100 justify-content-between">
                    <h6 class="mb-1 fw-medium">آیا ویرایشگرهای صفحات وب اکنون از لورم ایپسوم استفاده می‌کنند؟</h6>
                    <small>3 روز پیش</small>
                </div>
                <p class="mb-1">انواع مختلفی از معابر وجود دارد از لورم ایپسوم در دسترس است، اما اکثر آن‌ها در برخی از اشکال دچار تغییرات شده‌اند، با شوخی تزریق شده.</p>
                <small>24 تیر 1403.</small>
            </a>
            <a href="javascript:void(0);" class="list-group-item list-group-item-action">
                <div class="d-flex w-100 justify-content-between">
                    <h6 class="mb-1 fw-medium">ریچارد مک کلینتوک، استاد لاتین؟</h6>
                    <small class="text-muted">4 ساعت پیش</small>
                </div>
                <p class="mb-1">برخلاف باور عمومی، لورم ایپسوم تنها متنی تصادفی نیست. ریشه در یک قطعه از ادبیات کلاسیک لاتین دارد.</p>
                <small class="text-muted">24 تیر 1403.</small>
            </a>
            <a href="javascript:void(0);" class="list-group-item list-group-item-action">
                <div class="d-flex w-100 justify-content-between">
                    <h6 class="mb-1 fw-medium">آیا از دیکشنری بیش از 200 کلمه لاتین استفاده می‌کند؟</h6>
                    <small class="text-muted">15 ساعت پیش</small>
                </div>
                <p class="mb-1">لورم ایپسوم از زمان‌های دور به عنوان متن استاندارد صنعت استفاده می‌شود.</p>
                <small class="text-muted">24 تیر 1403.</small>
            </a>
            <a href="javascript:void(0);" class="list-group-item list-group-item-action">
                <div class="d-flex w-100 justify-content-between">
                    <h6 class="mb-1 fw-medium">آیا لورم ایپسوم استاندارد از قرن پانزدهم استفاده می‌شود؟</h6>
                    <small class="text-muted">45 دقیقه پیش</small>
                </div>
                <p class="mb-1">تمام ژنراتورهای لورم ایپسوم در اینترنت تمایل دارند بخش‌های از پیش تعیین شده را تکرار کنند، به این ترتیب این اولین ژنراتور واقعی در اینترنت است.</p>
                <small class="text-muted">24 تیر 1403.</small>
            </a>
        </div>

<ol class="list-group list-group-numbered">
                <li class="list-group-item d-sm-flex justify-content-between align-items-start">
                    <div class="ms-2 me-auto text-muted">
                        <div class="fw-medium fs-14 text-default">چه اتفاقی افتاد؟</div>
                        بسیاری از کارشناسان اخیراً پیشنهاد کرده‌اند که ممکن است وجود داشته باشد.
                    </div>
                    <span class="badge bg-primary-transparent">32 مشاهده</span>
                </li>
                <li class="list-group-item d-sm-flex justify-content-between align-items-start">
                    <div class="ms-2 me-auto text-muted">
                        <div class="fw-medium fs-14 text-default">شگفت‌انگیز بود!</div>
                        ایده او شامل برداشتن قرمز بود.
                    </div>
                    <span class="badge bg-secondary-transparent">52 مشاهده</span>
                </li>
                <li class="list-group-item d-sm-flex justify-content-between align-items-start">
                    <div class="ms-2 me-auto text-muted">
                        <div class="fw-medium fs-14 text-default">اخبار یک سلاح قدرتمند است.</div>
                        اخبار می‌تواند به روش‌های مختلف تأثیر بگذارد.
                    </div>
                    <span class="badge bg-success-transparent">1,204 مشاهده</span>
                </li>
                <li class="list-group-item d-sm-flex justify-content-between align-items-start">
                    <div class="ms-2 me-auto text-muted">
                        <div class="fw-medium fs-14 text-default">اکثریت دچار آسیب شده‌اند.</div>
                        اگر قصد دارید از قسمتی از لورم ایپسوم استفاده کنید، باید مطمئن شوید که چیزی در آن وجود ندارد.
                    </div>
                    <span class="badge bg-danger-transparent">14 مشاهده</span>
                </li>
            </ol>

<ol class="list-group list-group-numbered">
    <li class="list-group-item">به سادگی متن ساختگی چاپ.</li>
    <li class="list-group-item">انواع مختلفی از معابر وجود دارد.</li>
    <li class="list-group-item">تمام ژنراتورهای لورم ایپسوم.</li>
    <li class="list-group-item">نوشته شده در 45 قبل از میلاد. این کتاب رساله ای در نظریه است.</li>
    <li class="list-group-item">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ</li>
    <li class="list-group-item">.لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ</li>
</ol>

<div class="list-group">
    <label class="list-group-item">
        <input class="form-check-input me-1" type="radio" value=""
            name="list-radio" checked>
           .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </label>
    <label class="list-group-item">
        <input class="form-check-input me-1" type="radio" value=""
            name="list-radio" checked>
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </label>
    <label class="list-group-item">
        <input class="form-check-input me-1" type="radio" value=""
            name="list-radio" checked>
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </label>
    <label class="list-group-item">
        <input class="form-check-input me-1" type="radio" value=""
            name="list-radio">
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم 
    </label>
    <label class="list-group-item">
        <input class="form-check-input me-1" type="radio" value=""
            name="list-radio">
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </label>
    <label class="list-group-item">
        <input class="form-check-input me-1" type="radio" value=""
            name="list-radio">
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </label>
</div>

<ul class="list-group">
    <li class="list-group-item">
        <input class="form-check-input me-1 fw-medium" type="checkbox" value=""
            aria-label="..." checked>
           .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </li>
    <li class="list-group-item">
        <input class="form-check-input me-1 fw-medium" type="checkbox" value=""
            aria-label="...">
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </li>
    <li class="list-group-item">
        <input class="form-check-input me-1 fw-medium" type="checkbox" value=""
            aria-label="..." checked>
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </li>
    <li class="list-group-item">
        <input class="form-check-input me-1 fw-medium" type="checkbox" value=""
            aria-label="..." checked>
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم 
    </li>
    <li class="list-group-item">
        <input class="form-check-input me-1 fw-medium" type="checkbox" value=""
            aria-label="...">
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </li>
    <li class="list-group-item">
        <input class="form-check-input me-1 fw-medium" type="checkbox" value=""
            aria-label="...">
            .لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
    </li>
</ul>

<ul class="mb-3 list-group list-group-horizontal">
    <li class="list-group-item">یک آیتم</li>
    <li class="list-group-item">یک آیتم دوم</li>
    <li class="list-group-item">یک آیتم سوم</li>
</ul>
<ul class="mb-3 list-group list-group-horizontal-sm">
    <li class="list-group-item">یک آیتم</li>
    <li class="list-group-item">یک آیتم دوم</li>
    <li class="list-group-item">یک آیتم سوم</li>
</ul>
<ul class="mb-3 list-group list-group-horizontal-md">
    <li class="list-group-item">یک آیتم</li>
    <li class="list-group-item">یک آیتم دوم</li>
    <li class="list-group-item">یک آیتم سوم</li>
</ul>
<ul class="mb-3 list-group list-group-horizontal-lg">
    <li class="list-group-item">یک آیتم</li>
    <li class="list-group-item">یک آیتم دوم</li>
    <li class="list-group-item">یک آیتم سوم</li>
</ul>
<ul class="mb-3 list-group list-group-horizontal-xl">
    <li class="list-group-item">یک آیتم</li>
    <li class="list-group-item">یک آیتم دوم</li>
    <li class="list-group-item">یک آیتم سوم</li>
</ul>
<ul class="mb-3 list-group list-group-horizontal-xxl">
    <li class="list-group-item">یک آیتم</li>
    <li class="list-group-item">یک آیتم دوم</li>
    <li class="list-group-item">یک آیتم سوم</li>
</ul>

<ul class="list-group">
    <li
        class="list-group-item d-flex justify-content-between align-items-center fw-medium">
        مواد غذایی
        <span class="badge bg-primary">موجود</span>
    </li>
    <li
        class="list-group-item d-flex justify-content-between align-items-center fw-medium">
        مبلمان
        <span class="badge bg-secondary">خرید</span>
    </li>
    <li
        class="list-group-item d-flex justify-content-between align-items-center fw-medium">
        زیبایی
        <span class="badge bg-danger rounded-pill">32</span>
    </li>
    <li
        class="list-group-item d-flex justify-content-between align-items-center fw-medium">
        کتاب ها
        <span class="badge bg-light text-default">جدید</span>
    </li>
    <li
        class="list-group-item d-flex justify-content-between align-items-center fw-medium">
        اسباب بازی
        <span class="badge bg-info-gradient">داغ</span>
    </li>
    <li
        class="list-group-item d-flex justify-content-between align-items-center fw-medium">
        موبایل ها
        <span class="badge bg-warning">فروخته شد</span>
    </li>
</ul>