Drag & Drop

Drag & Drop Grid

Drag & Drop Grid 01

Drag & Drop Grid 02

Drag & Drop Grid 03

Drag & Drop Grid 04

Drag & Drop Grid 05

Drag & Drop Grid 06

Drag & Drop Grid 07

Drag & Drop Grid 08


	<div class="row justify-content-center js-grid">
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-primary fs-16 mb-0">Drag & Drop Grid 01</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-success fs-16 mb-0">Drag & Drop Grid 02</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-danger fs-16 mb-0">Drag & Drop Grid 03</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-info fs-16 mb-0">Drag & Drop Grid 04</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-warning fs-16 mb-0">Drag & Drop Grid 05</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-dark fs-16 mb-0">Drag & Drop Grid 06</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-light fs-16 mb-0">Drag & Drop Grid 07</h4>
				</div>
			</div>
		</div>
		<div class="col-lg-3 col-sm-6">
			<div class="card border-color mb-25 cursor-move">
				<div class="card-body p-5 text-center">
					<h4 class="text-body fs-16 mb-0">Drag & Drop Grid 08</h4>
				</div>
			</div>
		</div>
	</div>

Drag & Drop List

  • 01. Drag & Drop List

  • 02. Drag & Drop List

  • 03. Drag & Drop List

  • 04. Drag & Drop List

  • 05. Drag & Drop List

  • 06. Drag & Drop List

  • 07. Drag & Drop List

  • 08. Drag & Drop List


	<ul class="ps-0 mb-0 list-unstyled o-sortable">
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-primary">01. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-success">02. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-danger">03. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-info">04. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-warning">05. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-dark">06. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-light">07. Drag & Drop List</h4>
		</li>
		<li class="border border-color rounded-3 mb-10 cursor-move">
			<h4 class="fs-16 mb-0 p-4 text-body">08. Drag & Drop List</h4>
		</li>
	</ul>

Theme System