Chat List

Show All

  • A
  • B
  • D
  • J
  • O
Chat with Khelesh

Online

Hi, how are you samim? 8:40 AM, Today
Hi Khalid i am good tnx how about you? 8:55 AM, Today
I am good too, thank you for your chat template 9:00 AM, Today
You are welcome 9:05 AM, Today
I am looking for your next templates 9:07 AM, Today
Ok, thank you have a good day 9:10 AM, Today
Bye, see you 9:12 AM, Today
Hi, how are you samim? 8:40 AM, Today
Hi Khalid i am good tnx how about you? 8:55 AM, Today
I am good too, thank you for your chat template 9:00 AM, Today
You are welcome 9:05 AM, Today
I am looking for your next templates 9:07 AM, Today
Ok, thank you have a good day 9:10 AM, Today
Bye, see you 9:12 AM, Today
Notications

Show All

  • SEVER STATUS
  • KK
  • SOCIAL
  • RU
  • SEVER STATUS
  • AU
  • MO
Notes

Add New Nots

Button Group

Welcome Back Yatin Sharma !

$2353.25

Withdraw Money
Main Menu

Button group

Default Button group style

<div class="btn-group">
	<button type="button" class="btn btn-primary">Left</button>
	<button type="button" class="btn btn-primary">Middle</button>
	<button type="button" class="btn btn-primary">Right</button>
</div>

Button toolbar

Default Button toolbar style

<div class="btn-group me-2 mb-2">
<button type="button" class="btn btn-primary">1</button>
<button type="button" class="btn btn-primary">2</button>
<button type="button" class="btn btn-primary">3</button>
<button type="button" class="btn btn-primary">4</button>
</div>
<div class="btn-group me-2 mb-2">
<button type="button" class="btn btn-primary">5</button>
<button type="button" class="btn btn-primary">6</button>
<button type="button" class="btn btn-primary">7</button>
</div>
<div class="btn-group mb-2">
<button type="button" class="btn btn-primary">8</button>
</div>

Button Sizing

Default button size style

 <div class="btn-group mb-2 btn-group-lg">
	<button class="btn btn-primary" type="button">Left</button>
	<button class="btn btn-primary" type="button">Middle</button>
	<button class="btn btn-primary" type="button">Right</button>
</div>
<div class="btn-group mb-2">
	<button class="btn btn-primary" type="button">Left</button>
	<button class="btn btn-primary" type="button">Middle</button>
	<button class="btn btn-primary" type="button">Right</button>
</div>
<div class="btn-group mb-2 btn-group-sm">
	<button class="btn btn-primary" type="button">Left</button>
	<button class="btn btn-primary" type="button">Middle</button>
	<button class="btn btn-primary" type="button">Right</button>
</div>

Button Nesting

Default button nesting style

<div class="btn-group">
	<button type="button" class="btn btn-primary">1</button>
	<button type="button" class="btn btn-primary">2</button>
	<div class="btn-group">
		<button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown">Dropdown</button>
		<div class="dropdown-menu"><a class="dropdown-item" href="javascript:void(0);">Dropdown link</a>
			<a class="dropdown-item" href="javascript:void(0);">Dropdown link</a>
		</div>
	</div>
</div>

Vertical variation

Default button vertical variation style

<div class="btn-group-vertical">
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
</div>

Vertical dropdown variation

Default button vertical variation style

<div aria-label="Vertical button group" role="group" class="btn-group-vertical">
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
	<div role="group" class="btn-group">
		<button data-bs-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button">Dropdown</button>
		<div class="dropdown-menu"><a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
			<a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
		</div>
	</div>
	<button class="btn btn-primary" type="button">Button</button>
	<button class="btn btn-primary" type="button">Button</button>
	<div role="group" class="btn-group">
		<button data-bs-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button">Dropdown</button>
		<div class="dropdown-menu"><a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
			<a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
		</div>
	</div>
	<div role="group" class="btn-group">
		<button data-bs-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button">Dropdown</button>
		<div class="dropdown-menu"><a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
			<a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
		</div>
	</div>
	<div role="group" class="btn-group">
		<button data-bs-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button">Dropdown</button>
		<div class="dropdown-menu"><a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
			<a href="javascript:void(0);" class="dropdown-item">Dropdown link</a>
		</div>
	</div>
	</div>