@import "../../../../../css/_mixins.scss"; @import "../../../../../css/_trx_addons.vars.scss"; .sc_layouts_cart { position:relative; z-index:2000; } .sc_layouts_cart_icon, .sc_layouts_cart_details { cursor:pointer; } .sc_layouts_cart_items_short { display:none; font-size:9px; background-color:#333; color: #fff; /* Old way: don't fit big numbers @include square(15px); @include border-round; @include abs-rt(-5px, -5px); */ /* New way: stretch to fit any number */ min-width: 15px; min-height: 15px; line-height: 15px; text-align: center; padding: 0 2px; @include border-box; @include border-radius(8px); @include abs-rt; @include translate(50%,-33%); pointer-events: none; } .sc_layouts_row_type_compact { .sc_layouts_cart_details { display:none; } .sc_layouts_cart_items_short { display:block; } } /* Widget: Cart */ .sc_layouts_cart_widget { display:none; text-align:left; @include abs-rt(-2em, 4em, 2); width: 280px; padding: 1em; border: 1px solid #ddd; background-color: #fff; color: #888; @include border-box; } .sc_layouts_cart_widget:after { content: ' '; display:block; @include abs-rt(2.5em, 0); @include box(8px, 8px); margin: -5px 0 0 -4px; border-left: 1px solid #ddd; border-top: 1px solid #ddd; background-color:#fff; @include rotate(45deg); } .sc_layouts_cart_widget .widget_shopping_cart { text-align: left !important; @include font(0.9333em, 1.5em); } .sc_layouts_cart_widget .cart_list { max-height: 215px; overflow-y:auto; overflow-x:hidden; } .sc_layouts_cart_widget p { margin-bottom:0; } .sc_layouts_cart_widget p+p { margin-top:0.75em; } .sc_layouts_cart_widget .variation { display: none; } .sc_layouts_cart_panel { --sc_layouts-cart-panel-padding: 1.5em; --sc_layouts-cart-panel-padding-half: calc( var(--sc_layouts-cart-panel-padding) / 2 ); --sc_layouts-cart-panel-padding-double: calc( var(--sc_layouts-cart-panel-padding) * 2 ); --sc_layouts-cart-panel-padding-triple: calc( var(--sc_layouts-cart-panel-padding) * 2.5 ); .sc_layouts_panel_inner { padding: var(--sc_layouts-cart-panel-padding); } .sc_layouts_cart_panel_header { @include abs-lt; width: 100%; @include border-box; padding: var(--sc_layouts-cart-panel-padding-half) var(--sc_layouts-cart-panel-padding); background-color: #eee; } .sc_layouts_cart_panel_title { margin: 0; } .sc_layouts_cart_items_short { display: inline-block; vertical-align: top; margin-left: 0.3em; font-family: var( --e-global-typography-theme_font_p-font-family, "inherit" ); font-weight: var( --e-global-typography-theme_font_p-font-weight, 400 ); font-size: 0.5em; @include border-round; position: static; @include transform-none; } .sc_layouts_cart_panel_widget { padding-top: var(--sc_layouts-cart-panel-padding-triple); .widget_shopping_cart { overflow: hidden; .widget_shopping_cart_content { overflow-x: hidden; overflow-y: scroll; max-height: calc( 100vh - 15em ); margin-right: -16px; } ul.cart_list li { padding: 0 1.5em 1em 0; a:not(.remove) { font-size: 1.15em; } a.remove { left: auto; right: 0; margin-top: 0; text-align: center; } img { @include border-sharp; width: 5em; margin-right: 1em; } .variation { display: none; } } .woocommerce-mini-cart__total, .woocommerce-mini-cart__buttons { @include abs-lb(var(--sc_layouts-cart-panel-padding), var(--sc_layouts-cart-panel-padding)); right: var(--sc_layouts-cart-panel-padding); } .woocommerce-mini-cart__total { bottom: calc( var(--sc_layouts-cart-panel-padding) + 4em ); width: calc( 100% - var(--sc_layouts-cart-panel-padding-double) ); text-align: right; } .woocommerce-mini-cart__buttons { @include flex; @include flex-justify-content(space-between); .button { width: 49%; text-align: center; } } } } } .sc_layouts_cart_link { display: block; } .sc_layouts_cart_button_wrap { @include fixed-rb(2em, 2em, 100100); @include transition-properties(bottom,opacity,transform); @include translateY(100px); opacity: 0; pointer-events: none; &.sc_layouts_cart_button_showed { @include translateY(0); opacity: 1; pointer-events: auto; } .trx_addons_scroll_to_top_show & { bottom: 6em; } .sc_layouts_cart_items_short { display: block; @include transform-none; } .sc_layouts_cart_widget { display: none; } &.sc_layouts_cart_button_preview .sc_layouts_cart_widget { display: none !important; } .sc_layouts_cart_button_icon { display: block; @include font(1.5em, 1em); @include square(2em); @include border-round; @include box-shadow(0 0 3px rgba(0,0,0,.15)); background-color: #efa752; color: #fff; position: relative; z-index: 1; @include transition-colors; } .sc_layouts_cart_button_sonar { display: block; background-color: #efa752; @include abs-pos(-10px, -10px, -10px, -10px); @include border-round; @include backface-hidden; @include perspective(800px); @include animation(sc-cart-button-sonar 2s ease infinite); } } /* Hotspot animation */ @-webkit-keyframes sc-cart-button-sonar { 0% { opacity: 0; @include scale(.2); } 50% { opacity: .8; } 100% { opacity: 0; @include scale(1); } } @keyframes sc-cart-button-sonar { 0% { opacity: 0; @include scale(.2); } 50% { opacity: .8; } 100% { opacity: 0; @include scale(1); } } //for trx_addons_filter_allow_sc_styles_in_elementor - trx_sc_layouts_cart .sc_layouts_column .trx_addons_customizable.sc_layouts_panel.sc_layouts_cart_preview_init .widget { text-align: left; } body.trx_addons_customizable_theme, .trx_addons_customizable { &.sc_layouts_cart, &.sc_layouts_cart > .sc_layouts_cart_link { @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(center); @include flex-wrap(nowrap); text-align: left; gap: 0.5em; } &.sc_layouts_cart { .sc_layouts_item_details { margin-left: 0; text-align: unset; } } .sc_layouts_cart_icon_custom { @include inline-flex; vertical-align: top; @include flex-justify-content(center); @include flex-align-items(center); } .sc_layouts_cart_icon > svg, .sc_layouts_cart_button_icon > svg, .sc_layouts_cart_widget_close svg, .trx_addons_button_close svg, .woocommerce.widget_shopping_cart a.remove > svg { display: inline-block; width: 1em; height: auto; @include transition-property(fill); } .sc_layouts_cart_icon > svg, .sc_layouts_cart_widget_close svg, .sc_layouts_item_details_line2, .trx_addons_button_close .sc_layouts_cart_widget_close_icon, .trx_addons_button_close svg, .sc_layouts_cart_item_close_icon, .woocommerce.widget_shopping_cart a.remove svg { @include transition-all; } // .sc_layouts_cart_panel_widget .total { .woocommerce.widget_shopping_cart .total { @include flex; @include flex-align-items(center); @include flex-justify-content(space-between); margin: 1em 0; } &.sc_layouts_cart_dropdown_remove_decode .sc_layouts_cart_widget:after { display: none; } &.sc_layouts_cart_panel .sc_layouts_panel_inner { @include flex; width: 100%; padding: 0; .sc_layouts_cart_panel_header { position: static; width: auto; min-width: 100%; } .sc_layouts_cart_panel_widget { @include flex; @include flex-direction(column); width: 100%; padding-top: 0; .widget_shopping_cart { @include flex; @include flex-basis(100%); width: 100%; box-sizing: border-box; padding: var(--sc_layouts-cart-panel-padding); } .widget_shopping_cart_content { @include flex; @include flex-direction(column); // width: calc(100% + 17px); width: 100%; max-height: none; overflow-y: hidden; margin: 0; .woocommerce-mini-cart.product_list_widget { @include flex-basis(100%); overflow: hidden auto; // margin-right: -17px; } .woocommerce-mini-cart__total, .woocommerce-mini-cart__buttons { position: static; @include flex-shrink(0); width: 100%; } } } } //Badge Position &.trx_addons_sc_cart_product_count_badge { .sc_layouts_item_details_line2 { display: none; } &.sc_layouts_cart > .sc_layouts_cart_items_short { display: block; inset: auto; @include transform(none); @include transition-all; } &.trx_addons_sc_cart_badge_position_top_left > .sc_layouts_cart_items_short { @include abs-lt; } &.trx_addons_sc_cart_badge_position_top_right > .sc_layouts_cart_items_short { @include abs-rt; } &.trx_addons_sc_cart_badge_position_bottom_left > .sc_layouts_cart_items_short { @include abs-lb; } &.trx_addons_sc_cart_badge_position_bottom_right > .sc_layouts_cart_items_short { @include abs-rb; } } &.sc_layouts_cart .sc_layouts_item_details_line1 { @include transition-colors; } .woocommerce.widget_shopping_cart .cart_list li a.remove { @include flex-shrink(0); position: static; margin: 0 6px 0 0; text-align: center } .woocommerce.widget_shopping_cart ul.cart_list li { @include flex; @include flex-align-items(flex-start); padding: 0; } //Cart Item Close Icon Alignment Right &.sc_layouts_cart_item_close_icon-right li a.remove { order: 10; } //Cart Item Image Alignment &.sc_layouts_cart_item_image-right .trx_addons_sc_layouts_cart_mini_cart_item_link_image, &.sc_layouts_cart_item_image-right .trx_addons_sc_layouts_cart_mini_cart_item_image { order: 10; } //Icon Display &.sc_layouts_cart_buttons-block { .woocommerce-mini-cart__buttons { flex-wrap: wrap; } &.sc_layouts_cart_panel .sc_layouts_cart_panel_widget .widget_shopping_cart .woocommerce-mini-cart__buttons .button { width: 100%; } .woocommerce.widget_shopping_cart .buttons a { display: block; text-align: center; } .woocommerce.widget_shopping_cart .buttons .button { margin-left: 0; margin-right: 0; } .widget.woocommerce .button:last-child { margin-bottom: 0; } } .sc_layouts_panel_inner .widget.woocommerce .button + .button { margin-left: 0; margin-right: 0; } // Preview - On &.sc_layouts_cart_preview_init .sc_layouts_cart_widget { display: block; } &.sc_layouts_panel.sc_layouts_cart_preview_init { text-align: left; } &.sc_layouts_panel.sc_layouts_effect_slide.sc_layouts_cart_panel.sc_layouts_cart_preview_init { opacity: 1; @include transform(none); } &.sc_layouts_panel_hide_content.sc_layouts_cart_preview_init.inited { @include transform(none); @include transition(none); background-color: rgba(0, 0, 0, 0.5); } .woocommerce.widget_shopping_cart ul.cart_list .mini_cart_item, &.sc_layouts_panel ul.cart_list .mini_cart_item, &.sc_layouts_cart ul.cart_list .mini_cart_item { --var-trx_addons_sc_layouts_cart_item_close_color: #e05100; a.remove { color: var(--var-trx_addons_sc_layouts_cart_item_close_color) !important; background-color: transparent; // !important; } } &.trx_addons_sc_layouts_cart_general_parent.elementor-element[data-id], &.sc_layouts_cart.sc_layouts_cart_preview_init { z-index: 100010; } //mini cart item update settings &.trx_addons_sc_layouts_cart_mini_cart_item_inner { @include flex; @include flex-align-items(flex-start); @include flex-grow(1); & > .trx_addons_sc_layouts_cart_mini_cart_item_image_link, & > .trx_addons_sc_layouts_cart_mini_cart_item_image { @include flex-align-self(flex-start); a { display: inline-block; } } } .woocommerce.widget_shopping_cart { ul.product_list_widget li .trx_addons_sc_layouts_cart_mini_cart_item_inner img { float: none; vertical-align: top; } ul.cart_list li img, &.sc_layouts_cart_panel .sc_layouts_cart_panel_widget .widget_shopping_cart ul.cart_list li img { margin: 0; } ul.cart_list li .trx_addons_sc_layouts_cart_mini_cart_item_image, ul.cart_list li .trx_addons_sc_layouts_cart_mini_cart_item_link_image { @include flex-shrink(0); margin: 0 0.5em 0 0; } ul.product_list_widget li:nth-child(n + 2) { margin-top: 12px; } ul.product_list_widget li span .amount { font-size: inherit; color: inherit; font-weight: inherit; } .quantity { margin: 0; } } //Vertical Alignment &.sc_layouts_cart_item_va-center .trx_addons_sc_layouts_cart_mini_cart_item_inner { @include flex-align-items(center); } &.sc_layouts_cart_item_va-bottom .trx_addons_sc_layouts_cart_mini_cart_item_inner { @include flex-align-items(flex-end); } .trx_addons_sc_layouts_cart_mini_cart_item_name { display: inline-block; @include transition-colors; } .trx_addons_sc_layouts_cart_mini_cart_item_content { @include flex-grow(1); } } //admin panel fix // .elementor-control.elementor-control-trx_addons_cart_dropdown_empty_style_typography_typography, // .elementor-control.elementor-control-trx_addons_cart_type_panel_empty_style_typography_typography { // padding-bottom: 0; // }