PATH:
home
/
lab2454c
/
adenbic.com
/
wp-content
/
themes
/
bumbleb
/
sass
/
themes
/*Font WooCommerce*/ /* Wooecommerce - Button - Input Submit ------------------------------------------------*/ .woocommerce #respond input#submit, .woocommerce button.button, .woocommerce input.button{ color:$gray-dark; background:$theme-color; font-size:15px; padding:0 50px; line-height:50px; cursor:pointer; font-weight: 700; @include border-radius(30px); border : 0; font-family:$font-family-base; text-transform:uppercase; &:hover{ background: darken($theme-color, 10%); } &:focus{ outline : none; } } .button, #submit { &.loading { &:before { content: ""; @include vertical-center(100%,100%); background: url('#{$image-theme-path}loading-cart.gif') center no-repeat transparent; } } } /* End ------------------------------------------------*/ .clear-all{ @extend .btn, .btn-link; &:hover{ text-decoration: none !important; } } /*Messenger ------------------------------------------------- */ .bumbleb-product-added{ background: $gray-dark; line-height: 1.5; @include box-shadow(unset); color:$white; top:50px; left:auto; right:30px; padding: 15px 25px; font-weight:400; position:fixed; z-index:9999; >div{ display:inline-block; &:before{ display:inline-block; content: "\e91d"; font-family:wpbingofont; @include rtl-margin-right(10px); } } @media (max-width:$screen-xs){ right:50%; @include transform(translateX(50%)); max-width:280px; } } .woocommerce-error, .alert-success, .woocommerce-message { background-color: #dff0d8; border-color: #d6e9c6; color: #3c763d; list-style: none; .wc-forward{ background: $theme-color; color: #fff; padding: 8px 12px; text-transform:uppercase; font-weight:500; font-weight:700; font-size:12px; &:hover{ background: darken($theme-color,10%); color:$white; } &:before{ display:none; } &:after{ content: "\24"; font-family: eleganticons; @include rtl-margin-left(10px); font-size:18px; line-height: 1; position: relative; top: 4px; } } } //WooCommerce Info .woocommerce-notices-wrapper{ max-width:1410px; margin:auto; width:100%; } .woocommerce-error,.woocommerce-info,.woocommerce-message { @include rtl-padding(12px,22px,12px,42px); @include rtl-margin(0,0,24px,0); position: relative; background-color: #f7f6f7; color: #515151; border-top: 3px solid #a46497; list-style: none outside; width: auto; word-wrap: break-word; border-top-color: #b81c23; width : 100%; .button { @include rtl-float-right(); } li { list-style: none outside!important; @include rtl-padding-left(0!important); @include rtl-margin-left(0!important); } } .woocommerce-info,.woocommerce-message,.woocommerce-error{ &:after { content: ''; display: table; clear: both; } } .woocommerce-info,.woocommerce-message,.woocommerce-error{ &:before { content: "\e97c"; display: table; font-family: feather; display: inline-block; position: absolute; top: 8px; font-size : 18px; @include rtl-left(20px); color: #b81c23; } } .woocommerce-info,.woocommerce-message{ border-top: 3px solid $gray-dark; text-transform:capitalize; z-index: 100; &:before { content: "\e91e"; font-family:wpbingofont; color:$gray-dark; font-size:15px; @include rtl-margin-right(10px); line-height:1; top:16px; margin-bottom:15px; } a{ color : $gray-dark; font-weight : 700; &:hover{ color : $theme-color; } } .button.wc-forward{ background:transparent; line-height:29px; border:1px solid $gray-dark; @include border-radius(25px); color:$gray-dark; padding:0; padding:0 15px 0 20px; font-size: 10px; text-transform:uppercase; letter-spacing: 2px; &:after{ content: "\35"; font-size:15px; top:2px; @include rtl-margin-left(5px); } &:hover{ background:$theme-color; border-color:$theme-color; } } } /* End *------------------------------------------------ */ .category-image{ img{ @extend .filter-grayscale; } } p.demo_store { top: 0; position:fixed; @include rtl-left(0); @include rtl-right(0); @include size(percentage(1),auto); @include rtl-text-align-center(); @include font-size(font-size,$font-size-md); padding: .5em 0; z-index: 99998; border: 1px solid darken($border-color, 10); @include box-shadow(0, 0, 0, 3px, rgba($white,0.2)); } /* Utilities *--------------------------------------------------------------------------- */ .woocommerce{ .wc-forward, .wc-forward a { &:before { content: "\f00c"; font-family: $theme-font-icon-name; @include rtl-margin(0, 5px, 0, 0); } } .wc-backward, .wc-backward a { line-height:32px; background:$theme-color; padding:0 20px; display:inline-block; text-transform:uppercase; font-size:12px; font-weight:500; height:40px; border: 1px solid $theme-color; @include border-radius(25px); @include transition(all .3s ease); &:before { content: "\23"; font-size:18px; font-family: 'ElegantIcons'; @include rtl-margin(0, 5px, 0, 0); position:relative; top:4px; } &:hover{ background: transparent; color: $gray-dark; } } } /* woocommerce tabs *--------------------------------------------------------------------------- */ .woocommerce-tabs{ margin: $woocommerce-tabs-margin; padding-bottom:40px; border-bottom:1px solid #e1e1e1; border-top:1px solid #e1e1e1; table{ margin: 0; } .tab-title{ @include font-size(font-size, 18px); text-transform: uppercase; margin: 0 0 30px; } #tab-vendor{ .product-vendor{ padding:33px 50px 20px; h2{ font-size:20px; } } } #tab-wcmp_customer_qna{ #cust_qna_form{ padding:45px 50px 30px; h2{ font-size:20px; margin-bottom:25px; } } } #tab-singleproductmultivendor{ padding:40px 50px; } .content-woocommerce-tabs{ max-width:1500px; margin-left:auto; margin-right:auto; padding-left:15px; padding-right:15px; } .content-ul-tab{ text-align:center; padding:45px 0 0; margin-bottom:35px; } .content-tab{ .panel{ padding:0; } } ul.tabs { position:relative; margin:0; padding: 0; white-space: nowrap; overflow: hidden; overflow-x: auto; li{ padding:0; border:0; margin: 0 10px; @include box-shadow(unset); &:before,&:after{ display:none; } a{ color:$text-color; font-size: 16px; padding:0 0 3px; border:0; display:inline-block; position:relative; text-transform: uppercase; border:1px solid #e7e7e7; @include transition(all .3s ease); padding:5px 15px; @include border-radius(25px); @media (max-width:$screen-xs){ font-size:20px; } } &:hover,&.active{ background: transparent; a{ color:$gray-dark; background:$theme-color; border:1px solid $theme-color; &:before{ width: 100%; } } } } } .panel { background: transparent; @include rtl-text-align-left(); line-height: 2em; margin-left:auto; margin-right:auto; &.woocommerce-Tabs-panel--seller{ h2{ margin-top:0; margin-bottom:30px; font-size:18px; text-transform:uppercase; } .seller-rating{ .star-rating{ >span{ >strong{ opacity:0; } } } } } &.woocommerce-Tabs-panel--more_seller_product{ border:0; ul{ li{ &:before{ display:none; } } } } &.woocommerce-Tabs-panel--description{ >.row{ align-items:center; margin-bottom:70px; >div:last-child{ .box-title{ max-width:640px; @include rtl-margin-left(auto); } @media (max-width:$screen-sm-max){ margin-top:30px; } } img{ margin:0; } } h1{ font-size:34px; margin-top:0; margin-bottom:75px; } h2{ font-size:24px; margin:0 0 20px; } .box-title{ margin-bottom:45px; } @media (max-width:$screen-xs){ h1{ font-size:25px; margin-bottom:30px; } h2{ font-size:18px; } } } ul{ padding: 0; list-style: none; } ol{ @include rtl-padding-left(15px); li{ margin-bottom: 5px; &:last-child{ margin-bottom: 0; } } } } #tab-seller{ ul.list-unstyled{ >li{ &.clearfix{ display: flex; .seller-rating{ order: 2; display: inline-block; vertical-align: bottom; padding-top: 2px; @include rtl-margin-left(15px); } .text{ &:after{ content: ":"; @include rtl-margin-left(3px); } } } } } } #tab-description{ >ul{ margin-bottom: 12px; } } #tab-additional_information{ table.shop_attributes{ border: none; p{ margin: 0; } > tbody{ > tr { background: $white; >th{ text-transform: capitalize; font-weight:700; color:$gray-dark; } } } } } #tab-reviews{ #reviews{ #comments{ margin-bottom:15px; .woocommerce-Reviews-title{ font-size: 25px; margin-bottom:30px; span{ color:darken($theme-color,10%); } } } .commentlist{ display:flex; flex-wrap:wrap; list-style:none; padding:0; margin:0 -15px; li{ padding:0 15px; flex:1; min-width:50%; margin-bottom:25px; .description{ line-height:22px; p{ margin:0; } } .content_comment_container{ border:1px solid #d9d9d9; @include border-radius(10px); padding:30px; } @media (max-width:$screen-xs-max){ flex:0 0 100%; } } .comment-text{ margin:0; @include rtl-padding-left(15px); .meta{ margin:0; .woocommerce-review__author{ display:block; color:$gray-dark; font-size:13px; margin-bottom:-5px; text-transform:uppercase; } .woocommerce-review__dash{ display:none; } .woocommerce-review__published-date{ font-size:12px; } } } .comment_container{ display:flex; align-items:center; flex-wrap:wrap; position:relative; margin-bottom:10px; >img{ @include border-radius(50%); margin:0; } } } .button-reviews{ background: transparent; cursor: pointer; padding: 0 25px; border: 1px solid $gray-dark; @include border-radius(30px); position: relative; overflow: hidden; line-height: 45px; color: $gray-dark; &:after{ content: ""; position: absolute; z-index: -1; @include transition(all .3s ease); width: 0; height: 103%; top: 50%; left: 50%; background: $theme-color; @include opacity-h(); @include transform(translate(-50%, -50%)); } &:hover{ color: $gray-dark; border: 1px solid $theme-color; &:after{ width: 100%; @include opacity-s(); } } } #review_form_wrapper{ &.modal{ position: fixed; height: 100%; right: 0; top: 0; z-index: 100000; @include transform(translateX(107%)); top: 0; background: $white; max-width: 80%; overflow: hidden; @include transition(all .8s cubic-bezier(0.2,1,.3,1)); #review_form{ @include transform(translateX(-107%)); height: 100%; padding: 40px; min-height: calc(100vh - 80px); overflow-y: auto; @include transition(all .8s cubic-bezier(0.2,1,.3,1)); } &:not(.open){ .close-btn{ .close-line1{ @include transform(translateY(0) translateX(0) rotate(-45deg)); animation-name: crossLeftClose; @include animation-delay(0s); @include animation-duration(.15s); } .close-line2{ @include transform(translateY(0) translateX(0) rotate(45deg)); -webkit-animation-name: crossRightClose; animation-name: crossRightClose; @include animation-delay(.06s); @include animation-duration(.15s); } } } &.open{ @include transform(translateX(0)); #review_form{ @include transform(translateX(0)); } .close-btn{ .close-line1{ @include transform(translateY(-30px) translateX(30px) rotate(45deg)); animation-name: crossRight; animation-delay: .14s; } .close-line2{ animation-name: crossLeft; @include transform(translateY(-30px) translateX(-30px) rotate(-45deg)); } } } @media(min-width: 1000px){ max-width: 50%; } } .close-btn{ position: absolute; top: 40px; @include rtl-right(40px); cursor: pointer; &:before{ position: absolute; content: ""; top: 50%; left: 50%; display: block; background-color: rgba($gray-dark, .05); @include square(34px); margin:-17px 0 0 -17px; @include border-radius(50%); @include transform(scale(1) translateZ(0)); @include transition(all .45s cubic-bezier(.15,.2,.1,1)); } .close-wrap{ -webkit-font-smoothing: subpixel-antialiased; transform-style: preserve-3d; position: absolute; top: 50%; left: 50%; @include transform(translate(-50%, -50%)); @include transition(margin .2s ease,transform .2s ease 1s,opacity .3s ease); width: 20px; height: 15px; display: block; overflow: hidden; } .close-line{ height: 100%; width: 2px; background-color: $gray-dark; backface-visibility: hidden; position: absolute; border-radius: 5px; left: 9px; @include transition(opacity .2s ease,background-color .2s ease); animation-duration: .4s; animation-timing-function: cubic-bezier(.52,.01,.16,1); animation-fill-mode: forwards; } &:hover{ &:before{ @include transform(scale(1.2) translateZ(0)); } } } @media(max-width: $screen-xs-max){ &.modal{ #review_form{ padding: 55px 30px 30px; } } .close-btn{ top: 20px; @include rtl-right(25px); } } } .close-reviews-form{ position: fixed; content: ""; width: 100%; height: 100%; top: 0; left: 0; margin:0; z-index: 9999; background: rgba(0,0,0,.4); display: none; -webkit-transition: opacity .4s cubic-bezier(0,.8,1,1); transition: opacity .4s cubic-bezier(0,.8,1,1); &.open{ display: block; } } #respond{ #reply-title{ font-weight: 500; color: $gray-dark; font-size: 12px; margin-bottom: 40px; display: inline-block; border:2px solid $gray-dark; @include border-radius(30px); line-height:45px; padding:0 35px; text-transform:uppercase; &:before{ content: "\e918"; font-family:wpbingofont; display:inline-block; font-size:20px; @include rtl-margin-right(15px); font-weight:400; } @media(max-width: $screen-xs-max){ line-height: 30px; } } .comment-notes{ margin-bottom:15px; } .comment-form { .comment-form-rating label{ font-weight: 500; @include rtl-margin-right(0); margin-bottom: 10px; color:$gray-dark; } } .form-submit{ margin:0; width: 100%; } input[type="submit"]{ background: $theme-color; font-size: 16px; padding: 0 50px; height: 50px; color: $gray-dark; font-family: $font-family-base; font-weight: 700; cursor:pointer; @include transition(all .3s ease); &:hover{ background: darken($theme-color, 10%); } } textarea{ height: 100% !important; } input[type="text"], input[type="email"], textarea{ background: $white; @include border-radius(10px); padding: 14px 20px; border: 1px solid #d6d6d6; height: 60px; font-weight: 300; @include placeholder($text-color); } #commentform{ display:flex; flex-wrap:wrap; margin:0 -10px; .comment-notes,.comment-form-rating{ width:100%; padding:0 10px; } .comment-form-comment{ padding:0 10px; margin:0 0 30px; width: 100%; } .content-info-reviews{ flex:1; padding:0 10px; order:1; margin:0; } .required{ color:red; } .comment-form-author, .comment-form-email{ margin-bottom: 25px; input{ width: 100%; } } .stars{ padding-top: 0; display:inline-block; @include rtl-margin-left(20px); margin-bottom:7px; a{ &:hover,&.active{ &:after{ color: $star-rating-active-color; } color: $star-rating-active-color; } } } @media (max-width:$screen-xs-max){ .comment-form-comment{ flex:0 0 100%; order:1; margin-bottom:25px; } .content-info-reviews{ flex:0 0 100%; } } } } } } #tab-vendor{ h2{ text-transform: capitalize; } a{ color: $theme-color; position: relative; &:after{ content:"\f178"; font-family: FontAwesome; display: inline-block; top: -4px; @include rtl-right(0); opacity: 0; position: absolute; @include transition(all 0.2s ease); } &:hover{ &:after{ opacity: 1; @include rtl-right(-20px); } } } } #tab-wcmp_customer_qna{ input{ padding: 10px 20px; } } .woocommerce-Tabs-panel--singleproductmultivendor{ .rowbody{ background : $white; .rowsub:nth-of-type(3){ @include rtl-text-align-right(); } &:last-child{ border-top:none; } } .row.rowhead { background : transparent; >.rowsub{ font-size : 14px; text-transform : uppercase; font-weight : 700; color : $text-color; background : #f9f9f9; line-height :35px; } } .container{ .vendor_name{ @include rtl-float-left(); a{ color: $text-color; &:hover{ color: $theme-color; } } } .buttongap{ margin : 0 10px; &:last-child{ margin : 0px; } } } } &.description-style-vertical{ padding:45px 0 75px; .content-woocommerce-tabs{ display:flex; } .content-tab{ @include rtl-padding-left(90px); flex:1; .woocommerce-Reviews-title{ margin-top:0; } } .content-ul-tab{ padding:0; flex:0 0 240px; @include rtl-text-align-left(); margin:0; ul{ padding:0; height:100%; @include rtl-border-right(3px solid #e9e9e9); overflow: unset; white-space: inherit; li{ margin:0; width:100%; padding:19px 0; position:relative; &:before{ content:""; @include size(3px,100%); background:$gray-dark; position:absolute; top:0; right:-3px; left:auto; @include box-shadow(unset); border:0; @include border-radius(0); display:inline-block; @include opacity-h(); } a{ color:$gray-dark; padding:0 10px; &:before{ height:1px; } } &.active, &:hover{ a{ color: $white; } &:before{ @include opacity-s(); } } } } } @media (max-width:$screen-sm-max){ .content-woocommerce-tabs{ flex-wrap:wrap; } .content-ul-tab{ flex:0 0 100%; margin-bottom:50px; ul{ border:0; text-align:center; li{ padding:0; margin:0 20px; width:auto; padding:5px 0; &:before{ left:0; bottom:-3px; top:auto; @include size(100%,3px); } } } } .content-tab{ padding:0; } } @media (max-width:$screen-sm-max){ .content-ul-tab{ margin-bottom:50px; ul{ border:0; text-align:center; li{ padding:0; margin:2.5px 0; width:100%; padding:5px 0; background:#f5f5f5; &:before{ display:none; } a{ color:$text-color; } &.active{ a{ color:$gray-dark; } } } } } } } &.description-style-accordion{ border:0; padding:0; margin:65px 0 0; .content-woocommerce-tabs{ padding:0; } .accordion-item{ margin-bottom:26px; border-bottom:1px solid #e5e5e5; &:last-child{ margin-bottom:0; .collapse{ padding:30px 0 0; border-bottom:0; } } a{ border:0; background:transparent; font-size:20px; padding:0; cursor:pointer; width:100%; @include rtl-text-align-left(); position:relative; display:inline-block; font-weight:400; font-family: $font-family-second; &:before{ content:""; position:absolute; font-family: 'ElegantIcons'; content: "\32"; @include rtl-right(0); @include transition(all 0.3s ease); @include transform(rotate(180deg)); font-weight:400; } &.collapsed{ &:before{ @include transform(rotate(0)); } } } .woocommerce-Reviews-title{ margin-top:0; } .collapse{ padding:20px 0; @include transition(all 0.3s ease); } } #tab-reviews #reviews{ .commentlist li{ flex:0 0 100%; } #respond #commentform{ .content-info-reviews{ flex:0 0 100%; order:2; } .comment-form-comment{ margin-bottom:25px; } } } } &.description-style-full-content{ padding:45px 0 60px; .content-tab-woocommerce{ >h2{ font-size:20px; margin:0 0 30px; position:relative; padding-bottom:10px; font-weight:400; font-family: $font-family-second; &:before{ content:""; position:absolute; bottom:0; @include rtl-left(0); @include size(32px,1px); background:$gray-dark; } } .tab-content{ @include rtl-padding-left(240px); margin-bottom:60px; &:last-child{ margin-bottom:0; } } .woocommerce-Reviews-title{ margin-top:0; } @media (max-width:$screen-sm-max){ .tab-content{ @include rtl-padding-left(0); } } } } } #respond { line-height: 1.4em; .comments { margin-bottom: 15px; } .comment-form { label { font-weight: 400; color: $gray-dark; margin-bottom: 20px; @include rtl-margin-right(10px); } } .comment-form-rating{ margin-bottom:10px; } textarea { @include box-sizing(border-box); } p.stars { position: relative; padding: 5px 0; width:160px; position:relative; top:2px; span{ display:inline-block; } &:hover,&.selected{ a:after{ color:#ff9000; } } a { @include inline-block(); line-height: 100%; position: relative; font-size:0; width:auto; &:after { content:"\e901"; font-family: $theme-icon-font-name; font-size: 16px; font-weight: unset; text-indent: 0; color:#cecece; } &:last-child { @include rtl-margin-right(0); } &:hover~a::after{ color:#cecece; } &.active~a::after{ color:#cecece; } } } } /* Quantity inputs *--------------------------------------------------------------------------- */ .quantity { width : auto; position : relative; margin : 0 auto; overflow : hidden; @include border-radius(25px); zoom : 1; input.qty { float: left; @include size(45px, 38px); text-align: center; padding : 0; -moz-appearance : textfield; &:focus{ @include form-control-focus(); } } .plus, .minus { background : $white; float : left; display : block; padding : 0; margin : 0; vertical-align : text-top; text-decoration : none; overflow : visible; text-decoration : none; cursor : pointer; line-height : 13px; font-size : 16px; color : $text-color; border : 1px solid $border-color; text-align: center; @include size(45px , 38px); } } /* Forms *--------------------------------------------------------------------------- */ .form-row { @include clearfix(); label.hidden { visibility:hidden; } label.inline { display: inline; } label{ display: block; } select { cursor: pointer; } .required { color: $red; font-weight: $headings-font-weight; border: 0; } .input-text{ width: 100%; } &.form-row-wide{ clear: both; margin:0; margin-bottom:14px; } } ul.tabs { list-style:none; padding: 0 0 0 1em; margin: 0 0 1.618em; overflow:hidden; position: relative; li { @include inline-block(); position: relative; z-index: 0; margin: 0 -5px; padding: 0 1em; border: 1px solid darken( $border-color, 10 ); @include box-shadow(0 3px 3px rgba($black, 0.2), inset 0 1px 0 rgba($white,0.6)); a { @include inline-block(); padding: .5em 0; font-weight: 700; font-family:$font-family-base; color: $border-color; text-decoration: none; &:hover { text-decoration:none; color: lighten( $border-color, 10 ); } } &.active { background: $border-color; z-index: 2; border-bottom-color: $border-color; a { color: inherit; text-shadow: inherit; } &:before { @include box-shadow(2px 2px 0 $border-color); } &:after { @include box-shadow(-2px 2px 0 $border-color); } } &:before, &:after { border: 1px solid darken($border-color, 10); position:absolute; bottom: -1px; content: ""; @include size(5px,5px); } &:before { border-width: 0 1px 1px 0; @include rtl-left(-6px); @include border-right-radius(4px); @include box-shadow(2px 2px 0 darken( $border-color, 10 )); } &:after { border-width: 0 0 1px 1px; @include rtl-right(-6px); @include border-left-radius(4px); @include box-shadow(-2px 2px 0 darken( $border-color, 10 )); } } } .product-quantity{ .input-text{ @include input-size('.input-sm', $input-height-sm, $padding-base-vertical, $padding-base-vertical, $font-size-sm, $line-height-sm, 0); } } .i-am-new{ li{ background-image: none !important; background-color: $white !important; -webkit-border-radius: 0px !important; border-radius: 0px !important; .noty_message{ padding: 20px 0 !important; } } } /* Sale Label *--------------------------------------------------------------------------- */ .onsale,.hot{ text-align: $sale-label-align; color: $white; @include font-size(font-size,$sale-label-font-size); padding: $sale-label-padding; text-transform: $sale-label-transform; font-weight: $sale-label-font-weight; display:block; position:relative; line-height:25px; text-align:center; min-width:52px; @include border-radius(30px); z-index:1; &:empty{ display:none; } @media (max-width:$screen-xs){ font-size: 12px; padding:0 5px; min-width: 30px; line-height: 18px; } } .onsale{ background: #ef262c; } .hot{ background:$theme-color; margin-bottom: 5px; color:$gray-dark; text-transform:uppercase; } /* Star rating *--------------------------------------------------------------------------- */ .star-rating { overflow: hidden; position: relative; @include size(95px, 1.2em); line-height: 1.2em; display:inline-block; font-family: icomoon; @include font-size(font-size,$star-rating-font-size); &:before { content: "\e901\e901\e901\e901\e901"; color: $gray-light; @include rtl-float-left(); top: 0; @include rtl-left(0); position: absolute; letter-spacing: 1px; } span { overflow: hidden; @include rtl-float-left(); top: 0; @include rtl-left(0); position: absolute; padding-top: 1.5em; } span:before { content: "\e901\e901\e901\e901\e901"; top: 0; position: absolute; @include rtl-left(0); color: $theme-color; letter-spacing: 1px; } } /* Mini cart *--------------------------------------------------------------------------- */ .bumbleb-topcart{ &.active{ &.popup{ .cart-popup{ &.popup{ @include transform(translateX(0) !important); @include opacity-s(); } } } .remove-cart-shadow{ display:block; } } &.dark{ .cart-popup{ background:#222; border:0; } .mini-cart .cart-popup{ .cart_item{ border-color: rgba(#e1e1e1, .5); } .remove-cart{ a{ color:$white !important; &:before{ background-color: $white !important; } } } .top-total-cart{ color:$white; } .product-name a{ color:$white !important; } .quantity{ background:$white !important; } .quantity,.product-subtotal{ color:$white !important; } .total-cart{ color:$white; border-color: rgba(#e1e1e1, .5); } .free-order{ color:$white; } .product-remove a{ color:$gray-dark; border-color:$white; &:hover{ border-color:$theme-color; } } div.empty{ color:$white !important; &:before{ color:$white !important; } .go-shop{ color:$white; border-color:$white !important; &:before{ background:$white !important; } } } .free-ship { color:$white; border-color: rgba(#e1e1e1, .5); .total-percent .percent{ background: $white; &:before{ background:#222222; color: $white; } } } } } } .bumbleb-topcart{ &.popup{ &:not(.show){ .mini-cart{ .remove-cart{ a{ .close-line1{ @include transform(translateY(0) translateX(0) rotate(-45deg)); animation-name: crossLeftClose; @include animation-delay(0s); @include animation-duration(.15s); } .close-line2{ @include transform(translateY(0) translateX(0) rotate(45deg)); -webkit-animation-name: crossRightClose; animation-name: crossRightClose; @include animation-delay(.06s); @include animation-duration(.15s); } } } } } &.show{ .mini-cart{ .cart-popup{ @include transform(translateX(0) !important); @include opacity-s(); >.inner{ @include transform(translateX(0) !important); } } .remove-cart-shadow{ display:block; } .remove-cart{ a{ .close-line1{ @include transform(translateY(-30px) translateX(30px) rotate(45deg)); animation-name: crossRight; animation-delay: .14s; } .close-line2{ animation-name: crossLeft; @include transform(translateY(-30px) translateX(-30px) rotate(-45deg)); } } } } } .mini-cart{ position: relative; .cart-popup{ position: fixed !important; height: 100%; right: 0 !important; width: 500px; max-width:calc(100vw - 30px); top: 0 !important; z-index: 10000; @include transform(translateX(107%) !important); @include transition(all .8s cubic-bezier(0.2,1,.3,1)); padding: 40px; overflow: hidden; .free-ship .total-percent{ margin-bottom: 20px; } @media (max-width:$screen-xs){ padding: 30px 15px; } > .inner{ @include transition(all .8s cubic-bezier(.2, 1, .3,1)); @include transform(translateX(-107%) !important); height: 100%; } .woocommerce-cart-header{ height:100%; } .box-cart-top{ display:flex; justify-content:space-between; border-bottom:2px solid $gray-dark; align-items:center; padding-bottom:10px; margin-bottom:30px; } .remove-cart{ top: 30px; position: absolute; left: 40px; width: calc(100% - 80px); padding-bottom: 15px; z-index: 10; display: flex; align-items: center; border-bottom:1px solid rgba(#e1e1e1, .5); a{ color:$gray-dark; line-height: .9; font-weight:500; @include rtl-margin-left(auto); position: relative; width: 30px; @include transition(opacity .2s ease); &:before{ position: absolute; content: ""; top: 50%; left: 50%; display: block; background-color: rgba($gray-dark, .05); @include square(34px); @include rtl-margin(-17px, 0, 0, -17px); @include border-radius(50%); @include transform(scale(1) translateZ(0)); @include transition(all .45s cubic-bezier(.15,.2,.1,1)); } .close-text{ @include opacity-h(); } .close-wrap{ -webkit-font-smoothing: subpixel-antialiased; transform-style: preserve-3d; position: absolute; top: 50%; left: 50%; @include transform(translate(-50%, -50%)); @include transition(margin .2s ease,transform .2s ease 1s,opacity .3s ease); width: 20px; height: 15px; display: block; overflow: hidden; } .close-line{ height: 100%; width: 2px; background-color: $gray-dark; backface-visibility: hidden; position: absolute; border-radius: 5px; left: 9px; @include transition(opacity .2s ease,background-color .2s ease); animation-duration: .4s; animation-timing-function: cubic-bezier(.52,.01,.16,1); animation-fill-mode: forwards; } &:hover{ &:before{ @include transform(scale(1.2) translateZ(0)); } } } @media(max-width: $screen-xs-max){ width: calc(100% - 30px); left: 15px; } } .widget_shopping_cart{ height: calc(100% - 40px); top: 65px; position: relative; } .widget_shopping_cart_content{ height: 100%; display: flex; flex-direction: column; } .top-total-cart{ font-size:18px; text-transform: uppercase; font-weight: 700; font-family: $font-family-base; font-style: italic; margin: 0; width:auto; } .quantity{ color:$gray-dark; text-transform:uppercase; font-weight:600; } .price{ color:$text-color; font-size:14px; font-weight:400; } .cart-header-form{ flex: 1; max-height: none; padding: 0; overflow-y: auto; &::-webkit-scrollbar { width: 2px; } /* Track */ &::-webkit-scrollbar-track { background: #f1f1f1; } /* Handle */ &::-webkit-scrollbar-thumb { background: #000; } /* Handle on hover */ &::-webkit-scrollbar-thumb:hover { background: $theme-color; } li.empty{ text-align:center; position:relative; padding-top:85px; font-size:24px; color:$gray-dark; &:before{ content:"\e914"; font-family:wpbingofont; position:absolute; top:0; font-size:70px; line-height:1; left:calc(50% - 35px); color:$gray-dark; } span{ display:block; } .go-shop{ display:inline-block; font-size:16px; line-height:28px; margin-top:15px; position: relative; &:after{ content: ""; position: absolute; display: block; bottom: 0; left: 0; width: 100%; height: 2px; background-color: $gray-dark; @include transform(scaleX(1)); transform-origin: 0 50%; transition: transform .48s cubic-bezier(.77,0,.175,1); } i{ font-size:18px; @include rtl-margin-left(5px); position:relative; top:3px; } &:hover{ border-color:$theme-color; color:$theme-color; &:after{ transform-origin: 100% 50%; @include transform(scaleX(0)); animation: animate-btn-underline .96s .36s forwards cubic-bezier(.77,0,.175,1); } } } } } .buttons{ margin-bottom:0; display:flex; justify-content:space-between; .button{ width:calc(50% - 4px); @include border-radius(30px); margin:0; padding:10px 15px; text-transform: uppercase; color:$gray-dark; font-size:15px; @media (max-width:$screen-xs){ padding:7px 10px; font-size: 12px; } } } .mini_cart_item{ margin-bottom: 20px; padding-bottom: 20px; border-bottom:1px solid rgba(#e1e1e1,0.5); &:first-child{ margin-top: 20px; } &:last-child{ margin-bottom:0; padding-bottom:0; border-bottom:0; } } } } } &.dropdown{ .top-total-cart,.remove-cart{ display:none; } .mini-cart{ position: relative; } .cart-header-form{ max-height: 400px; overflow: auto; &::-webkit-scrollbar { width: 2px; } /* Track */ &::-webkit-scrollbar-track { background: #f1f1f1; } /* Handle */ &::-webkit-scrollbar-thumb { background: #000; } /* Handle on hover */ &::-webkit-scrollbar-thumb:hover { background: $theme-color; } } &.show{ .mini-cart{ .cart-popup{ @include opacity-s(); @include transform(translateY(0) !important); } .remove-cart-shadow{ display:block; } } } } } .mini-cart{ position: relative; .woocommerce-cart-form{ border:0; } .cart-popup.loadings{ &:before{ content:""; position:absolute; width:100%; height:100%; background:rgba($white,0.75); top:0; left:0; z-index:10; } &:after{ position: absolute; display: inline-block; content: ""; border:2px solid rgba($gray-dark,0.25); border-top-color:$gray-dark; @include square(30px); background: none; @include animation(2s linear 0s normal none infinite running spinAround); text-indent: 0; top:calc(50% - 15px); left:calc(50% - 15px); @include border-radius(50%); z-index:11; } } div.empty{ text-align:center; position:relative; padding-top:55px; font-size:18px; color:$gray-dark; span{ display:block; } .go-shop{ display:inline-block; background:$theme-color; font-size:16px; color: $gray-dark; padding: 5px 20px; @include border-radius(25px); line-height:28px; margin-top:5px; text-transform: capitalize; position: relative; i{ font-size:18px; @include rtl-margin-left(5px); position:relative; top:3px; } &:hover{ background: darken($theme-color, 10%); } } } .cart-popup { @include rtl-text-align-left(); width: 380px; padding: 30px 20px; border: 1px solid #f3f3f3; background: $white; position: absolute; color: $gray-dark; @include opacity-h(); @include transition(all 0.3s ease); @include transform(translateY(20px) !important); z-index: 10001; @include border-radius(0); left:auto !important; @include rtl-right(0 !important); top: 45px !important; will-change: unset !important; @include box-shadow(0px 5px 5px 0px rgba(50, 50, 50, 0.2)); @media (max-width: $screen-phone){ width: 290px; .product-image{ width: 60px !important; } } .total-cart{ font-size: 16px; color: $gray-dark; line-height: 26px; position: relative; font-weight: 700; margin-top: 30px; display:flex; justify-content:space-between; border-top:1px solid #e9e9e9; padding-top:15px; .total-price{ font-size: 18px; } } .free-ship{ border-top:1px solid #e7e7e7; margin-top:15px; padding-top:20px; font-size:16px; @media (max-width:$screen-xs){ font-size:14px; } strong{ text-decoration:underline; } .total-percent{ position:relative; width:100%; background:#e9e9e9; @include border-radius(5px); height: 5px; margin: 20px 0 35px; .percent{ position:absolute; height:100%; left:0; background: orange; top:0; @include transition(all 0.5s ease); &:before{ content: "\e9e8"; position:absolute; @include rtl-right(0); font-family: "feather"; top: 50%; @include transform(translateY(-50%)); display: inline-flex; align-items: center; justify-content: center; color:$gray-dark; font-size:18px; background:$white; @include square(36px); border-radius: 50%; border: 1px solid #dfdfdf; } &.free{ background:$theme-color; } } } } .cart_item { position: relative; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #e9e9e9; overflow: hidden; display:flex; .blockOverlay{ background:$white !important; opacity:0.75 !important; backdrop-filter: blur(5px); } &:last-child{ margin-bottom:0; padding-bottom: 0; border-bottom: 0; } a{ color: $text-color; &.remove{ @include square(18px); background: $theme-color; text-align:center; line-height:16px; color:$gray-dark; font-size:18px; border-radius:50%; &:hover{ color:$white; background:$theme-color; border-color:$theme-color; } } &:hover{ color: $theme-color; } } .woocommerce-product-rating{ margin-top: 0; .star-rating{ margin-bottom:0; } } .variation{ font-size: 13px; margin-top: 0; margin-bottom: 7px; >*{ margin-bottom:0; } dt.variation-Vendor{ font-weight: 500; } >*{ display: inline-block; >p{ margin: 0; } } } } .content-cart-left { display: inline-block; width: 78px; flex:0 0 78px; @include rtl-margin-right(12px); img { width: 100%; height: auto; display: block; } } .content-cart-right{ flex: 1; padding-right: 35px; } .product-name a{ color: $gray-dark !important; text-transform: uppercase; display:block; line-height:1.3; font-weight: 800; margin-bottom:0; margin-bottom:10px; font-family: $font-family-base; &:hover{ color:$theme-color !important; } } .quantity { font-weight:500; color: $gray-dark; @include border-radius(25px); margin: 0; margin-bottom:10px; display:inline-flex; border:1px solid #dfdfdf; input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } button,input{ float:unset; border:0; height:30px; line-height:30px; width:30px; color: $gray-dark; } .plus{ order:3; } .minus{ order:1; } input{ order:2; } } .product-subtotal{ color:$text-color; font-weight:700; font-family: $font-family-base; } .remove { position: absolute; @include rtl-right(5px); top: 5px; } .free-order{ color:$gray-dark; text-align:center; margin-top:20px; text-transform:uppercase; font-size:12px; span{ text-decoration:underline; font-weight:700; } } .total { text-transform: uppercase; color: $white; } .buttons { display: flex; margin-bottom: 10px; margin-top: 13px; width:100%; .button { width: calc(50% - 4px); margin: 5px 0; display: block; padding:10px 15px; font-weight: 800; font-family:$font-family-base; overflow:hidden; position:relative; font-size:15px; text-transform: capitalize; text-overflow: ellipsis; color:$gray-dark; background:#a0a0a0; @include transition(unset); display: inline-block; @include border-radius(30px); margin: 0 5px; border:0; position: relative; overflow: hidden; &:after{ content: ""; position: absolute; z-index: -1; @include transition(all .3s ease); } span{ display: inline-block; width: 100%; height: 100%; @include transition(all .3s ease); @include backface-visibility(hidden); text-transform:uppercase; } &:first-child{ @include rtl-margin-left(0); } &:last-child{ @include rtl-margin-right(0); } @media (max-width: 481px){ font-size:11px; } &.view-cart{ background:$theme-color; } &:before{ @include border-radius(30px); bottom:0; top:auto; background:darken($theme-color, 10%); } } } } } /* Cart *--------------------------------------------------------------------------- */ .cart_list{ > div{ border-bottom: 1px solid rgba(0, 0, 0, 0.1)!important; margin: 10px 0; padding: 10px 0; } .image{ @include size(70px,70px); } .cart-item{ line-height: 1.1; margin: 0; font-size: $font-size-base!important; .amount{ font-size: $font-size-base!important; } } .cart-main-content{ @include rtl-text-align-left(); position: relative; .remove{ position: absolute; @include rtl-right(0); top: auto; @include font-size(font-size,25px); bottom: 10px; height: 20px; } } + .total{ @include rtl-text-align-right(); margin-top: 10px; .amount{ font-size: $font-size-base!important; } } } /** Plugins add to wishlist, compare **/ .woosc_table tbody { tr.tr-add_to_cart td a{ color:$gray-dark; display:inline-block; font-family: $font-family-base; font-weight: 700; text-transform: uppercase; line-height:45px; background:$theme-color; padding:0 30px; @include border-radius(24px); &:hover{ background:darken($theme-color,10%); } } tr{ td{ border-left:1px solid $border-color !important; border-bottom:1px solid $border-color !important; padding:20px !important; background:$white !important; &:first-child{ background:#f5f5f5 !important; font-size:16px; color:$gray-dark !important; font-weight:500 !important; } } } } .woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-mid table.woosw-items .woosw-item .woosw-content-item--title, .woosw-popup .woosw-popup-inner .woosw-content .woosw-content-mid table.woosw-items .woosw-content-item .woosw-content-item--title a{ font-weight:500; } .woosw-popup .woosw-popup-inner .woosw-popup-content{ max-width:670px; @include border-radius(0 !important); background:$white; @media (min-width:$screen-sm-max){ min-height:600px; } .woosw-item--actions{ @include rtl-text-align-right(); } .woosw-popup-content-bot{ background:$white; color:$gray-dark; padding:0; border-top:1px solid $border-color; line-height:1; display:flex; flex-wrap:wrap; align-items:center; .woosw-popup-content-bot-inner{ padding: 5px 15px; a{ margin: 5px 0; } } .woosw-notice{ height:60px; line-height:60px; top:60px; background: $gray-dark; } .woosw-popup-content-bot-inner{ .woosw-page{ font-size:14px; text-transform:capitalize; border: 0; display:inline-block; line-height:35px; padding:0 25px; background:$gray-dark; @include border-radius(25px); color: $white ; text-decoration: none !important; text-align: center; position: relative; &:hover{ background:$theme-color; color: $gray-dark ; } } .woosw-continue{ display:inline-block; line-height:32px; padding:0 25px; border:1px solid $gray-dark !important; @include border-radius(25px); font-size:14px; text-transform:capitalize; color:$gray-dark !important; text-decoration: none !important; text-align: center; position: relative; overflow: hidden; &:after{ content: ""; @include border-radius(25px); position: absolute; z-index: -1; @include transition(all .3s ease); width: 0; height: 100%; top: 50%; left: 50%; background: $theme-color; @include opacity-h(); @include transform(translate(-50%, -50%)); } &:hover{ z-index: 2; color: $gray-dark !important; border:1px solid $theme-color !important; &:after{ width: 100%; @include opacity-s(); } } } } } .woosw-popup-content-top{ background:$white; color:$gray-dark ; padding:0; font-size:20px; font-weight:500; text-transform:capitalize; height:60px; line-height:60px; border-bottom: 1px solid $border-color; padding:0 20px; &:before{ font-size: 22px; color: $theme-color; line-height: 35px; @include transition(all 0.1s ease); content:"\e977"; font-family: 'feather'; margin:0; position:relative; top:3px; } .woosw-popup-close{ $size: 30px; height: $size; width: $size; position: absolute; top: 10px; @include rtl-right(15px); box-sizing: border-box; line-height: $size; display: inline-block; @include border-radius(50%); background: $white; @include box-shadow( 0px 1px 12px 2px rgba($gray-dark, 0.05)); &:before, &:after { $width: 15px; $height: 1px; @include transform(rotate(-45deg)); content: ''; position: absolute; top: 50%; left: calc(50% - 7px); display: block; height: $height; width: $width; background-color: $gray-dark; @include transition(all .3s ease-out); } &:after { @include transform(rotate(-135deg)); } &:hover { &:before, &:after { @include transform(rotate(0deg)); } } } } @media (max-width:$screen-xs-max){ .woosw-content-bot { height:80px; .woosw-page{ line-height:30px; padding:0 15px; margin:2.5px 0; font-size:10px; } .woosw-continue{ line-height:26px; padding:0 15px; margin:2.5px 0; font-size:10px; } .woosw-notice{ height:80px; line-height:80px; top:80px; } } } @media (max-width:$screen-xs){ max-width: 370px; .woosw-popup-content-bot-inner { .woosw-page{ width: 100%; } .woosw-continue{ width: 100%; } } } } .woosw-popup{ .woosw-items{ border:0; padding: 0; .woosw-item{ padding: 0; .woosw-item--price{ font-size:18px; color:$gray-dark; font-weight:500; ins{ text-decoration:none; .woocommerce-Price-amount{ color: #ff4545; } } } .woosw-item--time{ font-size:12px; } td{ border:0; background:transparent !important; padding:15px 10px !important; } tr{ border-bottom:1px solid $border-color; &:last-child{ border-bottom: 0; } } .woosw-item-inner{ border-top: 1px solid $border-color; padding: 20px 15px; } .woosw-item--remove{ @include rtl-margin-right(15px !important); span{ &:before{ content:"\e908" !important; font-family: icomoon!important; display: inline-block; @include transition(all .3s ease); } &:hover{ &:before{ @include transform(rotate(90deg)); color: $theme-color; } } } } .woosw-item--image{ img{ width:95px !important; border:1px solid $border-color !important; @include border-radius(0 !important); } } .woosw-item--add{ .add_to_cart_inline{ margin:0; } a{ color: $gray-dark ; display:inline-block !important; line-height: 32px; height: 32px; font-family: $font-family-base; font-weight: 700; text-transform: uppercase; background:$theme-color; @include border-radius(25px); padding:0 20px !important; font-size:13px !important; margin-top:10px !important; position: relative; overflow: hidden; text-align: center; &:after{ content: ""; position: absolute; z-index: -1; @include transition(all .3s ease); } span{ display: inline-block; width: 100%; height: 100%; @include transition(all .3s ease); @include backface-visibility(hidden); } &:hover{ background: darken($theme-color, 10%); span{ @include transform(translateX(200%)); } } &.added_to_cart{ display:none !important; } &.loading{ span{ position: unset; border: none !important; animation: none; } color:transparent; position:relative; &:before { position: absolute; display: inline-block; content: ""; border:2px solid rgba($white,0.5); border-top-color:$white; @include square(16px); @include border-radius(50%); background: none; @include animation(2s linear 0s normal none infinite running spinAround); text-indent: 0; left: 0; top:calc(50% - 16px); @include transition(all 0s ease); } } } } @media (max-width:$screen-xs-max){ tr{ display:flex; flex-wrap:wrap; } .woosw-item--image{ flex:0 0 70px; } .woosw-item--info{ flex:0 0 calc(100% - 100px); } .woosw-item--actions{ width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; border:0; border-top:1px dashed $border-color; padding:15px !important; .woosw-item--add a{ margin:0 !important; } } .woosw-item--image{ img{ width:65px !important; } } } } } } .woosc-area .woosc-inner .woosc-bar .woosc-bar-btn{ background:$theme-color !important; color: $gray-dark !important; &:hover{ background:darken($theme-color,10%) !important; } } .woosc_table{ del{ font-size:0; } .tr-price{ .woocommerce-Price-amount{ font-size:18px; color:$gray-dark; font-family: $font-family-base; } del{ font-size:0; .woocommerce-Price-amount{ font-size:18px; color:$text-color; } } ins{ text-decoration:none; .woocommerce-Price-amount{ color: #ff4545; } } } table tr{ th{ background:rgba($gray-dark,0.15) !important; } td{ border:0 !important; padding-left:15px !important; p:last-child{ margin:0; } } } } .woosw-list{ @media(max-width: $screen-sm){ text-align: center; } .woosw-actions{ .woosw-share-label{ color:$gray-dark; font-size:14px; } .woosw-share{ margin:5px 0; a{ @include square(25px); @include border-radius(50%); text-align:center; line-height:25px; color:$white; background:#3b5998; .woosw-icon{ font-family: 'feather'; font-style: normal!important; } &.woosw-share-facebook{ .woosw-icon{ &:before{ content: '\e95e'; } } } &.woosw-share-twitter{ background:#55acee; .woosw-icon{ &:before{ content: '\e9ea'; } } } &.woosw-share-pinterest{ background:#cb2027; .woosw-icon{ &:before{ content: '\e9d5'; } } } &.woosw-share-mail{ background:#dc4e41; .woosw-icon{ &:before{ content: '\e918'; } } } } } .woosw-copy{ position:relative; margin:10px 0; flex-wrap:wrap; .woosw-copy-label{ color:$gray-dark; font-size:14px; } .woosw-copy-url{ input{ border:1px solid $border-color; height:50px; line-height:50px; @include border-radius(30px); min-width:450px; @include rtl-padding(0 ,120px ,0 ,20px); @media (max-width:$screen-xs){ min-width:auto; width:100%; } } } .woosw-copy-btn{ position:absolute; @include rtl-right(7px); input{ background:$theme-color; color:$gray-dark; border:0; line-height:38px; padding:0 30px; @include border-radius(20px); font-size:14px; font-weight:500; border: 1px solid $theme-color; @include transition(all .3s ease); cursor:pointer; &:hover{ background: transparent; color: $gray-dark; } } } } } .woosw-items{ border:1px solid $border-color; @include border-radius(15px); tbody{ tr{ border-bottom: 1px solid #e5e5e5; &:last-child{ border-bottom: 0; } td{ border: 0; background-color: transparent !important; &.woosw-item--remove{ span{ &:before{ content: "\e908" !important; font-family: 'icomoon' !important; display: inline-block; @include transition(all .3s ease); } &:hover{ &:before{ @include transform(rotate(90deg)); color: $theme-color !important; } } } } } } } .woosw-content-item--title{ font-size:14px; a{ font-weight:500 !important; } } .woosw-item--info{ .woosw-item--price{ font-size:16px; font-weight: 700; color: $theme-color; ins{ text-decoration:none; .woocommerce-Price-amount{ color: $theme-color; } } del{ font-size: 14px; } >span{ color: $theme-color; } } .woosw-item--time{ font-weight: 500; } } .woosw-item--actions{ @include rtl-border-left(1px solid $border-color); @include rtl-padding-left(30px !important); .woosw-item--add{ a{ color:$gray-dark; display:inline-block !important; line-height: 32px; @include border-radius(25px); height: 32px; background:$theme-color; font-weight: 700; text-transform: uppercase; padding:0 20px !important; font-size:13px !important; margin-top:10px !important; font-family: $font-family-base; position: relative; overflow: hidden; @include transition(all .3s ease); text-align: center; &:after{ content: ""; position: absolute; z-index: -1; @include transition(all .3s ease); } &:hover{ background: darken($theme-color, 10%); } &.product_type_variable, &.product_type_external, &.read_more{ &:before{ display: none; } } &.added_to_cart{ display:none !important; } &.loading{ span{ position: unset; border: none !important; animation: none; } color:transparent; position:relative; &:before { position: absolute; display: inline-block; content: ""; border:2px solid rgba($white,0.5); border-top-color:$white; @include square(16px); @include border-radius(50%); background: none; @include animation(2s linear 0s normal none infinite running spinAround); text-indent: 0; left: 0; top:calc(50% - 15px); } } } } .woosw-item--stock{ p{ margin: 0; } } } } @media (max-width:$screen-sm-max){ .woosw-actions{ align-items: center; } } @media (max-width:$screen-xs){ .woosw-actions{ .woosw-copy-label{ display: none; } } } @media (max-width:$screen-xs-max){ .woosw-items{ tr{ display:flex; flex-wrap:wrap; } .woosw-item--remove{ flex:0 0 30px; } .woosw-item--image{ flex:0 0 100px; } .woosw-item--info{ flex:0 0 calc(100% - 130px); } .woosw-item--actions{ width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; border:0; padding:15px !important; .woosw-item--add a{ margin:0 !important; } } .woosw-item--image{ img{ width:95px !important; } } } } } //Shop filter .woocommerce { .widget_price_filter { overflow: hidden; .ui-slider .ui-slider-handle { @include square(10px); @include border-radius(50%); background: $theme-color; top: -4px; &:last-child{ transform:translateX(-10px); } } .ui-slider .ui-slider-range { background: $gray-dark; } .price_slider_wrapper { .ui-widget-content { @include border-radius(0); background: #d7d7d7; margin-top: 15px; margin-bottom: 0; } } .ui-slider-horizontal { height: 2px; } //button #respond input#submit, a.button, button.button, input.button { border: none; @include border-radius(20px); background: $theme-color; color: $gray-dark; text-transform: uppercase; height: 30px; line-height: 30px; padding: 0 15px; margin-top: 20px; @include rtl-float-right(); font-size:12px; font-family:$font-family-base; &:hover{ background: darken($theme-color, 10%); } } .price_slider_amount { margin-top: 10px; .price_label { @include rtl-text-align-left(); } } } .widget_layered_nav{ .dropdown_layered_nav_size{ margin-top: 10px; padding: 5px 20px; } } } // bwp-top-bar .bwp-top-bar { font-size: 14px; position: relative; @media (max-width:$screen-xs){ display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; &:after{ display:none; } &.bottom{ justify-content:center; } } .woocommerce-filter-title{ width:100%; display: inline-block; color:$gray-dark; text-transform:capitalize; font-weight:500; margin-top:10px; order:3; >span{ display:inline-block; background:$theme-color; line-height:26px; color: $gray-dark; @include rtl-padding(0 ,10px ,0 ,15px); cursor:pointer; @include rtl-margin(2.5px ,10px ,2.5px ,0); @include border-radius(25px); &:after{ font-family: ElegantIcons; content: "\4d"; display:inline-block; @include rtl-margin-left(5px); font-size: 16px; line-height: 1; position: relative; top: 2px; } &:hover{ background: darken($theme-color, 10%); color:$white; } } >button{ background:transparent; border:0; padding:0; cursor:pointer; line-height: 20px; position: relative; &:after{ content: ""; position: absolute; display: block; bottom: 0; left: 0; width: 100%; height: 1px; background-color: $gray-dark; @include transform(scaleX(1)); transform-origin: 0 50%; transition: transform .48s cubic-bezier(.77,0,.175,1); } &:hover{ color: $theme-color; &:after{ background-color: $theme-color; transform-origin: 100% 50%; @include transform(scaleX(0)); animation: animate-btn-underline .96s .36s forwards cubic-bezier(.77,0,.175,1); } } } } .woocommerce-filter-title:empty{ background:red; } .display { @include rtl-float-right(); padding:9px 15px; @include rtl-margin-right(10px); border:1px solid #e1e1e1; @include border-radius(25px); background:$white; line-height:1; list-style:none; li { @include rtl-float-left(); @include rtl-padding-right(10px); position: relative; a { display: inline-block; text-align: center; height: 17px; @include transition(all 0.2s ease); .icon-column{ vertical-align: middle; @include transition(all 0.3s ease); text-align: center; z-index: 0; display: inline-block; .layer{ position:absolute; @include rtl-left(0); height:5px; &.first{ top:0; } &.middle{ top:6px; } &.last{ top:12px; } >span{ position: absolute; display: block; width: 5px; height: 100%; background:#cecece; @include border-radius(1px); } } } &.two{ width: 11px; position:relative; .icon-column{ .layer{ >span{ &:first-child{ @include rtl-left(0); } &:last-child{ @include rtl-left(6px); } } } } } &.three{ width: 17px; .icon-column{ .layer{ >span{ &:first-child{ @include rtl-left(0); } &:nth-child(2){ @include rtl-left(6px); } &:last-child{ @include rtl-left(12px); } } } } } &.four{ width: 23px; .icon-column{ .layer{ >span{ &:first-child{ @include rtl-left(0); } &:nth-child(2){ @include rtl-left(6px); } &:nth-child(3){ @include rtl-left(12px); } &:last-child{ @include rtl-left(18px); } } } } } &.view-list{ width: 25px; .icon-column{ .layer{ >span{ &:first-child{ @include rtl-left(0); } &:last-child{ @include rtl-left(6px); width:17px; height:1px; top:2px; } } } } } &:hover, &.active{ background: $white; border-color: $theme-color; .icon-column{ .layer{ >span{ background:$theme-color; } } } } } &:last-child{ padding-right: 0; } } } &.top { margin-bottom:20px; margin-top:-5px; .button-filter-toggle{ font-weight: 500; display: inline-block; position: relative; font-size: 12px; text-transform: uppercase; cursor: pointer; color:$gray-dark; line-height:32px; border:2px solid $gray-dark; @include rtl-float-left(); background:$white; padding:0; @include rtl-margin-right(20px); @include square(36px); text-align:center; &:before{ display:none; } &:after{ font-size: 19px; position: relative; content: "\e9d1"; font-family: feather; text-transform: none; line-height: 1; margin:0; line-height:32px; } &.active{ background:$theme-color; border-color: $theme-color; &:before{ @include transform(scale(1)); opacity: 1; visibility: visible; } } &:hover{ background:$theme-color; border-color: $theme-color; &:after{ color:$gray-dark; } } @media (max-width:$screen-xs){ font-size:10px; line-height:26px; margin:5px 0; } } } &.bottom { clear: both; text-align:center; margin-top:30px; .loading-filter:before{ opacity:1; } } .woocommerce-ordering { margin-bottom: 0; height:36px; line-height:36px; .woocommerce-ordering-content{ @include rtl-float-right(); } .orderby { border-color: $border-color; color: $gray-dark; } @media (max-width:$screen-xs){ height:30px; } } .woocommerce-ordering, .woocommerce-sort-count{ @include rtl-float-right(); background: $white; color: $gray-dark; font-weight: 500; font-size: 14px; line-height:33px; border:1px solid #e1e1e1; padding:0 20px; text-transform:capitalize; cursor: pointer; .pwb-dropdown-toggle{ position:relative; border:1px solid #e1e1e1; @include border-radius(25px); display:inline-block; line-height:34px; padding:0 20px; &:after{ content: "\43"; font-family: eleganticons; font-size: 13px; @include rtl-padding-left(5px); display:inline-block; width: auto; height: auto; margin-left: 0; vertical-align: 0; border-top: 0; border-right: 0; border-bottom: 0; border-left: 0; line-height:1; position:relative; top:1px; @include transition(all 0.3s ease); transform-origin: 65% 50%; color:$gray-dark; } } &.open{ .pwb-dropdown-toggle{ &:after{ @include transform(rotate(-180deg)); } } } .pwb-dropdown-menu{ @include rtl-right(0); left: auto; li{ line-height: 28px; text-transform: capitalize; font-weight:400; a{ color:$text-color; &:hover{ color:$theme-color; } } } } @media (max-width:$screen-xs){ order:2; margin-top:5px; margin-bottom:5px; } } .woocommerce-ordering{ border:0; padding:0; background:transparent; .pwb-dropdown-menu{ min-width:210px; z-index: 100; } } .bumbleb-woocommerce-sort-count{ @include rtl-margin-right(20px); font-weight:500; @include rtl-float-left(); .list-show{ @include rtl-padding-left(0); display:inline-flex; margin-bottom: 0; li{ list-style:none; color:$gray-dark; font-weight:500; @include rtl-margin-right(15px); @include rtl-padding-right(15px); font-weight:500; position:relative; &:before{ content:""; position:absolute; top:calc(50% - 8px); @include size(1px,16px); background:#e1e1e1; right:0; } &:last-child{ @include rtl-margin-right(0); @include rtl-padding-right(0); &:before{ display:none; } } a{ color:$text-color; font-weight:500; } &.active,&:hover{ a{ color:$theme-color; } } } } @media (max-width:$screen-xs){ @include rtl-float-right(); @include rtl-margin(5px ,5px ,5px ,0); clear: both; } } .woocommerce-result-count{ color:$text-color; text-transform:initial; font-weight:400; position:relative; float:right; margin-right:10px; margin-top:8px; } .woocommerce-pagination { display: inline-block; } .woocommerce-found-posts { line-height: 25px; background: $white; @include rtl-padding-right(10px); @media (min-width: $screen-lg){ @include rtl-padding-right(15%); } &:after{ top: 12px; content: ""; background: rgba($light-gray, 0.2); @include size(100%, 1px); position: absolute; @include rtl-left(0); z-index: -1; } } } .woocommerce-pagination{ &.shop-loadmore{ text-align: center; display: block; .woocommerce-product-count{ margin: 0 0 15px; } .woocommerce-load-more{ margin: 0 auto; font-weight: 800; @include transition(all .3s ease); border: 0; cursor: pointer; height:45px; line-height: 45px; padding: 0 40px; background: $theme-color; font-family: $font-family-base; text-transform: uppercase; color:$gray-dark; font-size:14px; @include border-radius(25px); position: relative; overflow: hidden; &:hover{ background: darken($theme-color, 10%); } &.active{ span{ @include opacity-h(); } .lds-dual-ring { position: absolute; top: 50%; left: 50%; @include transform(translate(-50%, -50%)); display: inline-block; @include square(45px); } .lds-dual-ring{ &:before{ position: relative; content: ""; display: inline-block; top: 10px; @include square(25px); @include border-radius(50%); border: 3px solid $white; border-color: #fff transparent #fff transparent; animation: lds-dual-ring 1.2s linear infinite; } } &:after{ display: none; } } } .woocommerce-load-more{ .button{ display: inline-block; } } .percent-content{ width: 100%; max-width: 410px; padding: 2px; background: $theme-color; margin-bottom: 15px; display: inline-block; .percent{ height: 2px; background: $white; } } } &.shop-infinity{ .woocommerce-load-more{ .loading-infinity{ .gooey{ position: absolute; top: 0; left: calc(50% - 45px); width: 90px; height: 40px; background: $white; filter: contrast(20); } .dot{ position: absolute; width: 12px; height: 12px; top: 12px; left: 15px; filter: blur(4px); background: $gray-dark; @include border-radius(50%); @include transform(translateX(0)); animation: loading-filter 2.8s infinite; } .dots{ @include transform(translateX(0)); margin-top: 12px; margin-left: 31px; animation: loading-filter2 2.8s infinite; div{ display: block; float: left; width: 12px; height: 12px; margin-left: 5px; filter: blur(4px); background: $gray-dark; border-radius: 50%; } } } } } }
[-] _shortcodes.scss
[edit]
[+]
..
[-] _woocommerce-product.scss
[edit]
[-] _post.scss
[edit]
[-] _woocommerce-widgets.scss
[edit]
[-] _form.scss
[edit]
[-] _effect.scss
[edit]
[-] _woocommerce-responsive.scss
[edit]
[-] _woocommerce-general.scss
[edit]
[-] _responsive.scss
[edit]
[-] _woof.scss
[edit]
[-] _menu.scss
[edit]
[-] _utilities.scss
[edit]
[-] _base.scss
[edit]
[-] _layout.scss
[edit]
[-] _slider.scss
[edit]
[-] _widgets-layout.scss
[edit]
[-] _pages.scss
[edit]
[-] _fonts.scss
[edit]
[-] _elementor.scss
[edit]
[-] _garenal.scss
[edit]
[-] _header.scss
[edit]
[-] _woocommerce-page.scss
[edit]
[-] _widgets.scss
[edit]