فهرست
- یک مورد
- یک مورد دوم
- یک مورد سوم
- مورد چهارم
- و مورد پنجم
<div class="card">
<div class="card-header">
<h5>Default lists</h5>
</div>
<div class="card-body">
<ul class="list-group">
<li class="list-group-item">یک مورد</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>
</div>
<div class="card">
<div class="card-header">
<h5>موارد فعال</h5>
</div>
<div class="card-body">
<ul class="list-group list-items-active">
<li class="list-group-item list-active active" aria-current="true"><i
class="ti ti-arrow-badge-right"></i> یک مورد فعال</li>
<li class="list-group-item list-active"><i class="ti ti-arrow-badge-right"></i> یک مورد دوم</li>
<li class="list-group-item list-active"><i class="ti ti-arrow-badge-right"></i> یک مورد سوم</li>
<li class="list-group-item list-active"><i class="ti ti-arrow-badge-right"></i> مورد چهارم</li>
<li class="list-group-item list-active"><i class="ti ti-arrow-badge-right"></i> و مورد پنجم
</li>
</ul>
</div>
</div>
<div class="card">
<div class="card-header">
<h5>Links</h5>
</div>
<div class="card-body gap-2 d-flex flex-column">
<div class="list-group list-link ">
<a href="#" class="list-group-item list-group-item-action active" aria-current="true">
<i class="ti ti-unlink"></i> The current link item
</a>
<a href="#" class="list-group-item list-group-item-action"><i class="ti ti-unlink"></i> A second
link item</a>
<a href="#" class="list-group-item list-group-item-action"><i class="ti ti-unlink"></i> A third
link item</a>
<a href="#" class="list-group-item list-group-item-action"><i class="ti ti-unlink"></i> A fourth
link item</a>
<a class="list-group-item list-group-item-action disabled"><i class="ti ti-unlink"></i> A disabled
link item</a>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h5>buttons</h5>
</div>
<div class="card-body gap-2 d-flex flex-column">
<div class="list-group list-button">
<button type="button" class="list-group-item list-group-item-action active" aria-current="true">
<i class="ti ti-arrow-autofit-right"></i> The current button
</button>
<button type="button" class="list-group-item list-group-item-action"><i
class="ti ti-arrow-autofit-right"></i> A second button item</button>
<button type="button" class="list-group-item list-group-item-action"><i
class="ti ti-arrow-autofit-right"></i> A third button item</button>
<button type="button" class="list-group-item list-group-item-action"><i
class="ti ti-arrow-autofit-right"></i> A fourth button item</button>
<button type="button" class="list-group-item list-group-item-action" disabled><i
class="ti ti-arrow-autofit-right"></i> A disabled button
item</button>
</div>
</div>
</div>
- یک مورد
- یک مورد دوم
- یک مورد سوم
- مورد چهارم
- و مورد پنجم
<div class="card">
<div class="card-header">
<h5>Flush</h5>
</div>
<div class="card-body">
<ul class="list-group list-group-flush">
<li class="list-group-item"><i class="ti ti-transition-right"></i> یک مورد
</li>
<li class="list-group-item"><i class="ti ti-transition-right"></i> A second
item</li>
<li class="list-group-item"><i class="ti ti-transition-right"></i> A third
item</li>
<li class="list-group-item"><i class="ti ti-transition-right"></i> A fourth
item</li>
<li class="list-group-item"><i class="ti ti-transition-right"></i> And a
fifth one</li>
</ul>
</div>
</div>
-
Content for list itemSubheading7
-
Content for list itemSubheading9
-
Content for list itemSubheading11
<div class="card">
<div class="card-header">
<h5>Numbered</h5>
</div>
<div class="card-body">
<ol class="list-group list-group-numbered p-1">
<li class="list-group-item d-flex justify-content-between align-items-start text-primary">
<div class="ms-2 w-100">
<div class="w-100 d-flex justify-content-between align-items-center">
<div class="fw-bold me-1">Subheading</div>
<span class="badge text-light-primary rounded-pill">7</span>
</div>
Content for list item
</div>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start text-secondary">
<div class="ms-2 w-100">
<div class="w-100 d-flex justify-content-between align-items-center">
<div class="fw-bold me-1">Subheading</div>
<span class="badge text-light-secondary rounded-pill">9</span>
</div>
Content for list item
</div>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start text-success">
<div class="ms-2 w-100">
<div class="w-100 d-flex justify-content-between align-items-center">
<div class="fw-bold me-1">Subheading</div>
<span class="badge text-light-success rounded-pill ">11</span>
</div>
Content for list item
</div>
</li>
</ol>
</div>
</div>
<div class="card">
<div class="card-header">
<h5>radios</h5>
</div>
<div class="card-body ">
<ul class="list-group d-flex flex-column">
<li class="radio-wrapper ">
<label class="check-box">
<input type="radio" name="radio-group1">
<span class="radiomark outline-primary"></span>
<span class="text-primary me-1">Primary</span>
</label>
</li>
<li class="radio-wrapper ">
<label class="check-box">
<input type="radio" name="radio-group1">
<span class="radiomark outline-secondary"></span>
<span class="text-secondary me-1">Secondary</span>
</label>
</li>
<li class="radio-wrapper ">
<label class="check-box">
<input type="radio" name="radio-group1">
<span class="radiomark outline-success"></span>
<span class="text-success me-1">Success</span>
</label>
</li>
<li class="radio-wrapper ">
<label class="check-box">
<input type="radio" name="radio-group1">
<span class="radiomark outline-danger"></span>
<span class="text-danger me-1">Danger</span>
</label>
</li>
<li class="radio-wrapper ">
<label class="check-box">
<input type="radio" name="radio-group1">
<span class="radiomark outline-warning"></span>
<span class="text-warning me-1">Warning</span>
</label>
</li>
<li class="radio-wrapper ">
<label class="check-box">
<input type="radio" name="radio-group1">
<span class="radiomark outline-info"></span>
<span class="text-info me-1">Info</span>
</label>
</li>
</ul>
</div>
</div>
<div class="card">
<div class="card-header">
<h5>Checkboxes</h5>
</div>
<div class="card-body ">
<ul class="list-group d-flex flex-column ">
<li class="checkbox-wrapper">
<label class="check-box">
<input type="checkbox">
<span class="checkmark outline-primary"></span>
<span class="text-primary me-1">Primary</span>
</label>
</li>
<li class="checkbox-wrapper ">
<label class="check-box">
<input type="checkbox">
<span class="checkmark outline-secondary"></span>
<span class="text-secondary me-1">Secondary</span>
</label>
</li>
<li class="checkbox-wrapper ">
<label class="check-box">
<input type="checkbox">
<span class="checkmark outline-success"></span>
<span class="text-success me-1">Success</span>
</label>
</li>
<li class="checkbox-wrapper ">
<label class="check-box">
<input type="checkbox">
<span class="checkmark outline-danger"></span>
<span class="text-danger me-1">Danger</span>
</label>
</li>
<li class="checkbox-wrapper ">
<label class="check-box">
<input type="checkbox">
<span class="checkmark outline-warning"></span>
<span class="text-warning me-1">Warning</span>
</label>
</li>
<li class="checkbox-wrapper ">
<label class="check-box">
<input type="checkbox">
<span class="checkmark outline-info"></span>
<span class="text-info me-1">Info</span>
</label>
</li>
</ul>
</div>
</div>
- یک مورد
- یک مورد دوم
- یک مورد سوم
- یک مورد
- یک مورد دوم
- یک مورد سوم
- یک مورد
- یک مورد دوم
- یک مورد سوم
- یک مورد
- یک مورد دوم
- یک مورد سوم
<div class="card">
<div class="card-header">
<h5>افقی</h5>
</div>
<div class="card-body list-horizontal gap-2 d-flex flex-column align-items-center">
<ul class="list-group list-group-horizontal">
<li class="list-group-item b-1-primary bg-light-primary">یک مورد</li>
<li class="list-group-item b-1-primary bg-light-primary">یک مورد دوم</li>
<li class="list-group-item b-1-primary bg-light-primary">یک مورد سوم</li>
</ul>
<ul class="list-group list-group-horizontal-sm ">
<li class="list-group-item b-r-1 b-1-secondary">یک مورد</li>
<li class="list-group-item b-r-1 b-1-secondary">یک مورد دوم</li>
<li class="list-group-item b-r-1 b-1-secondary">یک مورد سوم</li>
</ul>
<ul class="list-group list-group-horizontal-lg ">
<li class="list-group-item list-radius-left-horizontal b-1-success">یک مورد
</li>
<li class="list-group-item b-1-success">یک مورد دوم</li>
<li class="list-group-item list-radius-right-horizontal b-1-success">A third
item</li>
</ul>
<ul class="list-group list-group-horizontal-md ">
<li class="list-group-item b-1-danger">یک مورد</li>
<li class="list-group-item b-1-danger">یک مورد دوم</li>
<li class="list-group-item b-1-danger">یک مورد سوم</li>
</ul>
</div>
</div>
- یک لیست آیتم default ساده
- یک لیست آیتم primary ساده
- یک لیست آیتم secondary ساده
- یک لیست آیتم success ساده
- یک لیست آیتم danger ساده
- یک لیست آیتم warning ساده
- یک لیست آیتم info ساده
- یک لیست آیتم light ساده
- یک لیست آیتم dark ساده
<div class="card">
<div class="card-header">
<h5>Variants</h5>
</div>
<div class="card-body">
<ul class="list-group">
<li class="list-group-item">یک لیست آیتم default ساده</li>
<li class="list-group-item text-light-primary">یک لیست آیتم primary ساده item</li>
<li class="list-group-item text-light-secondary">یک لیست آیتم secondary ساده item</li>
<li class="list-group-item text-light-success">یک لیست آیتم success ساده item</li>
<li class="list-group-item text-light-danger">یک لیست آیتم danger ساده item</li>
<li class="list-group-item text-light-warning">یک لیست آیتم warning ساده item</li>
<li class="list-group-item text-light-info">یک لیست آیتم info ساده
</li>
<li class="list-group-item text-light-light">یک لیست آیتم light ساده
</li>
<li class="list-group-item text-light-dark">یک لیست آیتم dark ساده
</li>
</ul>
</div>
</div>
محتوای سفارشی
-
Allen Rollins
Allen@509
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Atque nam accusantium ipsum?
3 روز پیش -
3
Holly Mckenzie
Holly@567
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Atque nam accusantium ipsum?
3 روز پیش -
Justin Park
Park@001
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Atque nam accusantium ipsum?
3 روز پیش
مخاطبین
-
Leland Franecki
He wanted her job, and it would be easy enough.. -
Rafael Veum
He didn't want to go out on such a night but... -
Ray Schamberger
The girl shouldn't have been sacked but if he said.. -
Mack Gutkowski
Everything about her was a lie -
Mack Gutkowski
She had followed the woman for days and at last her.. -
Lee Rosenbaum
He had kept their mother alive in their thoughts..
افراد
لیست مخاطبین
Omar Krajcik
+3584227649850
(UAS)
Rudy Bode
+3587394408149
(UAS)
Charlie Christiansen
+18402727121
(UAS)
Lance Schiller
+16286413791
(Drivers,New zealand)
Troy Cartwright
+18607148019
(UAS)
Israel Kshlerin
+16805796236
(Drivers,New zealand)