File: /var/www/html/wpprm/wp-content/themes/ronneby/assets/less.lib/woocommerce/products-list.less
/*
Created on : 10.01.2015, 14:41:46
Author : DFD
Styles for : Products List
*/
/**
* Product List
*/
.products {
.carousel();
.product {
> p {
text-align: center;
margin: 0;
}
margin-bottom: 0;
.prod-wrap {
.rel();
overflow: hidden;
}
.woo-cover {
.rel();
overflow: hidden;
.block();
.transition(border-color .3s ease-in-out);
img {
.block();
min-width: 100%;
filter: none;
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-ms-filter: blur(0px);
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='0');
}
.woo-entry-thumb {
.rel();
.woo-entry-thumb-carousel {
.rel();
z-index: 1;
}
.preview-thumb {
.abs();
top: 0; bottom: 0;
left: 0; right: 0;
visibility: visible;
.opacity(1);
z-index: 2;
.transition(~"visibility .3s ease-in-out, opacity .3s ease-in-out");
img {
min-width: 100%;
}
}
}
a.link {
.abs();
top: 0; bottom: 0;
left: 0; right: 0;
z-index: 1;
}
.buttons-wrap {
@s: 42px;
.abs();
left: 0;
right: 0;
bottom: -45px;
.block();
height: @s;
line-height: @s;
//overflow: hidden;
z-index: 2;
.transition(bottom .3s ease-in-out);
> div {
.inline-block();
height: @s;
height: inherit;
white-space: nowrap;
}
&.dfd-buttons-light {
left: 10px;
right: 10px;
* {
color: @title-color;
}
a {
margin-right: 7px;
background: @main-site-dark-color;
.rounded(@s);
-webkit-transition: -webkit-border-radius .5s ease;
-moz-transition: -moz-border-radius .5s ease;
-ms-transition: -ms-border-radius .5s ease;
-o-transition: -o-border-radius .5s ease;
transition: border-radius .5s ease;
&:before {
.hide();
}
&:last-child {
margin-right: 0;
}
&.add_to_cart_button,
&.added_to_cart {
-webkit-transition: -webkit-border-radius .5s ease;
-moz-transition: -moz-border-radius .5s ease;
-ms-transition: -ms-border-radius .5s ease;
-o-transition: -o-border-radius .5s ease;
transition: border-radius .5s ease;
}
&.added_to_cart {
color: @title-color;
&:hover {
color: @title-color;
}
}
i {
color: @title-color;
}
&:hover {
.rounded(2px);
i {
color: @title-color;
}
}
}
}
> div * {
float: left;
.block();
height: @s;
line-height: @s;
text-align: center;
color: @main-site-dark-color;
}
a {
.rel();
overflow: hidden;
background: @third-site-dark-color;
&:before {
content: "";
.block();
width: @s;
height: @s;
.abs();
top: 50%;
left: 50%;
margin-top: -@s/2;
margin-left: -@s/2;
background: fade(@main-site-dark-color, 10%);
.rounded(50%);
z-index: 1;
.opacity(1);
.scale(0);
.transition(all .7s ease-in-out);
}
&:hover {
&:before {
.opacity(.5);
.rounded(0);
.scale(5);
}
}
&.add_to_wishlist {
.block();
> span {
.hide();
}
}
&.add_to_wishlist,
&.dfd-prod-lightbox {
}
&.add_to_cart_button {
.link-style();
font-size: @link-font-size - 1;
line-height: inherit;
padding-right: 20px;
> i {
font-size: 16px;
}
&.added {
.hide();
}
}
&.added_to_cart {
.block();
.link-style();
font-size: @link-font-size - 1;
height: @s;
line-height: @s;
padding: 0 20px;
color: @main-site-dark-color;
border-left: 1px solid fade(@main-site-dark-color, 10%);
&:hover {
color: @main-site-dark-color;
}
}
&:hover {
i {
color: @main-site-dark-color;
}
}
}
i {
width: @s;
color: fade(@main-site-dark-color, 50%);
.transition(color .3s ease);
}
}
}
.woo-title-wrap {
margin-top: 20px;
div.box-name {
.rel();
font-size: @box-name-font-size + 2;
padding-bottom: 5px;
.transition(color .3s ease-in-out);
a {
color: inherit;
}
&:hover {
color: @third-site-light-color;
}
}
.price-wrap {
.rel();
line-height: 1;
.from {
.subtitle();
color: @title-color;
}
.amount {
.box-name();
font-size: @box-name-font-size + 2;
color: @title-color;
}
}
div.subtitle {
float: none;
clear: both;
padding-bottom: 5px;
}
.rating-section {
//margin-top: 10px;
.star-rating {
.inline-block();
float: none;
clear: both;
}
}
}
.ajax-loading {
display: none;
}
.dfd-list-hide {
.hide();
}
&:hover {
.woo-cover {
.woo-entry-thumb {
.preview-thumb {
visibility: hidden;
.opacity(0);
}
}
.buttons-wrap {
bottom: 0;
&.dfd-buttons-light {
bottom: 10px;
}
}
}
}
&.style-1 {
}
&.style-2 {
.additional-price {
@s: 42px;
.abs();
left: 0;
right: 0;
bottom: 0;
.block();
height: @s;
line-height: @s;
z-index: 2;
> div {
.box-name();
.inline-block();
height: @s;
line-height: inherit;
padding: 0 20px;
background: @third-site-dark-color;
color: @main-site-dark-color;
}
.transition(bottom .3s ease);
* {
line-height: inherit;
}
.from {
.subtitle();
color: fade(@main-site-dark-color, 50%);
}
.amount {
color: inherit;
}
&.dfd-buttons-light {
left: 10px;
right: 10px;
bottom: 10px;
> div {
background: @main-site-dark-color;
color: @box-name-color;
.rounded(@s);
}
.from {
color: fade(@box-name-color, 50%);
}
}
}
&:hover {
.additional-price,
.additional-price.dfd-buttons-light {
bottom: -42px;
}
}
}
&.style-2,
&.style-3 {
.woo-cover {
a.link {
background: fade(@woo-mask-bg, @woo-mask-opacity);
.opacity(0);
.transition(opacity .3s ease);
}
}
.woo-title-wrap {
.abs();
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 25px 20px 45px;
z-index: 1;
.opacity(0);
.transition(opacity .3s ease);
.heading {
.transform(translateY(-150%));
.transition-transform(.3s ease);
}
div.box-name {
color: @main-site-dark-color;
}
.price-wrap {
.from {
color: fade(@main-site-dark-color, 50%);
}
.amount {
color: @third-site-light-color;
}
}
div.subtitle {
color: fade(@main-site-dark-color, 50%);
}
.description {
margin-top: 55px;
color: @main-site-dark-color;
* {
color: inherit;
}
}
}
&:hover {
.opacity(1);
.woo-cover {
a.link {
.opacity(1);
}
}
.woo-title-wrap {
.opacity(1);
.heading {
.transform(translateY(0));
}
}
.onsale {
z-index: 0;
}
}
}
}
}
.dfd-ie-detected {
.products .product .woo-cover .buttons-wrap a:hover .cover {
.transform(rotateX(0));
}
}
#layout.dfd-woo-category-loop {
margin-top: 30px;
margin-bottom: 30px;
}
.row.module.dfd-woo-archive.full_width {
width: 100%;
margin: 0;
padding: 0 30px;
}