File: /var/www/html/wpprotonperinggit/wp-content/themes/voiture/sass/template/_woocommerce-widgets.scss
// loading products
.widget.widget-products{
.tab-content{
.ajax-loading{
background: url('#{$image-theme-path}loading-quick.gif') center 100px no-repeat #fff;
}
}
.widget-title{
padding: 0 0 10px;
margin-bottom: 25px;
}
.slick-carousel-top .slick-arrow{
top: -60px;
}
&.column1{
.shop-list-small{
margin-top: -1px;
}
}
}
.link-readmore{
position:relative;
padding:$theme-margin 0;
&:before{
content:'';
background:$border-color;
position:absolute;
top:50%;
left:0;
@include size(100%,1px);
z-index:2;
}
.link-inner{
display:inline-block;
padding:0 30px;
background:#fff;
position:relative;
z-index:3;
}
}
// banner category
.category-item{
text-align: center;
border:1px solid $border-color;
@include transition(all 0.35s ease-in-out 0s);
padding:10px;
@media(min-width: 1200px){
padding:50px 30px 30px;
}
.image-wrapper{
margin-bottom: 10px;
@media(min-width: 1200px){
margin-bottom: 25px;
}
}
.cat-title{
margin:0;
font-size: 18px;
@media(min-width: 1200px){
font-size: 24px;
}
}
.product-nb{
font-size: 12px;
color: $theme-color;
letter-spacing: 1px;
text-transform: uppercase;
}
&:hover{
border-color:$theme-color;
}
}
/*------------------------------------*\
Widget Price Filter
\*------------------------------------*/
.woocommerce .widget_price_filter .ui-slider .ui-slider-range{
background:$theme-color;
}
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content{
background:#ebebeb;
height: 3px;
margin:12px 10px;
}
.widget_price_filter {
font-family: $font-family-sans-serif;
.price_slider_wrapper {
overflow: hidden;
}
.price_slider_amount {
.price_label{
font-weight: 400;
font-size:$font-size-base;
display: inline-block;
text-transform: capitalize;
@include rtl-float-left();
}
}
.ui-slider {
position: relative;
@include rtl-text-align-left();
.ui-slider-range {
top: 0;
height: 100%;
background: #dddddd;
}
}
.price_slider_wrapper .ui-widget-content {
background: lighten(#dddddd,5%);
height: 4px;
margin: 5px 10px 20px;
}
}
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle{
z-index: 2;
position:absolute;
@include size(15px,15px);
@include border-radius(15px);
cursor: pointer;
background:$theme-color;
top:-6px;
}
.woocommerce .widget_price_filter .price_slider_amount{
@include rtl-text-align-left();
margin-top: 22px;
> input{
width: 48%;
margin-bottom: 5px;
border:2px solid $border-color;
&:focus{
border-color:#000;
}
}
}
/*------------------------------------*\
Product List Widget
\*------------------------------------*/
.woocommerce ul.product_list_widget{
list-style: none;
li{
clear: both;
margin:0 0 ($theme-margin / 2);
padding: 0;
@media(min-width: 1200px){
margin-bottom: 20px;
}
&:last-child{
margin-bottom: 0;
}
img{
width: 100%;
margin:0;
float: none;
}
}
.star-rating{
display: none;
}
.woocommerce-Price-amount {
font-size: $font-size-base;
font-weight: 600;
color: $link-color;
}
del{
display: none;
}
.product-title{
font-size:$font-size-base;
font-weight: 400;
display: block;
margin: 3px 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
a{
font-weight: inherit;
}
}
.left-content{
@include rtl-float-left();
width: 90px;
padding: 8px;
border: 1px solid $border-color;
@include border-radius($border-radius-base);
a{
display: block;
overflow: hidden;
@include border-radius($border-radius-base);
max-height: 80px;
}
+ .right-content{
overflow: hidden;
@include rtl-padding-left(15px);
}
}
}
/*------------------------------------*\
Widget currency-switcher
\*------------------------------------*/
.woocommerce-currency-switcher-form{
min-width: 100px;
.dd-select{
background: #fff !important;
border:none;
border-radius:0;
}
ul.dd-options{
border:none;
@include box-shadow(none);
li{
padding:0;
border:none;
}
}
}
.widget-woocommerce-currency-switcher{
.dd-desc{
display: none;
}
a.dd-option,
.dd-selected{
padding:5px 10px !important;
color:$text-color;
}
label{
line-height: 100%;
@include rtl-float-left();
margin:0;
}
.dd-pointer{
border:none !important;
margin:0 !important;
&:before{
font-family: FontAwesome;
position:absolute;
line-height: 100%;
right:0;
bottom:-4px;
}
&.dd-pointer-down{
&:before{
content: "\f107";
}
}
&.dd-pointer-up{
&:before{
content: "\f106";
}
}
}
}
.apus-products-list{
list-style: none;
padding:0;
margin: 0;
.product-block{
padding: 10px 0;
background: #ffffff;
}
.media-left{
padding: 0;
}
.media-body{
@include rtl-padding-left(20px);
}
.rating {
display: none;
}
.name{
font-family: $font-family-sans-serif;
margin: 0;
a{
font-size: 16px;
text-transform: capitalize;
}
}
.product-block{
&:hover{
.name{
a{
color: $theme-color;
}
}
}
}
.groups-button{
*{
i{
color: $text-color;
&:hover{
color: $theme-color;
}
}
}
.addcart, .yith-wcwl-add-to-wishlist, .quick-view{
display: inline-block;
@include rtl-padding-right(26px);
}
.addcart{
.add-cart{
a{
background: transparent;
padding:0;
.title-cart{
display: none;
}
}
}
}
.yith-wcwl-add-to-wishlist{
vertical-align: bottom;
.sub-title{
display: none;
}
.feedback{
display: none;
}
}
.quick-view{
@include rtl-padding-right(0px);
vertical-align: middle;
a.quickview{
background: transparent;
border: none;
padding:0px;
}
}
}
.price{
margin-bottom: 10px;
span.woocs_price_code{
del{
span.woocommerce-Price-amount{
font-size: 20px;
color: #888625;
}
}
ins{
span.woocommerce-Price-amount{
font-size: 24px;
font-weight: normal;
color: #888625;
}
}
span.woocommerce-Price-amount{
font-size: 24px;
font-weight: normal;
color: #888625;
}
}
}
}
.sub-categories{
.sub-title{
font-size: 15px;
color: #fff;
background: $brand-primary;
padding: 14px 40px;
margin: 0;
text-transform: uppercase;
.icon{
@include rtl-margin-right(20px);
}
.pull-right{
margin-top: 3px;
}
}
> .list-square{
padding: 15px 40px;
background: #f5f5f5;
> li{
> a{
color: $text-color;
&:before{
background: $text-color;
}
}
&:hover,
&.active{
> a{
color: $link-color;
&:before{
background: $link-color;
}
}
}
}
}
}
//widget_deals_products
.widget_deals_products{
.widget-title-wrapper{
position: relative;
margin: 0 0 50px;
.widget-title{
margin: 0;
font-size: 20px;
> span{
padding: 0 0 17px;
}
@media(min-width:992px){
+ .apus-countdown{
position: absolute;
top: 0;
background: #fff;
@include rtl-right(0);
.times{
> div:last-child{
@include rtl-margin-right(0);
}
}
}
}
}
}
}
.list-banner-category{
.category-wrapper{
position:relative;
.category-meta{
position:absolute;
bottom:50px;
@include rtl-left(0);
z-index: 1;
}
}
.title{
margin: 0;
font-size: 36px;
letter-spacing: 0.5px;
a:hover,a:active{
text-decoration: underline;
}
}
}
.all-products{
font-size: 36px;
color: $link-color;
@include rtl-text-align-right();
a{
&:hover,&:active{
text-decoration: underline;
}
}
}
// widget banner product
.grid-banner-category{
&.style1{
.link-action{
display:block;
position:relative;
&:before{
content:'';
position:absolute;
top:0;
left:0;
@include size(100%,100%);
background:rgba(0,0,0,0.3);
@include opacity(0);
@include transition(all 0.3s ease-in-out 0s);
}
.title{
font-size:14px;
text-transform:uppercase;
margin:0;
display:inline-block;
font-weight:500;
padding:10px 35px;
background:#fff;
letter-spacing:1px;
}
.info{
text-align:center;
top:50%;
margin-top:-19px;
position:absolute;
left:0;
width:100%;
@include opacity(0);
@include transition(all 0.3s ease-in-out 0s);
}
&:hover,&:active{
&:before,
.info{
@include opacity(1);
}
.info{
-webkit-animation: zoomInDown 0.5s linear 1; /* Safari 4.0 - 8.0 */
animation: zoomInDown 0.5s linear 1;
}
}
}
}
&.style2{
.link-action{
display:block;
position:relative;
overflow:hidden;
&:before{
content:'';
position:absolute;
top:0;
left:0;
@include size(200%,200%);
background:rgba(0,0,0,0.2);
@include border-radius(0 0 100% 0);
@include scale(0);
transform-origin: 0 0;
-ms-transform-origin: 0 0; /* IE 9 */
-webkit-origin: 0 0; /* Safari 3-8 */
@include transition(all 0.4s ease-in-out 0s);
}
.title{
font-size:16px;
text-transform:uppercase;
margin:0;
display:inline-block;
font-weight:500;
padding:10px 35px;
background:#fff;
letter-spacing:1px;
border:1px solid #ebebeb;
}
.info{
text-align:center;
top:10px;
position:absolute;
@include rtl-left(10px);
@media(min-width:1200px){
top:40px;
@include rtl-left(40px);
}
}
&:hover,&:active{
&:before{
@include scale(1);
}
}
}
}
}
// woocommerce
table > thead > tr > th, table > thead > tr > td, .table-bordered > thead > tr > th, .table-bordered > thead > tr > td{
border:0;
}
table > thead > tr > th, table > thead > tr > td, table > tbody > tr > th, table > tbody > tr > td, table > tfoot > tr > th, table > tfoot > tr > td, .table-bordered > thead > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > tfoot > tr > td{
border-bottom:0;
border-right:0;
}
.woocommerce #content table.cart td.actions .coupon, .woocommerce table.cart td.actions .coupon, .woocommerce-page #content table.cart td.actions .coupon, .woocommerce-page table.cart td.actions .coupon{
@include rtl-margin-right(10px);
}
.woocommerce-info{
background:#fff;
}
.select2-container--default .select2-selection--single{
border:none;
}
.woocommerce-customer-details > h2,
.woocommerce-order-details__title{
font-size: 18px;
margin:0 0 10px;
}
.woocommerce form .form-row .input-checkbox{
position:static;
float: none;
display: inline-block;
@include rtl-base-toprightbottomleft(margin,0,5px,0,0);
vertical-align: inherit;
+ label{
display: inline-block;
}
}
//widget-categoriestabs
.widget-categoriestabs{
.nav-tabs{
margin: 40px 0;
border:none;
text-align: center;
> li{
margin: 0 12px;
display: inline-block;
float: none;
&.active{
> a{
text-decoration: underline;
color: #000;
}
}
> a{
text-transform: capitalize;
font-size: 16px;
color: #000;
border:none !important;
.product-count{
font-size: 14px;
color: $text-color;
display: inline-block;
vertical-align: top;
}
}
}
}
}
//woocommerce-widget-layered-nav-list
.woocommerce-widget-layered-nav{
.view-more-list{
font-size: 14px;
text-decoration: underline;
color: $brand-success;
}
.woocommerce-widget-layered-nav-list{
overflow: hidden;
&.hideContent{
margin-bottom: 10px;
height: 260px;
}
&.showContent{
height: auto;
margin-bottom: 10px;
}
}
}
.woocommerce-widget-layered-nav-list{
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
.woocommerce-widget-layered-nav-list__item{
font-size: 15px;
margin:0 0 5px;
width:100%;
white-space: nowrap;
&:last-child{
margin:0;
}
> a{
color: $text-color;
&:hover,&:active{
color:$theme-color;
}
padding:1px !important;
.swatch-color{
display:inline-block;
@include size(12px,12px);
@include border-radius(50%);
vertical-align:baseline;
@include rtl-margin-right(10px);
}
.swatch-label{
display:none;
}
}
&.chosen{
> a{
color:$theme-color;
.swatch-color{
display:none;
}
&:before{
vertical-align:baseline;
color: $theme-color;
content: "\f14a";
font-family: 'FontAwesome';
}
&:hover,&:active{
&:before{
color: $brand-danger;
font-family: 'FontAwesome';
content: "\f057";
}
}
}
}
}
}
.apus-price-filter,
.apus-product-sorting{
list-style:none;
padding:0;
margin:0;
li{
margin-bottom:5px;
&:last-child{
margin-bottom:0;
}
a{
color:$text-color;
&:hover,&:active{
color:$theme-color;
}
}
&.current,
&.active{
color:$theme-color;
}
}
}
.widget.widget-products-tabs{
margin-bottom: 0;
@media(min-width: 1200px){
.widget-title{
font-size: 44px;
}
}
.top-info{
overflow: hidden;
margin-bottom: 15px;
@media(min-width: 1200px){
margin-bottom: 35px;
}
-webkit-justify-content: space-between; /* Safari 6.1+ */
justify-content: space-between;
.nav.tabs-product.center{
margin-bottom: 0;
}
}
.widget-title{
padding: 0 0 10px;
margin:0;
&:before{
width: 2000px;
}
&.center{
&:before,&:after{
display: none;
}
}
}
.widget-content.carousel{
margin-bottom: -40px;
.slick-list{
padding-bottom:40px;
}
}
}
.widget.widget-products-deal {
margin:0;
.widget-title{
padding: 0 0 10px;
margin-bottom: 25px;
}
.slick-carousel-top .slick-arrow{
top: -60px;
}
.apus-countdown-dark .times > div > span{
color: $link-color;
}
}
// tap products loading
.tab-content{
&.loading{
min-height: 400px;
position: relative;
&:before{
position: absolute;
@include size(100%,100%);
top: 0;
left: 0;
z-index: 99;
content: '';
background:url('#{$image-theme-path}loading-quick.gif') center 100px no-repeat rgba(255,255,255,0.9);
}
}
}
.widget.widget-tab-style_center{
.widget-title{
font-size: 36px;
text-align: center;
margin:0 0 10px;
color: #252525;
padding:0;
border:none;
&:before{
display:none;
}
}
}
@keyframes pulsate {
0% {
@include opacity(0);
@include scale(0.1);
}
50% {
@include opacity(1);
}
100% {
@include scale(1.2);
@include opacity(0);
}
}
@-webkit-keyframes pulsate {
0% {
@include opacity(0);
@include scale(0.1);
}
50% {
@include opacity(1);
}
100% {
@include scale(1.2);
@include opacity(0);
}
}
// lookbook
.apus-lookbook{
.mapper-pin-wrapper{
> a{
display:inline-block;
@include size(16px,16px);
@include border-radius(50%);
background:#f43434;
position:relative;
&:before{
content:'';
@include size(40px,40px);
background:rgba(#f43434,0.2);
position:absolute;
top:0;
left:0;
margin-top:-12px;
margin-left:-12px;
z-index:2;
@include border-radius(50%);
animation: 1s ease-out 0s normal none infinite running pulsate;
-webkit-animation: 1s ease-out 0s normal none infinite running pulsate;
}
}
.image{
img{
width:100%;
}
}
}
.mapper-popup{
&:before{
content:'';
@include size(40px,40px);
position:absolute;
top:50%;
left:100%;
@include translateY(-50%);
}
&:after{
content:'';
position:absolute;
top:50%;
left:100%;
@include translateY(-50%);
@include size(30px,24px);
border-width:12px 15px;
border-style:solid;
border-color:transparent transparent transparent #fff;
}
}
}
.widget.widget-recent_viewed,
.widget.upsells,
.related{
.widget-title{
font-size: 18px;
margin:0 0 15px;
}
.slick-list{
padding-top:4px;
}
}
.cross-sells.products{
margin-top:$theme-margin;
margin-bottom: 0;
@media(min-width: 1200px){
margin-top: 50px;
}
> h2{
margin:0 0 20px;
font-size:22px;
@media(min-width:992px){
margin:0 0 30px;
}
}
}
.subwoo-inner{
background: #fff;
@include border-radius($border-radius-base);
border: 1px solid $border-color;
@include transition(all 0.3s ease-in-out 0s);
overflow: hidden;
margin-bottom: 20px;
padding: 20px;
@media(min-width: 1200px){
padding: 40px;
margin-bottom: $theme-margin;
}
.title{
font-size: 18px;
margin:0;
text-transform: capitalize;
color: $link-hover-color;
}
.price{
color: $link-color;
font-size: 22px;
font-weight: 600;
@media(min-width: 1200px){
font-size: 30px;
}
}
.short-des{
ul{
list-style: none;
padding:0;
margin:0;
li{
margin-bottom: 10px;
@media(min-width: 1200px){
margin-bottom: 18px;
}
&:before{
content: "\e64c";
font-family: 'themify';
display: inline-block;
@include rtl-margin-right(12px);
color: #202124;
font-size: 15px;
line-height: 1;
}
&:last-child{
margin-bottom: 0;
}
}
}
}
.bottom-sub{
margin-top: 15px;
@media(min-width: 1200px){
margin-top: 30px;
}
}
.add-cart{
.button,
.added_to_cart{
color: $link-color;
background: rgba(#1947E2,0.07);
border:0;
text-transform: capitalize;
@include transition(all 0.3s ease-in-out 0s);
line-height: 1;
@include border-radius($border-radius-base);
font-weight: 600;
font-size: 13px;
display: inline-block;
padding:14px 25px !important;
width: 100%;
@media(min-width: 1200px){
padding:19px 50px !important;
}
span.hidden{
display: inline-block !important;
visibility: visible !important;
}
svg{
display: none;
}
&:hover,&:focus{
background-color: $link-hover-color;
color: #fff;
}
}
.added_to_cart{
background-color: $link-hover-color;
color: #fff;
}
}
.button-action{
margin: 30px 0 0;
@media(min-width: 1200px){
margin-top: 50px;
}
}
.recommended{
display: inline-block;
padding: 3px 24px;
@include border-radius(35px);
color: #34A853;
background-color: rgba(#34A853,0.15);
}
&.is_featured,
&:hover{
border-color: $link-hover-color;
.button,
.added_to_cart{
background-color: $link-hover-color;
color: #fff;
}
}
}
// user package
.inner-user-listing-packaged{
label{
color: $headings-color;
background-color: #fff;
cursor: pointer;
font-size: 18px;
font-weight: 600;
margin:0;
@include transition(all 0.3s ease-in-out 0s);
text-align: center;
display: block;
width: 100%;
padding:15px;
@include border-radius($border-radius-base);
margin-bottom: 15px;
@media(min-width: 1200px){
padding: $theme-margin;
}
border:1px solid $border-color;
.value{
display: block;
margin-bottom: 5px;
}
.des-package{
@include transition(all 0.3s ease-in-out 0s);
font-size: $font-size-base;
font-weight: 400;
color: $text-color;
}
}
[type="radio"]{
display: none;
&:checked{
+ label{
color: $theme-color;
border-color: $theme-color;
}
}
}
}
.widget-your-packages{
.bottom-packages{
margin-top: 20px;
}
}
@media(min-width: 1200px){
#listing_package_selection{
.widget-packages{
padding-top: 20px;
}
}
}