????JFIF??x?x????'
| Server IP : 79.136.114.73 / Your IP : 216.73.216.191 Web Server : Apache/2.4.7 (Ubuntu) PHP/5.5.9-1ubuntu4.29 OpenSSL/1.0.1f System : Linux b8009 3.13.0-170-generic #220-Ubuntu SMP Thu May 9 12:40:49 UTC 2019 x86_64 User : www-data ( 33) PHP Version : 5.5.9-1ubuntu4.29 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority, MySQL : ON | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /var/www/www.astacus.se/wp-content/themes/storefront/assets/sass/woocommerce/ |
Upload File : |
/**
* WooCommerce
*/
/**
* Imports
*/
@import 'bourbon';
@import '../../../assets/sass/utils/variables';
@import '../../../assets/sass/utils/mixins';
@import '../../../node_modules/susy/sass/susy';
@import '../../../assets/sass/vendors/modular-scale';
// Star font, FontAwesome doesn't work :(
@font-face {
font-family: 'star';
src: url('../../../../../plugins/woocommerce/assets/fonts/star.eot');
src: url('../../../../../plugins/woocommerce/assets/fonts/star.eot?#iefix') format('embedded-opentype'),
url('../../../../../plugins/woocommerce/assets/fonts/star.woff') format('woff'),
url('../../../../../plugins/woocommerce/assets/fonts/star.ttf') format('truetype'),
url('../../../../../plugins/woocommerce/assets/fonts/star.svg#star') format('svg');
font-weight: normal;
font-style: normal;
}
.price {
ins {
font-weight: 400;
}
}
/**
* Header Elements
*/
.woocommerce-active {
.site-header {
.col-full {
position: relative;
}
}
.site-branding {
float: left;
}
}
.site-header-cart {
list-style-type: none;
margin-left: 0;
padding: 0;
margin-bottom: 0;
.cart-contents {
display: none;
}
.widget_shopping_cart {
display: none;
.product_list_widget {
img {
margin-left: 1em;
}
}
}
}
.site-search {
font-size: ms(-1);
clear: both;
display: none;
.widget_product_search {
input[type=text],
input[type=search] {
padding: ms(1) ms(2);
line-height: 1;
}
form {
&:before {
top: 1.15em;
left: 1.15em;
}
}
#searchsubmit {
@include screen-reader-text();
}
}
}
/**
* Handheld footer bar
*/
.storefront-handheld-footer-bar {
@include clearfix;
position: fixed;
bottom: 0;
left: 0;
right: 0;
border-top: 1px solid rgba(#fff,.2);
box-shadow: 0 0 6px rgba(#000,.7);
z-index: 9999;
ul {
margin: 0;
li {
display: inline-block;
float: left;
text-align: center;
&:last-child {
> a {
border-right: 0;
}
}
> a {
height: ms(7);
display: block;
position: relative;
text-indent: -9999px;
z-index: 999;
border-right: 1px solid rgba(#fff,.2);
&:active,
&:focus {
outline: none;
}
}
&.search {
.site-search {
position: absolute;
bottom: -2em;
left: 0;
right: 0;
transition: all,ease,.2s;
padding: 1em;
z-index: 1;
display: block;
}
&.active {
.site-search {
bottom: 100%;
}
}
.site-search,
.widget,
form {
margin-bottom: 0;
}
}
&.cart {
.count {
text-indent: 0;
display: block;
width: 2em;
height: 2em;
line-height: 2;
box-sizing: content-box;
font-size: .75em;
position: absolute;
top: ms(-1);
left: 50%;
border-radius: 100%;
border: 1px solid;
}
}
}
&.columns-1 {
li {
width: 100%;
display: block;
float: none;
}
}
&.columns-2 {
li {
width: 50%;
}
}
&.columns-3 {
li {
width: 33.33333%;
}
}
&.columns-4 {
li {
width: 25%;
}
}
&.columns-5 {
li {
width: 20%;
}
}
}
}
/**
* Shop tables
*/
table.shop_table_responsive {
thead {
display: none;
}
tbody {
th {
display: none;
}
}
tr {
td {
display: block;
text-align: right;
clear: both;
&:before {
content: attr(data-title) ': ';
font-weight: 600;
float: left;
}
&.product-remove {
a {
text-align: left;
}
&:before {
display: none;
}
}
&.actions,
&.download-actions {
&:before {
display: none;
}
}
&.download-actions {
.button {
display: block;
text-align: center;
}
}
}
}
&.my_account_orders {
.order-actions {
text-align: right;
&:before {
display: none;
}
}
}
}
/**
* Products
*/
ul.products {
margin-left: 0;
margin-bottom: 0;
clear: both;
@include clearfix;
li.product {
list-style: none;
margin-left: 0;
margin-bottom: ms(7);
text-align: center;
position: relative;
.star-rating {
margin: 0 auto ms(-3);
}
.woocommerce-LoopProduct-link {
display: block;
}
.price {
display: block;
color: $color_body;
font-weight: 400;
margin-bottom: 1rem;
ins {
margin-left: ms(-2);
background-color: transparent;
}
}
h2, // @todo Remove when WooCommerce 2.8 is live
h3, // @todo Remove when WooCommerce 2.8 is live
.woocommerce-loop-product__title {
font-size: 1rem;
font-weight: 400;
margin-bottom: ms(-3);
}
.star-rating {
font-size: ms(-1);
}
img {
display: block;
margin: 0 auto ms(3);
}
&.product-category {
h2, // @todo Remove when WooCommerce 2.8 is live
h3, // @todo Remove when WooCommerce 2.8 is live
.woocommerce-loop-category__title {
font-size: 1.1em;
}
img {
margin-bottom: ms(3);
}
}
.button {
margin-bottom: .236em;
}
}
}
.price {
del {
opacity: .5;
font-weight: 400;
& + ins {
margin-left: .327em;
}
}
}
/**
* Single Product
*/
.single-product {
.pswp__button {
background-color: transparent;
}
div.product {
@include clearfix;
position: relative;
overflow: hidden;
.images,
.summary,
.woocommerce-product-gallery {
margin-bottom: ms(5);
margin-top: 0;
}
.woocommerce-product-gallery {
position: relative;
.zoomImg {
background-color: #fff;
}
.woocommerce-product-gallery__trigger {
position: absolute;
top: ms(-1);
right: ms(-1);
display: block;
height: 2em;
width: 2em;
border-radius: 3px;
z-index: 99;
text-align: center;
}
img {
margin: 0;
}
.flex-viewport {
margin-bottom: ms(3);
}
.flex-control-thumbs {
@include clearfix;
margin: 0;
padding: 0;
li {
list-style: none;
margin-bottom: ms(3);
cursor: pointer;
img {
opacity: .5;
transition: all, ease, .2s;
&.flex-active {
opacity: 1;
}
}
&:hover {
img {
opacity: 1;
}
}
}
}
&.woocommerce-product-gallery--columns-2 {
.flex-control-thumbs {
li {
@include span( 2 of 4 );
&:nth-child(2n) {
margin-right: 0;
}
&:nth-child(2n+1) {
clear: both;
}
}
}
}
&.woocommerce-product-gallery--columns-3 {
.flex-control-thumbs {
li {
@include span( 1.333333333 of 4 );
&:nth-child(3n) {
margin-right: 0;
}
&:nth-child(3n+1) {
clear: both;
}
}
}
}
&.woocommerce-product-gallery--columns-4 {
.flex-control-thumbs {
li {
@include span( 1 of 4 );
&:nth-child(4n) {
margin-right: 0;
}
&:nth-child(4n+1) {
clear: both;
}
}
}
}
&.woocommerce-product-gallery--columns-5 {
.flex-control-thumbs {
li {
@include span( .8 of 4 );
&:nth-child(5n) {
margin-right: 0;
}
&:nth-child(5n+1) {
clear: both;
}
}
}
}
}
.images {
.woocommerce-main-image {
margin-bottom: ms(3);
display: block;
}
.thumbnails {
a.zoom {
display: block;
width: 22.05%;
margin-right: 3.8%;
float: left;
margin-bottom: 1em;
&.last {
margin-right: 0;
}
&.first {
clear: both;
}
}
}
}
form.cart {
@include clearfix;
margin-bottom: ms(3);
padding: 1em 0;
.quantity {
float: left;
margin-right: ms(-1);
}
}
p.price {
font-size: ms(2);
margin: ms(2) 0;
}
table.variations {
margin: 0;
th,
td {
display: list-item;
padding: 0;
list-style: none;
background-color: transparent;
}
.value {
margin-bottom: 1em;
}
}
.single_variation {
.price {
margin-bottom: 1em;
display: block;
}
}
.variations_button {
@include clearfix;
padding-top: 1em;
}
.woocommerce-product-rating {
margin-bottom: ms(3);
@include clearfix;
margin-top: - ms(-1);
a {
@include underlinedLink();
}
.star-rating {
float: left;
margin-right: ms(-2);
}
}
.product_meta {
font-size: ms(-1);
padding-top: 1em;
border-top: 1px solid $color_border;
.sku_wrapper,
.posted_in,
.tagged_as {
display: block;
&:last-child {
border-bottom: 0;
}
}
a {
@include underlinedLink();
}
}
}
}
.stock {
&:empty:before {
display: none;
}
&.in-stock {
color: $success;
}
&.out-of-stock {
color: $error;
}
}
a.reset_variations {
display: inline-block;
margin-left: 1em;
}
/**
* Reviews
*/
#reviews {
outline: none;
#comments {
padding-top: 0;
}
.comment-reply-title {
display: none;
}
.commentlist {
list-style: none;
margin-left: 0;
li {
margin-bottom: ms(5);
list-style: none;
clear: both;
@include clearfix;
.comment_container {
border-radius: 3px;
@include clearfix;
.comment-text {
@include span(last 5 of 6);
.star-rating {
float: right;
font-size: ms(-1);
line-height: 1;
height: 1em;
}
}
}
&:last-child {
border-bottom: 0;
margin-bottom: 0;
}
time {
opacity: 0.5;
font-size: ms(-1);
}
.avatar {
@include span(1 of 6);
height: auto;
}
p.meta {
margin-bottom: 1em;
strong {
line-height: 1;
}
time {
display: block;
}
.verified {
font-style: normal;
font-size: ms(-1);
}
.woocommerce-review__dash {
display: none;
}
}
ul.children {
margin: 0;
@include span(last 5 of 6);
padding-top: ms(3);
.avatar {
@include span(1 of 5);
}
.comment-text {
@include span(last 4 of 5);
}
li {
margin-bottom: ms(3);
&:last-child {
margin-bottom: 0;
}
}
}
}
}
.comment-form-rating {
clear: both;
label {
display: block;
}
}
}
/**
* Breadcrumbs
*/
.woocommerce-breadcrumb {
margin-left: -1.387rem;
margin-right: -1.387rem;
margin-bottom: ms(3);
font-size: ms(-1);
padding: 1em 1.387rem;
.breadcrumb-separator {
display: inline-block;
padding: 0 ms(-3);
}
}
/**
* Widgets
*/
.product_list_widget {
list-style: none;
margin-left: 0;
li {
padding: 1em 0;
border-bottom: 1px solid $color_border;
@include clearfix;
img {
max-width: ms(5);
float: right;
}
> a {
display: block;
}
}
a {
&:hover {
color: $color_links;
}
}
}
.widget {
ul.products {
li.product {
a {
text-decoration: none;
}
}
}
}
.widget_products {
a {
display: block;
}
}
.widget_shopping_cart {
.product_list_widget {
margin-bottom: 0;
li {
padding-left: 2em;
position: relative;
a.remove {
position: absolute;
top: 1em;
left: 0;
opacity: 1;
}
}
}
p.total,
p.buttons {
padding: 1em 0;
margin: 0;
text-align: center;
}
p.total {
border-bottom: 1px solid $color_border;
}
.buttons {
.button {
display: block;
&:nth-child(odd) {
margin-bottom: ms(-2);
}
}
}
}
.site-header {
.widget_shopping_cart {
p.total,
p.buttons,
li {
padding-left: ms(2);
padding-right: ms(2);
}
}
}
.widget_layered_nav {
li {
margin-bottom: ms(-2);
}
}
.widget.woocommerce {
li {
.count {
font-size: 1em;
float: right;
}
}
}
.widget_price_filter {
.price_slider {
margin-bottom: 1em;
}
.price_slider_amount {
text-align: right;
line-height: 2.4em;
.button {
float: left;
}
}
.ui-slider {
position: relative;
text-align: left;
}
.ui-slider .ui-slider-handle {
position: absolute;
z-index: 2;
width: 1em;
height: 1em;
@include border-top-radius(1em);
@include border-bottom-radius(1em);
cursor: ew-resize;
outline: none;
background: $color_links;
box-sizing: border-box;
margin-top: -.25em;
opacity: 1;
&:last-child {
margin-left: -1em;
}
&:hover,
&.ui-state-active {
box-shadow: 0 0 0 .236em rgba(#000, 0.1);
}
}
.ui-slider .ui-slider-range {
position: absolute;
z-index: 1;
font-size: .7em;
display: block;
border: 0;
background: $color_links;
@include border-top-radius(1em);
@include border-bottom-radius(1em);
}
.price_slider_wrapper .ui-widget-content {
@include border-top-radius(1em);
@include border-bottom-radius(1em);
background: rgba(0,0,0,0.1);
}
.ui-slider-horizontal {
height: .5em;
}
.ui-slider-horizontal .ui-slider-range {
top: 0;
height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
left: -1px;
}
.ui-slider-horizontal .ui-slider-range-max {
right: -1px;
}
}
/**
* Cart
*/
table.cart {
margin-bottom: ms(6);
.product-quantity .plus,
.product-quantity .minus {
display: none;
}
.product-thumbnail {
img {
margin: 0 auto;
max-width: ms(6);
height: auto;
}
&:before {
display: none;
}
}
tr:first-child {
td.product-remove {
border-top-width: 0;
}
}
td.product-remove {
@include clearfix;
padding: 0;
border-top: ms(3) solid;
position: relative;
a.remove {
position: absolute;
font-size: ms(2);
top: - ms(-2);
right: - ms(-2);
}
}
td.product-quantity {
.qty {
padding: .326em;
width: ms(6);
}
}
td,
th {
padding: ms(-1) ms(-1) 0;
}
td.product-subtotal {
padding-bottom: ms(-1);
}
td.actions {
border-top: 1em solid;
background-color: transparent;
padding: 0;
label {
display: none;
}
.coupon {
padding-bottom: 1em;
margin-bottom: 1em;
border-bottom: 1px solid $color_border;
}
input {
display: block;
width: 100%;
margin: ms(-3) 0;
&[name="update_cart"] {
&:focus {
outline: none;
}
}
}
}
}
.wc-proceed-to-checkout {
@include clearfix;
margin-bottom: ms(3);
.button {
display: block;
text-align: center;
margin-bottom: 1em;
&.checkout-button {
font-size: ms(2);
}
}
}
.woocommerce-shipping-calculator {
margin: 0;
> p:first-child {
margin: 0;
}
.shipping-calculator-form {
padding-top: ms(2);
}
}
ul#shipping_method {
list-style: none;
margin-left: 0;
li {
margin-bottom: ms(-6);
&:last-child {
margin-bottom: 0;
}
}
input {
margin-right: ms(-5);
}
}
.woocommerce-checkout {
ul#shipping_method {
margin-bottom: 0;
}
}
/**
* Checkout
*
* 1 - Required to make the blockUI overlay cover the entire page rather than just the checkout form. We do this because
* otherwise our sticky order review can break out of the checkout form (and the blockUI element).
*/
.checkout_coupon {
margin-bottom: ms(5);
}
form.checkout {
@include clearfix;
position: static !important; /* 1 */
> .blockUI {
position: fixed !important; /* 1 */
}
}
#payment {
@include clearfix;
.create-account {
clear: both;
}
.payment_methods {
margin: 0 !important;
padding: 0 !important;
> .wc_payment_method {
> label {
display: block;
padding: ms(2);
cursor: pointer;
}
}
li {
list-style: none !important;
margin-left: 0;
position: relative;
img {
float: right;
border: 0;
padding: 0;
max-height: ms(3);
}
&:last-child:not(.woocommerce-notice) {
padding-bottom: 0;
border-bottom: 0;
}
p {
margin: 0;
}
.payment_box {
padding: ms(2);
fieldset {
border: 0;
margin: 0;
padding: 1em 0 0 0;
font-size: ms(-1);
label {
width: auto;
margin-left: 0;
}
.form-row {
margin-bottom: 1em;
input[type="checkbox"] {
margin-right: 5px;
}
}
#cvv {
width: 22% !important;
}
.help {
width: 75%;
float: right;
}
}
.woocommerce-SavedPaymentMethods {
padding-top: 1em;
margin: 0;
li {
margin-top: ms(-2);
input[type=radio] {
margin-right: .236em;
}
}
}
ul.wc-saved-payment-methods {
margin-left: 0;
}
.wc-credit-card-form-card-number,
.wc-credit-card-form-card-expiry,
.wc-credit-card-form-card-cvc {
font-size: ms(2);
}
.wc-credit-card-form-card-number {
background-repeat: no-repeat;
background-position: right ms(-2) center;
background-size: 31px 20px;
background-image: url(../../../assets/images/credit-cards/unknown.svg);
&.visa {
background-image: url(../../../assets/images/credit-cards/visa.svg);
}
&.mastercard {
background-image: url(../../../assets/images/credit-cards/mastercard.svg);
}
&.laser {
background-image: url(../../../assets/images/credit-cards/laser.svg);
}
&.dinersclub {
background-image: url(../../../assets/images/credit-cards/diners.svg);
}
&.maestro {
background-image: url(../../../assets/images/credit-cards/maestro.svg);
}
&.jcb {
background-image: url(../../../assets/images/credit-cards/jcb.svg);
}
&.amex {
background-image: url(../../../assets/images/credit-cards/amex.svg);
}
&.discover {
background-image: url(../../../assets/images/credit-cards/discover.svg);
}
}
}
}
}
.terms {
width: 100%;
clear: both;
float: none;
margin-bottom: 0;
margin-bottom: 1em;
label {
display: block;
cursor: pointer;
}
}
.woocommerce-terms-and-conditions {
padding: ms(1);
box-shadow: inset 0 1px 3px rgba(#000,.2);
margin-bottom: 16px;
background-color: rgba(#000,.05);
}
.place-order {
padding: ms(2);
margin-bottom: 0;
float: none;
width: 100%;
margin-top: ms(5);
.button {
font-size: ms(2);
width: 100%;
white-space: pre-wrap;
}
}
}
table.woocommerce-checkout-review-order-table {
.product-name {
max-width: 150px;
}
}
.woocommerce-checkout {
.payment-fixed {
position: fixed;
top: 0;
z-index: 9;
box-shadow: 0 6px 2em rgba(#000,.2);
}
}
.admin-bar {
.woocommerce-checkout {
.payment-fixed {
top: 32px;
}
#wc_checkout_add_ons label + br {
display: none;
}
}
}
/**
* Password strength meter
*/
.woocommerce-password-strength {
text-align: left;
font-weight: 600;
padding: ms(-3) 0;
text-align: right;
font-size: ms(-1);
&.strong {
color: $success;
}
&.short {
color: $error;
}
&.bad {
color: $error;
}
&.good {
color: $info;
}
}
/**
* My Account
*/
label.inline {
display: inline !important;
margin-left: ms(1);
}
.woocommerce-MyAccount-navigation {
ul {
margin-left: 0;
border-top: 1px solid $color_border;
li {
list-style: none;
border-bottom: 1px solid $color_border;
position: relative;
a {
padding: ms(-1) 0;
display: block;
}
}
}
}
ul.order_details {
@include clearfix;
list-style: none;
position: relative;
margin: ms(6) 0;
&:before,
&:after {
content: "";
display: block;
position: absolute;
top: -16px;
left: 0;
width: 100%;
height: 16px;
background-size: 0px 100%, 16px 16px, 16px 16px;
}
&:after {
top: auto;
bottom: -16px;
transform: rotate(180deg);
}
li {
padding: 1em ms(3);
font-size: .8em;
text-transform: uppercase;
&:first-child {
padding-top: ms(3);
}
&:last-child {
border: 0;
padding-bottom: ms(3);
}
strong {
display: block;
font-size: ms(2);
text-transform: none;
}
}
}
.my_account_orders,
.woocommerce-MyAccount-downloads {
.button {
padding: ms(-2) ms(-1);
font-size: ms(-1);
margin-right: .236em;
}
}
.woocommerce-MyAccount-content {
h2 {
font-size: 2em;
font-weight: 600;
}
#payment {
.payment_methods {
margin-bottom: ms(3) !important;
li {
.payment_box {
background-color: rgba(#000,.05);
}
}
}
}
}
/**
* General WooCommerce components
*/
.woocommerce-form__label-for-checkbox {
cursor: pointer;
display: block;
.woocommerce-form__input-checkbox {
margin-right: ms(-5);
}
}
.form-row {
label {
display: block;
}
input,
textarea,
select {
width: 100%;
}
input[type=checkbox],
input[type=radio] {
width: auto;
}
.button {
width: auto;
}
&.create-account {
label {
display: inline-block;
}
}
&.woocommerce-validated {
input.input-text {
box-shadow: inset 2px 0 0 $success;
}
}
&.woocommerce-invalid {
input.input-text {
box-shadow: inset 2px 0 0 $error;
}
}
}
.form-row-last {
margin-right: 0 !important;
}
.form-row-wide {
clear: both;
width: 100%;
}
.required {
border-bottom: 0 !important;
color: red;
}
.demo_store {
position: fixed;
left: 0;
bottom: 69px;
right: 0;
margin: 0;
padding: 1em ms(2);
background-color: $info;
color: #fff;
z-index: 999;
a {
color: #fff;
font-weight: 400;
text-decoration: underline;
display: block;
&:hover {
text-decoration: none;
}
}
}
.star-rating {
overflow: hidden;
position: relative;
height: 1.618em;
line-height: 1.618;
font-size: 1em;
width: 5.3em;
font-family: 'star';
font-weight: 400;
&:before {
content: "\53\53\53\53\53";
opacity: .25;
float: left;
top: 0;
left: 0;
position: absolute;
}
span {
overflow: hidden;
float: left;
top: 0;
left: 0;
position: absolute;
padding-top: 1.5em;
}
span:before {
content: "\53\53\53\53\53";
top: 0;
position: absolute;
left: 0;
color: $color_links;
}
}
p.stars {
display: inline-block;
margin: 0;
a {
position: relative;
height: 1em;
width: 1em;
text-indent: -999em;
display: inline-block;
text-decoration: none;
margin-right: 1px;
font-weight: 400;
&:before {
display: block;
position: absolute;
top: 0;
left: 0;
width: 1em;
height: 1em;
line-height: 1;
font-family: "star";
content: "\53";
color: $color_body;
text-indent: 0;
opacity: .25;
}
&:hover {
~ a:before {
content: "\53";
color: $color_body;
opacity: .25;
}
}
}
&:hover {
a {
&:before {
content: "\53";
color: $color_woocommerce;
opacity: 1;
}
}
}
&.selected {
a.active {
&:before {
content: "\53";
color: $color_woocommerce;
opacity: 1;
}
~ a:before {
content: "\53";
color: $color_body;
opacity: .25;
}
}
a:not(.active) {
&:before {
content: "\53";
color: $color_woocommerce;
opacity: 1;
}
}
}
}
.onsale {
border: 1px solid;
border-color: $color_body;
color: $color_body;
padding: .202em ms(-2);
font-size: ms(-1);
text-transform: uppercase;
font-weight: 600;
display: inline-block;
margin-bottom: 1em;
border-radius: 3px;
}
.quantity {
.qty {
width: ms(7);
text-align: center;
}
}
.storefront-sorting {
font-size: ms(-1);
margin-bottom: ms(5);
}
.woocommerce-tabs {
padding: 1em 0;
ul.tabs {
list-style: none;
margin-left: 0;
text-align: left;
border-top: 1px solid $color_border;
li {
display: block;
margin: 0;
border-bottom: 1px solid $color_border;
position: relative;
a {
padding: 1em 0;
display: block;
}
}
}
.panel {
h2:first-of-type {
font-size: ms(3);
margin-bottom: 1em;
}
}
}
.related,
.upsells {
> h2:first-child {
font-size: ms(3);
margin-bottom: 1em;
}
}
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
padding: 1em ms(3);
@include clearfix;
margin-bottom: ms(5);
background-color: $success;
margin-left: 0;
border-radius: 2px;
color: #fff;
clear: both;
border-left: ms(-2) solid rgba(0,0,0,0.15);
a {
color: #fff;
&:hover {
color: #fff;
opacity: 0.7;
}
&.button:hover {
opacity: 1;
}
}
.button {
float: right;
padding: 0;
background: none;
color: #fff;
box-shadow: none;
line-height: 1.618;
padding-left: 1em;
border-width: 0;
border-left-width: 1px;
border-left-style: solid;
border-left-color: rgba(255,255,255,0.25) !important;
border-radius: 0;
&:hover {
background: none;
color: #fff;
opacity: 0.7;
}
}
pre {
background-color: rgba(0,0,0,.1);
}
}
.site-content {
> .col-full {
> .woocommerce {
> .woocommerce-message,
> .woocommerce-info,
> .woocommerce-error {
&:first-child {
margin-top: ms(5);
}
}
}
}
}
.woocommerce-error {
list-style: none;
}
.woocommerce-info,
.woocommerce-noreviews,
p.no-comments {
background-color: $info;
}
.woocommerce-error {
background-color: $error;
}
dl.variation {
font-size: ms(-1);
dd {
margin: 0 0 1em;
}
}
.wc-item-meta {
font-size: ms(-1);
margin-left: 0;
list-style: none;
li {
@include clearfix;
strong,
p {
display: inline-block;
}
}
}
/**
* My Account
*/
.woocommerce-MyAccount-content {
.woocommerce-Pagination {
text-align: center;
}
}
/**
* Homepage
*/
.storefront-product-section {
margin-bottom: ms(3);
.section-title {
text-align: center;
margin-bottom: ms(1);
}
&:last-child {
margin-bottom: 0;
}
}
@include susy-media($desktop) {
.demo_store {
bottom: 0;
a {
background: rgba(#000,.1);
float: right;
display: inline-block;
margin: -1em -1.41575em -1em 0;
padding: 1em ms(2);
}
}
/**
* Handheld footer bar
*/
.storefront-handheld-footer-bar {
display: none;
}
/**
* Breadcrumbs
*/
.woocommerce-breadcrumb {
padding: ms(2) 99em ms(2);
margin-left: -99em;
margin-right: -99em;
margin-bottom: ms(7);
}
/**
* Responsive tables
*/
table.shop_table_responsive {
thead {
display: table-header-group;
}
tbody {
th {
display: table-cell;
}
}
tr {
td {
display: table-cell;
&:before {
display: none;
}
}
}
}
/**
* Header Elements
*/
.site-header-cart {
position: relative;
.cart-contents {
padding: ms(3) 0;
display: block;
position: relative;
background-color: transparent;
height: auto;
width: auto;
text-indent: 0;
.amount {
margin-right: .327em;
}
.count {
font-weight: 300;
opacity: 0.5;
font-size: ms(-1);
}
span {
display: inline;
}
}
.widget_shopping_cart {
position: absolute;
top: 100%;
width: 100%;
z-index: 999999;
font-size: ms(-1);
left: -999em;
display: block;
&.sub-menu--is-touch-device {
display: none;
left: 0;
}
h2.widgettitle {
display: none;
}
.product_list_widget li a.remove {
position: relative;
float: left;
top: auto;
&:before {
text-align: left;
}
}
}
&:hover,
&.focus {
.widget_shopping_cart {
left: 0;
display: block;
}
}
}
.site-search {
display: block;
form {
margin: 0;
}
}
/**
* Reset mobile product styles
*/
ul.products {
li.product {
clear: none;
width: 100%;
float: left;
font-size: ms(-1);
&.first {
clear: both !important;
}
&.last {
margin-right: 0 !important;
}
}
}
/**
* Full width content area product layout
*/
.page-template-template-fullwidth-php,
.page-template-template-homepage-php,
.storefront-full-width-content {
.site-main {
.columns-1 {
ul.products {
li.product {
width: 100%;
margin-right: 0;
float: none;
}
}
}
.columns-2 {
ul.products {
li.product {
@include span(6 of 12);
}
}
}
.columns-3 {
ul.products {
li.product {
@include span(4 of 12);
}
}
}
.columns-4 {
ul.products {
li.product {
@include span(3 of 12);
}
}
}
// The grid wont work for 5 columns :-(
.columns-5 {
ul.products {
li.product {
width: 16.9%;
margin-right: 3.8%;
}
}
}
.columns-6 {
ul.products {
li.product {
@include span(2 of 12);
}
}
}
}
}
/**
* Main content area (adjacent to sidebar) product layout
*/
.site-main {
.columns-1 {
ul.products {
li.product {
width: 100%;
margin-right: 0;
float: none;
}
}
}
// The grid wont work for 2 columns :-(
.columns-2 {
ul.products {
li.product {
width: 48%;
margin-right: 3.8%;
}
}
}
.columns-3 {
ul.products {
li.product {
@include span(3 of 9);
}
}
}
// The grid wont work for 4 columns :-(
.columns-4 {
ul.products {
li.product {
width: 22.05%;
margin-right: 3.8%;
}
}
}
// The grid wont work for 5 columns :-(
.columns-5 {
ul.products {
li.product {
width: 16.9%;
margin-right: 3.8%;
}
}
}
.columns-6 {
ul.products {
li.product {
@include span(1.5 of 9);
}
}
}
ul.products {
li.product {
@include span(3 of 9);
}
}
}
/**
* Single product page
*/
.single-product {
div.product {
.images {
@include span(4 of 9);
margin-bottom: ms(6);
.thumbnails {
@include clearfix;
a.zoom {
@include span(1 of 4);
&.last {
@include last;
}
}
}
}
.woocommerce-product-gallery {
@include span(4 of 9);
margin-bottom: ms(6);
}
.summary {
@include span(last 5 of 9);
}
.woocommerce-tabs {
clear: both;
}
}
}
#reviews {
.comment-form-author,
.comment-form-email {
width: 47%;
}
.comment-form-email {
margin-right: 0;
}
}
// Full width single product
.storefront-full-width-content.single-product {
div.product {
.images {
@include span(5 of 12);
margin-bottom: ms(6);
.thumbnails {
a.zoom {
@include span(1 of 5);
&.last {
margin-right: 0;
}
}
}
}
.woocommerce-product-gallery {
@include span(5 of 12);
margin-bottom: ms(6);
&.woocommerce-product-gallery--columns-2 {
.flex-control-thumbs {
li {
@include span( 2.5 of 5 );
&:nth-child(2n) {
margin-right: 0;
}
}
}
}
&.woocommerce-product-gallery--columns-3 {
.flex-control-thumbs {
li {
@include span( 1.666666667 of 5 );
&:nth-child(3n) {
margin-right: 0;
}
}
}
}
&.woocommerce-product-gallery--columns-4 {
.flex-control-thumbs {
li {
@include span( 1.25 of 5 );
&:nth-child(4n) {
margin-right: 0;
}
}
}
}
&.woocommerce-product-gallery--columns-5 {
.flex-control-thumbs {
li {
@include span( 1 of 5 );
&:nth-child(5n) {
margin-right: 0;
}
}
}
}
}
.summary {
@include span(last 7 of 12);
margin-bottom: ms(6);
}
.woocommerce-tabs {
clear: both;
}
}
#reviews {
.commentlist {
li {
.avatar {
@include span(1 of 8);
}
.comment_container {
.comment-text {
@include span(last 7 of 8);
}
}
}
ul.children {
@include span(last 7 of 8);
.avatar {
@include span(1 of 7);
}
.comment-text {
@include span(last 6 of 7);
}
}
}
}
.related,
.upsells {
ul.products {
li.product {
@include span(4 of 12);
}
}
}
}
/**
* General full-width styles
*/
.storefront-full-width-content {
&.woocommerce-cart .entry-header,
&.woocommerce-checkout .entry-header,
&.woocommerce-account .entry-header,
.woocommerce-products-header {
text-align: center;
padding: 0 0 ms(8);
h1:last-child {
margin-bottom: 0;
}
}
.up-sells,
.related.products {
> h2:first-child {
text-align: center;
}
}
}
.woocommerce .page-description {
margin-bottom: ms(3);
}
.storefront-sorting {
@include clearfix;
margin-bottom: ms(5);
select {
width: auto;
}
}
.woocommerce-result-count {
float: left;
position: relative;
margin-bottom: 0;
padding: .327em 0;
}
.woocommerce-ordering {
float: left;
margin-right: 1em;
margin-bottom: 0;
padding: .327em 0;
}
.woocommerce-pagination {
float: right;
border: 0;
clear: none;
padding: 0;
margin-bottom: 0;
}
/**
* Cart
*/
.woocommerce-cart,
.woocommerce-checkout {
.hentry {
border-bottom: 0;
padding-bottom: 0;
}
}
.page-template-template-fullwidth-php {
table.cart {
.product-thumbnail {
display: table-cell;
}
thead {
font-size: 1em;
text-indent: 0;
}
}
}
table.cart {
th,
td {
padding: ms(3);
}
.qty {
padding: ms(-1);
max-width: 3.632em;
}
td.product-remove {
display: table-cell;
padding: ms(3);
border: 0;
a.remove {
float: none;
position: relative;
top: auto;
right: auto;
}
}
.product-quantity .plus,
.product-quantity .minus {
display: inline-block;
}
.quantity {
.qty {
padding: ms(-2);
}
}
td.actions {
text-align: right;
label {
display: none;
}
.coupon {
padding-bottom: 0;
margin-bottom: 0;
border-bottom: none;
display: inline-block;
float: left;
}
input {
display: inline-block;
width: auto;
margin: 0;
}
}
}
.cart-collaterals {
@include clearfix;
h2 {
font-size: ms(3);
}
.cross-sells {
@include span(4 of 9);
ul.products {
li.product {
@include span(2 of 4);
&:nth-child(2n) {
margin-right: 0 !important;
}
}
}
}
.cart_totals,
.shipping_calculator {
@include span(last 5 of 9);
margin: 0;
clear: right;
}
.cart_totals {
small.includes_tax {
display: block;
}
}
.shipping_calculator {
clear: right;
}
}
.page-template-template-fullwidth-php {
.cart-collaterals {
.cross-sells {
@include span(6 of 12);
ul.products {
li.product {
@include span(3 of 6);
}
}
}
.cart_totals,
.shipping_calculator {
@include span(last 6 of 12);
}
}
}
/**
* Checkout
*/
#ship-to-different-address {
position: relative;
label {
font-weight: 300;
}
.woocommerce-form__input-checkbox {
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
margin-right: 0;
}
}
.col2-set {
@include span(5 of 9);
.form-row-first {
@include span(2 of 5);
}
.form-row-last {
@include span(last 3 of 5);
}
.col-1,
.col-2 {
margin-bottom: ms(3);
}
& + #customer_details {
display: none;
}
.woocommerce-billing-fields {
@include clearfix;
}
&.addresses {
@include span(full);
.col-1 {
@include span(4.5 of 9);
}
.col-2 {
@include span(last 4.5 of 9)
}
}
}
#customer_details + #wc_checkout_add_ons {
@include span( last 4 of 9 );
}
#wc_checkout_add_ons {
input[type=radio] {
float: left;
margin-right: ms(-3);
clear: left;
margin-top: .35em;
}
}
#order_review_heading,
#order_review {
@include span(last 4 of 9);
clear: right;
}
#order_review {
transition: box-shadow ease .4s;
}
#order_review_heading {
margin-bottom: 0;
padding-bottom: ms(-2);
}
// Payment forms in account
.woocommerce-order-pay,
.page-template-template-fullwidth-php.woocommerce-order-pay {
#order_review {
width: 100%;
float: none;
#payment {
h3 {
padding-left: 1em;
padding-top: 1em;
}
.form-row {
padding: 1em;
}
}
.payment_methods + .form-row {
padding: 1em;
}
.button#place_order {
display: block;
width: 100%;
font-size: ms(2);
}
}
}
.page-template-template-fullwidth-php {
.col2-set {
@include span(6 of 12);
.form-row-first {
@include span(3 of 6);
}
.form-row-last {
@include span(last 3 of 6);
}
&.addresses {
.col-1 {
@include span(6 of 12);
}
.col-2 {
@include span(last 6 of 12)
}
}
}
#order_review_heading,
#order_review {
@include span(last 6 of 12);
}
#customer_details + #wc_checkout_add_ons {
@include span( last 6 of 12 );
}
}
#order_review {
.shop_table {
margin-bottom: ms(5);
}
}
/**
* My Account
*/
table + .addresses {
margin-top: ms(3);
}
.col2-set#customer_login,
.col2-set.addresses {
@include span( full );
.col-1 {
@include span( 4 of 9 );
}
.col-2 {
@include span( 5 of 9 last );
}
}
.woocommerce-MyAccount-navigation {
@include span( 2 of 9 );
}
.woocommerce-MyAccount-content {
@include span( last 7 of 9 );
.form-row-first {
@include span( 3 of 7 );
}
.form-row-last {
@include span( last 4 of 7 );
}
}
.left-sidebar:not(.page-template-template-fullwidth-php) {
.woocommerce-MyAccount-navigation {
@include span( last 2 of 9 );
}
.woocommerce-MyAccount-content {
@include span( 7 of 9 );
}
}
table.my_account_orders {
font-size: ms(-1);
}
.page-template-template-fullwidth-php {
.col2-set#customer_login,
.col2-set.addresses {
.col-1 {
@include span( 6 of 12 );
}
.col-2 {
@include span( 6 of 12 last );
}
}
.woocommerce-MyAccount-navigation {
@include span( 3 of 12 );
}
.woocommerce-MyAccount-content {
@include span( last 9 of 12 );
.form-row-first {
@include span( 4 of 8 );
}
.form-row-last {
@include span( last 4 of 8 );
}
.col2-set {
width: 100%;
.col-1 {
@include span( 4 of 8 );
}
.col-2 {
@include span( last 4 of 8 );
}
}
}
}
.addresses {
header.title {
@include clearfix;
a {
float: right;
}
h3 {
float: left;
}
}
}
/**
* General WooCommerce Components
*/
.form-row-first {
@include span(4.5 of 9);
clear: both;
}
.form-row-last {
@include span(last 4.5 of 9);
}
.page-template-template-fullwidth-php {
.form-row-first {
@include span(6 of 12);
}
.form-row-last {
@include span(last 6 of 12);
}
}
.storefront-full-width-content {
.woocommerce-tabs {
ul.tabs {
@include span(4 of 12);
}
.panel {
@include span(last 8 of 12);
margin-bottom: ms(6);
}
}
}
.woocommerce-tabs {
@include clearfix;
padding-top: ms(5);
padding-bottom: ms(5);
ul.tabs {
@include span(3 of 9);
li {
&.active:after {
right: 1em;
}
}
}
.panel {
@include span(last 6 of 9);
margin-top: 0;
}
}
}
@media (min-width: $handheld) and (max-width: $container-width) {
.woocommerce-breadcrumb {
margin-left: -2.618rem;
margin-right: -2.618rem;
padding-left: 2.618rem;
padding-right: 2.618rem;
}
}