assets/css/woocommerce/woocommerce.scss
@import "../scss/global/variables";
@import "../scss/global/mixins";
@import "../scss/global/placeholders";
// Placeholders and Mixins
%bootstrap-form-control {
display: block;
width: 100%;
height: 50px;
color: #4a4a4a;
background-color: #fff;
background-image: none;
border: 1px solid #ddd;
border-radius: 2px;
// box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
// transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
// lsx-form-control
border-width: 2px;
box-shadow: none;
font-size: 18px;
line-height: 1.33;
padding: 10px 20px;
transition: all 150ms ease;
&:focus {
border-color: nth($blue, 1);
// outline: 0;
// box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(65, 138, 208, 0.6);
}
}
%bootstrap-message {
border-radius: 4px;
border: 1px solid transparent;
margin-bottom: 20px;
padding: 15px !important;
&:before {
display: none;
}
}
%bootstrap-message-success {
background-color: #dff0d8;
border-color: #d6e9c6;
color: #3c763d;
}
%bootstrap-message-error {
background-color: #f2dede;
border-color: #ebccd1;
color: #a94442;
}
%bootstrap-message-info {
background-color: #d9edf7;
border-color: #bce8f1;
color: #31708f;
}
%small-form-field {
height: 42px;
padding: 10px 12px;
}
%small-form-select {
height: 42px;
padding: 0 12px;
}
@mixin small-button() {
&,
&:active,
&:visited {
height: 40px;
line-height: 20px;
padding: 10px 18px;
}
}
@import 'woocommerce-extensions/header';
@import 'woocommerce-extensions/single-product';
@import 'woocommerce-extensions/checkout';
// Structure
article.page {
.page-template-default:not(.has-sidebar).woocommerce-page &,
.page-template-default:not(.has-sidebar).lost-api-key & {
width: 100% !important;
}
}
.site-main {
.archive:not(.has-sidebar).woocommerce-page & {
width: 100%;
}
}
.form-row {
margin-bottom: 15px !important;
padding: 0 !important;
}
.woocommerce-LostPassword {
&:last-child {
margin-bottom: 0;
}
a {
color: nth($blue, 1);
}
}
.wrap.container .woocommerce {
.woocommerce-ResetPassword {
.woocommerce-form-row {
width: 100%;
}
}
.cart-collaterals {
max-width: 90rem;
margin: auto;
}
@include media(">=desktop") {
max-width: 75rem;
width: 75rem;
.gutenberg-compatible-template.using-gutenberg .entry-content & {
max-width: 75rem;
width: 75rem;
}
.cart-collaterals {
max-width: 75rem;
margin: auto;
}
}
}
.woocommerce,
.woocommerce-page {
.entry-content {
&:after {
clear: both;
content: "";
display: table;
}
.woocommerce-cart-notice {
.button {
min-width: 140px;
text-align: center;
}
@include media("<tablet") {
display: flex;
flex-direction: column;
.button {
width: 100%;
margin: 2rem auto 0;
}
}
}
}
&.page-has-banner.lsx .archive-header-wrapper {
display: inherit;
}
&,
&[class*="columns-"] {
ul.products {
li.product {
@include media("<phone") {
width: 100%;
}
.woocommerce-loop-category__title,
.woocommerce-loop-product__title,
h3 {
font-size: 22px;
}
.price {
font-size: 20px;
}
}
}
}
&.woocommerce-checkout {
.col2-set {
@include media(">=tablet") {
float: left;
margin-right: 4.347826087%;
width: 47.8260869565%;
}
}
h3 {
font-size: 30px;
span {
font-size: 22px;
}
}
.col2-set {
.col-1,
.col-2 {
@include media(">=phone") {
float: none;
margin-bottom: 4.25rem;
width: 100%;
}
}
}
}
&.woocommerce-account {
@include media("<desktop") {
#primary {
margin-top: $lsx-large-gap + $lsx-medium-gap;
}
}
@include media(">=custom") {
&.logged-in {
.entry-content {
> .woocommerce {
display: flex;
}
}
}
}
.col2-set {
@include media("<phone") {
.col-1,
.col-2 {
float: none;
margin-bottom: 4.25rem;
width: 100%;
}
}
@include media(">=phone") {
.col-1,
.col-2 {
float: left;
margin-right: 4.347826087%;
width: 47.8260869565%;
}
.col-2 {
margin-right: 0;
}
}
}
}
#order_review,
#order_review_heading,
.woochimp_checkout_checkbox,
#woochimp_checkout_groups {
@include media(">=tablet") {
float: right;
margin-right: 0;
width: 47.8260869565%;
}
}
#customer_login {
.col-1,
.col-2 {
width: 100%;
}
.woocommerce-form-register {
.woocommerce-form-register__submit {
background-color: nth($blue, 2);
box-shadow: 2px 2px 0 0 black;
&:hover {
background-color: black;
}
}
}
}
.woochimp_checkout_checkbox {
margin-bottom: 2.4rem;
padding: 0 0 0 20px !important;
input[type="checkbox"] {
margin-left: -20px;
position: absolute;
}
}
#woochimp_checkout_groups {
padding-left: 20px;
margin-bottom: 2.4rem;
}
table.woocommerce-MyAccount-downloads,
table.my_account_orders {
font-size: 1em;
td,
th {
padding: 9px 12px;
}
.button {
margin-right: 5px;
&:last-child {
margin-right: 0;
}
}
}
@include media("<=tablet") {
.cart-collaterals {
display: flex;
flex-direction: column-reverse;
}
}
.checkout-cta-bottom {
display: flex;
flex-direction: column;
background: white;
padding-top: 60px;
padding-bottom: 60px;
.img-payments {
filter: grayscale(100%);
margin-top: 4rem;
margin-bottom: 4rem;
}
}
}
.pp_content_container {
.quick-view {
.product {
@include media(">tablet") {
display: grid;
grid-template-columns: repeat(2, 1fr);
.woocommerce-product-gallery {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 3;
width: 90%;
}
.summary {
grid-column-start: 2;
width: 100%;
.cart {
.quantity,
.single_add_to_cart_button {
display: none;
}
}
}
}
@include media("<tablet") {
.woocommerce-product-gallery {
margin-bottom: 4.25rem !important;
}
}
}
}
}
.widget {
.woocommerce {
.products {
li.product {
a.button:not(.quick-view-button) {
@include lsx-button-scaffolding();
@include lsx-button-colour();
}
}
}
}
}
#add_payment_method,
.woocommerce-cart,
.woocommerce-checkout {
#payment {
background: transparent;
ul.payment_methods {
border-bottom: none;
margin-bottom: 2.4rem;
padding: 0;
li.wc_payment_method {
.wc-saved-payment-methods label:before,
> label:before {
@include fa-icon();
content: "\f10c";
margin-right: 0.5407911001em;
transition: color ease 0.2s;
}
input[type="radio"]:first-child:checked + label:before {
content: "\f192";
}
}
li:not(.woocommerce-notice) {
line-height: 1.6;
& > input[type="radio"] {
clip: rect(1px 1px 1px 1px);
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
}
& > label {
cursor: pointer;
display: block;
margin-bottom: 0;
padding: 1.41575em;
& > img {
border: 0;
float: right;
margin: 0 0 0 0.5em;
max-height: 1.618em;
padding: 0;
& + a {
line-height: 2;
}
}
}
}
}
div.payment_box {
margin: 0;
&:before {
display: none;
}
}
#place_order {
float: initial;
background-color: nth($orange, 1);
box-shadow: 2px 2px 0 0 nth($orange, 2);
&:hover {
background-color: nth($orange, 2);
}
}
}
#main .quantity .qty {
@include media(">=desktop") {
height: 55px;
}
}
}
.woocommerce-cart,
.woocommerce-checkout {
.checkout-header-wrapper {
margin-top: $lsx-gap;
text-align: center;
}
#main {
.lsx-wc-checkout-steps {
margin-top: 0;
+ .wp-block-cover {
order: 1;
}
}
a.remove {
background-color: #9b9b9b;
color: white !important;
font-weight: 200;
&:hover {
background-color: #d0021b;
}
}
}
}
.gutenberg-compatible-template.woocommerce-cart,
.gutenberg-compatible-template.woocommerce-checkout {
.entry-content {
display: flex;
flex-direction: column;
.wp-block-cover,
.lsx-block-banner {
order: -1;
}
}
.checkout-header-wrapper.cart-checkout-page {
max-width: 100%;
width: 100%;
margin-left: auto;
margin-right: auto;
+ .wp-block-cover {
@include media("<phone") {
margin-left: 0;
margin-right: 0;
width: 100%;
max-width: 100%;
.wp-block-cover__inner-container {
width: calc(100% - 20px);
}
}
}
}
#main {
.lsx-wc-checkout-steps {
max-width: 100%;
width: 100%;
.lsx-wc-checkout-steps-items {
max-width: 100%;
width: 100%;
}
}
}
}
body.woocommerce {
div.product {
.woocommerce-tabs {
overflow: hidden;
margin: 30px 0;
.panel {
width: 70%;
float: right;
padding: 15px;
background: #ffffff;
& > *:last-child {
margin-bottom: 0;
clear: both;
}
}
.nav-tabs > li {
float: none;
margin-bottom: 0;
&:hover {
background-color: #f5f5f5;
border: none;
}
}
.nav-tabs > li > a {
border-radius: 0;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
border-left: 0;
color: #000;
background-color: transparent;
.nav-tabs > li > a.active {
border-right: 3px solid #000;
}
&:hover {
background-color: #f5f5f5;
}
}
.nav-tabs {
width: 28%;
float: left;
border-bottom: none;
& li:first-child > a,
& li.active:first-child > a {
border-top: 1px solid #ddd;
}
& > li.active > a {
background-color: transparent;
color: nth($blue, 1);
font-weight: bold;
border-top: 0px;
border-right: 3px solid nth($blue, 1);
}
}
@media (max-width: 768px) {
.panel {
width: 100%;
float: none;
}
.nav-tabs {
width: 100%;
float: none;
margin-bottom: 20px;
}
}
#comments {
margin-top: 0;
}
}
.related {
clear: both;
}
form.cart {
.variations {
td.label {
display: inline-block;
font-weight: 400;
font-size: 100%;
padding: 11px 0;
label {
font-weight: 400;
}
}
}
}
}
.woocommerce-button.button.woocommerce-form-login__submit {
@include lsx-button-scaffolding();
@include lsx-button-colour();
}
form.checkout_coupon,
form.login,
form.register {
border: none;
padding: 0;
margin: 2.4rem 0 4.25rem 0;
border-radius: 0;
}
/*#billing_country_field, #shipping_country_field, #billing_state_field, #shipping_state_field {
.select2.select2-container {
display:none;
}
}*/
.woocommerce-form-login {
p.form-row:not(.woocommerce-form-row) {
display: flex;
align-items: center;
flex-direction: row-reverse;
justify-content: flex-end;
.woocommerce-form-login__rememberme {
margin-bottom: 0;
}
}
}
.woocommerce-LostPassword.lost_password {
a {
color: nth($blue, 1);
&:hover {
color: nth($blue, 2);
}
}
}
.wc-memberships-restriction-message {
margin: 0 0 1em !important;
}
}
body:not(.logged-in).woocommerce-account.my-account .woocommerce {
> * {
max-width: 75rem;
margin-left: auto;
margin-right: auto;
}
.u-columns.col2-set {
@include media(">desktop") {
display: flex;
.col-1,
.col-2 {
width: 50%;
}
}
}
}
.product_meta {
.product & {
& > span {
display: block;
padding: 5px 0;
&.api-documentation {
margin-bottom: 15px;
}
}
}
}
#respond {
.product & {
text-align: left;
& > .comment-form {
& > p {
label,
span {
display: inline-block;
}
}
input[type="submit"] {
width: auto;
}
}
}
}
.woocommerce-variation-price {
margin-bottom: 1.618em;
}
.lsx-wc-sorting {
margin-bottom: 2.617924em;
overflow: hidden;
.woocommerce-ordering {
float: none;
@include media(">=phone") {
float: left;
margin-bottom: 0;
margin-right: 1em;
}
}
.woocommerce-result-count {
float: none;
@include media(">=phone") {
float: left;
line-height: 50px;
margin-bottom: 0;
position: relative;
}
}
.lsx-pagination-wrapper {
margin-top: 0;
text-align: left;
@include media(">=phone") {
margin-top: 0;
float: right;
}
}
}
// Buttons and fields
.woocommerce-product-search {
.search-field {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
border-radius: 2px 0 0 2px;
position: relative;
z-index: 1;
}
input[type="submit"] {
@include lsx-button-scaffolding();
@include lsx-button-colour();
box-shadow: none;
margin-left: -2px;
position: relative;
z-index: 2;
}
}
#wc_am_lost_api_key_form {
input[type="text"] {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
@extend %small-form-field;
}
input[type="submit"] {
@include lsx-button-scaffolding();
@include lsx-button-colour();
@include small-button();
}
}
#add_payment_method,
.woocommerce-cart,
.woocommerce-checkout {
table.cart {
td.actions {
.coupon {
.input-text {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
@extend %small-form-field;
width: 160px;
@include media("<phone") {
width: 100%;
}
}
}
}
}
}
.woocommerce-account {
.cart_totals {
table.shop_table {
tbody {
tr:first-child {
th {
border-radius: 5px 0 0 0;
}
td {
border-radius: 0 5px 0 0;
}
}
tr:last-child {
th {
border-radius: 0 0 0 5px;
}
td {
border-radius: 0 0 5px 0;
}
}
}
}
}
.woocommerce-checkout-review-order,
.woocommerce-order-details,
.woocommerce-order-downloads,
.woocommerce-MyAccount-content {
table.shop_table {
thead {
tr:first-child {
& > *:first-child {
border-radius: 5px 0 0 0;
}
& > *:last-child {
border-radius: 0 5px 0 0;
}
}
}
tbody:last-child,
tfoot {
tr:last-child {
& > *:first-child {
border-radius: 0 0 0 5px;
}
& > *:last-child {
border-radius: 0 0 5px 0;
}
}
}
}
}
}
#add_payment_method,
.woocommerce-cart,
.woocommerce-checkout {
.cart_totals {
table.shop_table {
border: 1px solid #e6e6e6;
border-bottom: 8px solid #e6e6e6;
tbody {
th {
background-color: white !important;
}
tr:first-child {
th {
border-radius: 5px 0 0 0;
background-color: #e6e6e6 !important;
}
td {
border-radius: 0 5px 0 0;
background-color: #e6e6e6;
}
}
tr:last-child {
th {
border-radius: 0 0 0 5px;
}
td {
border-radius: 0 0 5px 0;
}
}
}
}
}
.woocommerce-checkout-review-order,
.woocommerce-order-details,
.woocommerce-order-downloads,
.woocommerce-MyAccount-content {
table.shop_table {
thead {
tr:first-child {
& > *:first-child {
border-radius: 5px 0 0 0;
}
& > *:last-child {
border-radius: 0 5px 0 0;
}
}
}
tbody:last-child,
tfoot {
th {
background-color: white !important;
}
tr:last-child {
td,
th {
border-top: none;
}
& > *:first-child {
border-radius: 0 0 0 5px;
background-color: #e6e6e6 !important;
}
& > *:last-child {
border-radius: 0 0 5px 0;
background-color: #e6e6e6;
}
}
}
}
}
}
.woocommerce {
table.shop_table {
td {
&:not(:first-child) {
@include media("<phone") {
border-top: 0;
}
}
}
}
}
.woocommerce {
.woocommerce-customer-details {
address {
border-bottom-width: 1px;
border-right-width: 1px;
padding: 9px 12px;
}
}
}
.woocommerce {
select {
@extend %small-form-select;
}
form {
.form-row {
input.input-text,
textarea {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
}
input.input-text {
@extend %small-form-field;
}
textarea {
height: 80px;
}
select {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
@extend %small-form-select;
}
input[type="file"] {
font-size: 12px;
font-weight: normal;
height: auto;
line-height: normal;
}
input[type="radio"],
input[type="checkbox"] {
margin-right: 10px;
}
}
&.comment-form {
input[type="text"],
input[type="email"],
textarea {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
}
input[type="text"],
input[type="email"] {
@extend %small-form-field;
}
textarea {
height: 80px;
}
}
}
div.product {
form.cart {
.variations {
select {
@extend %bootstrap-form-control;
@extend %lsx-form-field;
@extend %small-form-select;
}
}
}
}
}
.lsx-wc-cart-menu-item {
.widget_shopping_cart {
.buttons {
.button {
@include lsx-button-scaffolding();
&,
&:active,
&:visited {
font-size: 12px;
height: auto;
padding: 10px 20px;
}
@include lsx-button-colour();
border-radius: 0 !important;
box-shadow: none !important;
display: block !important;
&:active {
left: 0 !important;
top: 0 !important;
}
}
}
}
}
.woocommerce-MyAccount-downloads-file {
&:after {
@include fa-icon();
content: "\f019";
margin-left: 10px;
}
}
// LSX Sharing
.lsx-sharing-content {
.product & {
margin-top: 2em;
}
}
// WooCommerce wraper
.woocommerce-page #main {
// Lists
.products {
padding-left: 0;
}
// Labels
form {
.form-row {
label.inline {
&:not(:first-child) {
margin-left: 15px;
}
}
}
}
#woochimp_checkout_groups {
.label {
// color: $text-color;
// display: inline-block;
// margin-bottom: 15px;
display: none;
}
br {
display: none;
}
label.checkbox {
margin-top: 0;
}
}
// Fields
.quantity .qty {
@extend %bootstrap-form-control;
@extend %small-form-field;
}
.woocommerce-ordering select {
@extend %bootstrap-form-control;
@extend %small-form-select;
height: 40px;
}
.woocommerce-Input,
.quantity .qty {
@extend %lsx-form-field;
@extend %small-form-field;
}
.woocommerce-ordering select {
@extend %lsx-form-field;
@extend %small-form-select;
}
.quantity .qty {
display: inline-block;
width: 65px;
}
// Button
#respond input#submit,
a.button:not(.quick-view-button),
button.button,
input.button {
@include lsx-button-scaffolding();
@include lsx-button-colour();
@include small-button();
}
.coupon input.button {
@include media("<phone") {
float: left;
margin-top: 7px;
width: 100%;
}
}
// Edit address link
.woocommerce-Address-title {
a {
display: block;
width: 1em;
height: 1em;
text-indent: -9999px;
position: relative;
padding: 10px;
&:before {
@include fa-icon();
content: "\f044";
line-height: 1.618;
position: absolute;
top: 2px;
left: 0;
height: 100%;
width: 100%;
text-align: center;
text-indent: 0;
}
}
}
}
// Messages
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
.woocommerce_message,
.woocommerce_info,
.woocommerce_error,
.woocommerce_noreviews,
p.no-comments,
.stock,
.woocommerce-password-strength {
@extend %bootstrap-message;
&.lsx-woocommerce-message-wrap {
.button {
float: none;
margin-top: 15px;
}
@include media(">=phone") {
display: flex;
align-items: center;
.lsx-woocommerce-message-text {
flex: 1 1 auto;
}
.button {
margin-left: 15px;
margin-top: 0;
}
}
}
}
.woocommerce-message,
.woocommerce_message,
.stock.in-stock,
.woocommerce-password-strength.strong {
@extend %bootstrap-message-success;
}
.woocommerce-message-added-to-cart {
@include media(">=tablet") {
font-size: 17px;
line-height: 50px;
}
}
.woocommerce-error,
.woocommerce_error,
.stock.out-of-stock,
.woocommerce-password-strength.short,
.woocommerce-password-strength.bad {
@extend %bootstrap-message-error;
}
.woocommerce-info,
.woocommerce_info,
.woocommerce-password-strength.info {
@extend %bootstrap-message-info;
}
// My account
.woocommerce-page #main {
// My account - Content
.woocommerce-MyAccount-content {
legend {
border-bottom: none;
}
.woocommerce-form-row {
margin-bottom: 1.41575em;
}
@include media(">=custom") {
width: 77.4705882353%;
.form-row-first {
float: left;
margin-right: 7.6923076923%;
width: 38.4615384615%;
}
.form-row-last {
float: right;
width: 53.8461538462%;
}
}
}
// My account - Menu
.woocommerce-MyAccount-navigation {
padding: 0 15px;
@include media(">=custom") {
margin-right: 25px;
width: 25%;
}
@include media(">=desktop") {
width: 17.6470588235%;
}
ul {
margin-left: 0;
padding: 0;
li {
list-style: none;
position: relative;
a {
display: block;
padding: 0.875em 0;
}
&.is-active {
a {
margin: 0 -15px;
padding-left: 15px;
padding-right: 15px;
&:before {
opacity: 1;
}
}
}
a {
&:before {
@include fa-icon();
content: "\f0f6";
line-height: 1.618;
margin-left: 0.5407911001em;
width: 1.41575em;
text-align: right;
float: right;
opacity: 0.25;
}
&:hover {
&:before {
opacity: 1;
}
}
}
&.woocommerce-MyAccount-navigation-link--dashboard a:before {
content: "\f0e4";
}
&.woocommerce-MyAccount-navigation-link--orders a:before {
content: "\f291";
}
&.woocommerce-MyAccount-navigation-link--downloads a:before {
content: "\f1c6";
}
&.woocommerce-MyAccount-navigation-link--edit-address a:before {
content: "\f015";
}
&.woocommerce-MyAccount-navigation-link--payment-methods
a:before {
content: "\f09d";
}
&.woocommerce-MyAccount-navigation-link--edit-account a:before {
content: "\f007";
}
&.woocommerce-MyAccount-navigation-link--customer-logout
a:before {
content: "\f08b";
}
&.woocommerce-MyAccount-navigation-link--subscriptions
a:before {
content: "\f021";
}
}
}
}
}
// Main menu
.lsx-wc-cart-menu-item {
& > a {
&:after {
@include fa-icon();
content: "\f291";
float: right;
font-size: 20px;
margin-left: 2rem;
#top-menu & {
margin-left: 1.2rem;
}
}
}
&.lsx-wc-cart-menu-item-simple {
& > a {
&:before {
@include fa-icon();
content: "\f07a";
float: right;
font-size: 20px;
margin-right: 0.5rem;
#top-menu & {
float: none;
margin-right: 0;
}
}
&:after {
display: none;
}
}
}
.lsx-wc-cart-amount {
margin-right: 2rem;
#top-menu & {
margin-right: 0.5rem;
}
}
&.lsx-wc-cart-menu-item-simple {
.lsx-wc-cart-amount {
@include media(">=desktop-wide") {
display: none;
}
}
}
.lsx-wc-cart-count,
.lsx-wc-cart-count-badge {
font-size: 0.875em;
font-weight: 300;
opacity: 0.75;
}
.lsx-wc-cart-count-badge {
@include media("<desktop-wide") {
display: none;
}
}
&.lsx-wc-cart-menu-item-simple {
.lsx-wc-cart-count {
@include media(">=desktop-wide") {
display: none;
}
}
}
&:not(.lsx-wc-cart-menu-item-simple) {
.lsx-wc-cart-count-badge {
display: none;
}
}
&.lsx-wc-cart-menu-item-right-aligned {
@include media(">=desktop") {
margin-left: auto;
}
}
.widget_shopping_cart {
font-size: 0.875em;
.woocommerce-mini-cart__empty-message {
margin: 1.41575em;
}
.product_list_widget {
li {
padding: 1em 1.41575em;
&:nth-of-type(1n + 4) {
display: none;
}
a {
font-size: 1em !important;
font-weight: normal !important;
padding: 0 !important;
}
.remove {
display: none;
}
}
}
.total {
border-top: none;
margin-bottom: 0;
padding: 1em 1.41575em;
text-align: center;
}
.buttons {
margin-bottom: 0;
padding: 0 1.41575em 1.41575em;
text-align: center;
.button {
margin-bottom: 1em;
&:last-child {
margin-bottom: 0;
}
}
}
}
}
ul.lsx-wc-cart-sub-menu {
@include media(">=desktop") {
left: auto;
right: 0;
width: 235px;
}
.lsx-wc-cart-menu-item-simple & {
display: none !important;
}
}
// Homepage widgets
.lsx-woocommerce-slot,
.lsx-woocommerce-review-slot {
margin: 4rem auto 0;
overflow: hidden;
.lsx-woocommerce-avatar {
& > img {
width: 100%;
}
}
.lsx-woocommerce-rating {
.star-rating {
display: inline-block;
float: none;
}
}
.lsx-woocommerce-content {
margin-top: 2rem;
p {
margin-bottom: 0;
& + p {
margin-top: 1rem !important;
}
}
.moretag {
&:after {
color: inherit;
content: "\f178";
display: inline-block;
font-family: "FontAwesome";
font-size: inherit;
margin-left: 5px;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
}
}
}
.lsx-woocommerce-slot {
text-align: center;
.lsx-woocommerce-title {
margin: 2.4rem 0 1rem;
padding: 0 2rem;
}
.lsx-woocommerce-rating {
padding: 0 2rem;
}
.lsx-woocommerce-price {
font-weight: bold;
padding: 0 2rem;
}
.lsx-woocommerce-content {
padding: 0 2rem;
p {
& + p {
margin-top: 2.4rem !important;
}
}
.moretag {
display: block;
margin: 0 -2rem;
padding: 1rem 0;
text-align: center;
transition: background 300ms ease;
}
}
}
.lsx-woocommerce-review-slot {
.lsx-woocommerce-review-flex {
@include media(">=phone") {
display: flex;
}
#secondary & > a {
display: none;
}
}
.lsx-woocommerce-review-box {
padding: 2rem;
@include media(">=phone") {
flex: 1 1 auto;
}
}
.lsx-woocommerce-avatar {
@include media(">=phone") {
margin-right: 30px;
width: 140px;
}
}
.lsx-woocommerce-title {
margin: 1rem 0 0;
}
.lsx-woocommerce-content {
padding-top: 2rem;
}
}
.lsx-woocommerce-slider {
margin-top: -4rem;
@include media(">=tablet") {
margin-left: auto;
margin-right: auto;
width: 100%;
&.slick-has-arrows {
width: calc(100% - 8rem);
}
}
@include media(">=1280px") {
margin-left: -15px;
margin-right: -15px;
width: calc(100% + 30px);
&.slick-has-arrows {
width: calc(100% + 30px);
}
}
.wc-tab &,
#secondary & {
margin-left: -15px;
margin-right: -15px;
@include media(">=phone") {
margin-left: auto;
margin-right: auto;
width: 100%;
&.slick-has-arrows {
width: calc(100% - 8rem);
}
}
}
.lsx-woocommerce-slot.slick-slide,
.lsx-woocommerce-review-slot.slick-slide {
margin-left: 15px;
margin-right: 15px;
}
.slick-dots {
align-items: center;
display: flex;
flex-flow: row wrap;
height: auto;
justify-content: center;
list-style: none;
margin: 2rem 0 0;
padding: 0;
.wc-tab & {
margin-bottom: 0;
padding-left: 0 !important;
}
& > li {
line-height: 1;
padding: 5px;
@include media(">=tablet") {
padding: 0 7.5px;
}
& > button {
background: transparent;
border-style: solid;
border-width: 1px;
font: 0/0 a;
height: 12px;
transition: all 300ms ease-in-out;
width: 4rem;
@include media(">=tablet") {
height: 6px;
}
}
}
}
.slick-arrow {
background: transparent;
border-radius: 50%;
border-style: solid;
border-width: 2px;
font: 0/0 a;
height: 4rem;
margin-top: calc((2rem - 17px) / 2);
opacity: 1;
padding: 0;
position: absolute;
text-shadow: none;
top: 50%;
transform: translateY(-50%);
transition: border 300ms ease;
width: 4rem;
z-index: 3;
&:before {
display: block;
font-family: "FontAwesome";
font-size: 3rem;
line-height: 1;
position: absolute;
text-rendering: auto;
top: 47%;
transform: translateY(-50%);
transition: color 300ms ease;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
&.slick-disabled {
cursor: not-allowed;
}
&.slick-prev {
left: -4rem;
&:before {
content: "\f104";
left: 1.1rem;
}
}
&.slick-next {
right: -4rem;
&:before {
content: "\f105";
left: 1.5rem;
}
}
}
}
// Footer bar
.lsx-wc-has-footer-bar {
@include media("<custom") {
margin-bottom: 72px;
}
}
.lsx-wc-footer-bar {
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
bottom: 0;
left: 0;
position: fixed;
right: 0;
z-index: 10;
@include media(">=custom") {
display: none;
}
}
.lsx-wc-footer-bar-items {
display: flex;
list-style: none;
margin-bottom: 0;
padding-left: 0;
}
.lsx-wc-footer-bar-item {
border-right-width: 2px;
border-right-style: solid;
width: 25%;
&:last-child {
border-right: 0;
}
}
.lsx-wc-footer-bar-link {
display: flex;
flex-direction: column;
padding: 10px;
position: relative;
text-align: center;
.fa {
font-size: 24px;
margin-bottom: 4px;
}
}
.lsx-wc-footer-bar-form {
display: none;
padding: 10px;
}
.lsx-wc-footer-bar-count {
border-style: solid;
border-width: 1px;
border-radius: 50%;
box-sizing: content-box;
display: block;
font-size: 11px;
height: 20px;
left: 50%;
line-height: 20px;
position: absolute;
text-align: center;
top: 5px;
width: 20px;
&:empty {
display: none;
}
}
// Image slider
.woocommerce-product-gallery__wrapper {
max-width: none;
}
.woocommerce {
div.product {
div.images {
.flex-control-thumbs {
margin: 0 -5px;
li {
padding: 10px 5px 0;
}
}
.woocommerce-product-gallery__wrapper {
overflow: hidden;
}
}
}
}
// Onsale badge
.woocommerce {
span.onsale {
font-size: 1em;
height: 3.706325903em;
left: -13px;
line-height: 3.206325903em;
text-transform: uppercase;
top: -13px;
width: 3.706325903em;
}
}
.page-template-template-wc-thank-you {
.wc-bacs-bank-details-heading {
display: none;
}
}
#loginform,
.loginform,
.woocommerce form.login,
.woocommerce form.register,
.logged-out .woocommerce {
max-width: 550px;
margin-left: auto;
margin-right: auto;
border: none;
padding: 0;
.woocommerce-LostPassword {
a {
color: nth($blue, 1);
}
}
}
// WooCommerce Extensions
@import "woocommerce-extensions/advanced-product-labels";
@import "woocommerce-extensions/bookings";
@import "woocommerce-extensions/bundle-products";
@import "woocommerce-extensions/quick-view";
@import "woocommerce-extensions/product-vendors";
@import "woocommerce-extensions/product-addons";
@import "woocommerce-extensions/product-retailers";
@import "woocommerce-extensions/product-reviews-pro";
@import "woocommerce-extensions/points_rewards";
@import "woocommerce-extensions/ship-multiple-addresses";
@import "woocommerce-extensions/smart-coupons";
@import "woocommerce-extensions/social-login";
@import "woocommerce-extensions/subscriptions";
@import "woocommerce-extensions/variation-swatches";
@import "woocommerce-extensions/wishlists";
@import "woocommerce-extensions/woocommerce-blocks";