Widget Shop
List of widget shop being used on the Minimog
Size
<div class="card border-0">
<div class="card-header bg-transparent border-0 p-0">
<h4 class="card-title fs-18 font-weight-500 mb-3">Size</h4>
</div>
<div class="card-body p-0">
<ul class="list-inline">
<li class="list-inline-item mr-2">
<a href="#" class="btn border border-hover-primary bg-transparent w-45px p-2 font-weight-normal text-primary">XS</a>
<a href="#" class="btn border border-hover-primary bg-transparent w-45px p-2 font-weight-normal text-primary">S</a>
<a href="#" class="btn border border-hover-primary bg-transparent w-45px p-2 font-weight-normal text-primary">M</a>
<a href="#" class="btn border border-hover-primary bg-transparent w-45px p-2 font-weight-normal text-primary">L</a>
</li>
</ul>
</div>
</div>Color
<div style="max-width:250px">
<div class="card border-0 widget-color">
<div class="card-header bg-transparent border-0 p-0">
<h3 class="card-title fs-20 mb-0">
Colors
</h3>
</div>
<div class="card-body px-0 pt-4 pb-0">
<ul class="list-inline mb-0">
<li class="list-inline-item mr-2">
<a href="#"
class="d-block item" style="background-color: #d0a272;"></a>
</li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #68412d;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #000000;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #aa5959;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #8db4d2;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #c2c3a0;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #c7857d;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #e3e1e7;"></a></li>
<li class="list-inline-item"><a href="#"
class="d-block item" style="background-color: #b490b0;"></a></li>
</ul>
</div>
</div>
</div>Categories
Categories
<div style="max-width:270px">
<div class="card border-0">
<div class="card-header bg-transparent border-0 p-0">
<h3 class="card-title fs-18 font-weight-500 mb-0">
Categories
</h3>
</div>
<div class="card-body px-0 pt-2 pb-0">
<ul class="list-unstyled mb-0">
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Sweaters</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Dress</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Coats & Jackets</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Handbag</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Boots</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Sunglasses</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Shirts</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body d-inline-block lh-12">Sale Items !</a>
</li>
</ul>
</div>
</div>
</div>Price
<div style="max-width:270px">
<div class="card border-0">
<div class="card-header bg-transparent border-0 p-0">
<h3 class="card-title fs-18 font-weight-500 mb-0">
Price
</h3>
</div>
<div class="card-body px-0 pt-2 pb-0">
<ul class="list-unstyled mb-0">
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">All
</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">$10
- $100</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">$100
- $200</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">$200
- $300</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">$300
- $400</a>
</li>
</ul>
</div>
</div>
</div>Brand
Brand
<div style="max-width:270px">
<div class="card border-0">
<div class="card-header bg-transparent border-0 p-0">
<h3 class="card-title fs-18 font-weight-500 mb-0">
Brand
</h3>
</div>
<div class="card-body px-0 pt-2 pb-0">
<ul class="list-unstyled mb-0">
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Pull & Bear</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Guess</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Zara</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Columbia</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Mango</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">Forever 21</a>
</li>
<li class="mb-1">
<a href="#"
class="text-body hover-primary border-bottom border-white border-hover-primary d-inline-block lh-12">H&M</a>
</li>
</ul>
</div>
</div>
</div>