Bootstrap Utility Example
p-4 rounded-4 shadow m-auto position-relative overflow-hidden
Css
Custom Callout
callout
Css
.callout {
width: 100%;
max-width: 850px;
}
.callout > * {
max-width: 65ch;
z-index:1;
}
.callout::after {
content: "";
background: "";
position: absolute;
}
Rounded corners
rounded-4
Css
Shadow
shadow overflow-hidden
Css
rounded-corners-right
rounded-corners-right
Css
.rounded-corners-right {
border-radius: 0.0rem 0.5rem 0.5rem 0.0rem!important;
}
rounded-corners-left
rounded-corners-left
Css
.rounded-corners-left {
border-radius: 0.5rem 0.0rem 0.0rem 0.5rem !important;
}
nav-item
nav-item
Css
.nav-item {
margin-right: 2px
}
width-100-importent
width-100-importent
Css
width-100-importent{
width:100% !important;
max-width:100% !important;
}
In bold letters
duka-bold-letters
Css
.duka-bold-letters {
font-weight: bold
}
Topline on border
topline-on-border
Css
.topline-on-border {
border: 5px solid red;
border-width: 2px 0px 0px 0px;
border-image: radial-gradient(#506b7a, #fffbf7) 4;
}
Disabled add to cart
btn-disabled-add-to-cart
Css
.btn-disabled-add-to-cart {
opacity: .65;
pointer-events: none;
background-color: whitesmoke !important;
color: dimgray !important;
border-color: dimgray !important;
}
icon-24
icon-24
Css
.icon-24 svg{height:1.5rem;width:1.5rem;display:block}
color-overlay
color-overlay
Css
.color-overlay:before {
content:"";
position: relative;
top:0;
left:0;
height:100%;
width:100%;
background: rgba(250,246,239,0.2);
z-index:999;
}
Margin_Top_20px
mt-20
Css
.mt-20:before {
margin-bottom: 0 !important;
margin-top: 20px;
}
slider-item-show5
slider-item-show5
Css
.slider-item-show5 {
--swiffy-slider-item-count: 3;
}
js-product-related-slider
js-product-related-slider
Css
js-product-related-header
js-product-related-header
Css