@import 'variables', 'mixin'; /** * Table of Contents: * 1.0 - single-prod-content * 1.1 - product_title * 1.2 - woocommerce-product-rating * 1.3 - price * 1.4 - description * 1.5 - variations * 1.6 - cart | variations_button * 1.7 - product_meta * 1.8 - tabs * 1.9 - woocommerce-product-attributes * 2.0 - single-prod-gal * 3.0 - quantity * 4.0 - star-rating * 5.0 - woocommerce-Reviews * 5.1 - woocommerce-Reviews-title * 5.2 - comments * 5.3 - review_form * 6.0 - related */ .selectedoptions { @include media-max(1200px){ width: 100%; } } .single_variation_wrap{ width: 100%; } .wcpa_type_image-group label, .wcpa_form_item.wcpa_type_text label, .wcpa_form_item.wcpa_type_file label, .wcpa_form_item.wcpa_type_textarea label { @include media-max(1200px){ width: 100%; } } .wcpa_form_outer .wcpa_form_item .wcpa_tooltip_icon { @include media-max(1200px){ margin: 5px 20px 15px 0; width: 18px; font-size: 12px; line-height: 19px; height: 18px; position: absolute; right: 0; } } .required_ast{ @include media-max(1200px){ position: absolute; top: 0; margin-left: 4px; color: #e34848; font-size: 18px; opacity: 0.8; } } .borderRequired{ border: 2px solid #e34848; animation: pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1); box-shadow: 0 0 0 0 rgba(#e34848, 20%); } .single-product{ .absolute-button__redirection{ position: fixed !important; @include absolute(auto, 10px, 20px, auto); .button{ box-shadow: 0 0 15px rgba(#000, 20%); padding: 15px 20px; span{ color: #fff; } &:before{ width: 100%; } &:hover{ span{ color: #000; } &:before{ width: 0%; } } } } } .woocommerce-product-gallery{ .flex-control-thumbs{ /*display: none !important;*/ } } #payment{ @include media-min(1200px){ padding: 0 100px; } } .wcpa_form_outer{ .wcpa_row{ &:first-of-type{ padding-top: 80px; } } } .wcpa_row { .realizacja { background: rgba($primary-color, 20%); border: 1px solid $primary-color; font-size: 15px; text-align: left !important; margin-bottom: 20px; text-align: left; font-weight: 600; padding: 20px; margin-top: 0; position: absolute; width: 100%; top: 0; p { margin-bottom: 0; } } } .single-product div.product.wcpa_has_options form.cart { display: flex !important; margin-bottom: 30px; @include media-max(1200px) { justify-content: center; } } .wcpa_price_summary { width: 100%; margin-bottom: 10px; } .woocommerce div.product .woocommerce-tabs ul.tabs { display: none; } .single_add_to_cart_button { margin-left: auto; animation: pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1); box-shadow: 0 0 0 0 rgba(0, 0, 0, 15%); @include media-max(1200px) { width: 100%; margin-top: 30px; } &:hover { -webkit-animation: none; -moz-animation: none; -ms-animation: none; animation: none; color: #ffffff; } } .woocommerce-tabs { .accordion { background: #fff; padding: 10px 30px; border: 1px solid #bdbcbc; &-body { padding: 1rem 0; em{ font-style: normal !important; } } &-collapse { transition: $transition; border: none; } &-button { border: none; font-size: 16px; color: #000000; font-weight: 400; padding: 1rem 0; border-bottom: 1px solid #bdbcbc; text-align: start; text-transform: uppercase; &:focus { box-shadow: none !important; } &:after { background-image: none; transform: none; content: "+"; font-size: 20px; align-items: center; display: flex; justify-content: center; } &:not(.collapsed) { color: black; background-color: #fff; &:after { background-image: none; transform: none; content: "-"; font-size: 30px; align-items: center; display: flex; justify-content: center; } } } &-item { &:last-of-type { .accordion-button { border-bottom: unset !important; } } } .sub-title { z-index: 3; } } } .woocommerce-Tabs-panel { .accordion-body { a { color: #000; @extend %link-color; } } h5, h4, h3, h2, h1 { font-size: 20px; } p, h5, h4, h3, h2, h1 { text-align: start !important; } } .woocommerce-product-details__short-description{ display: none !important; } .term-description { text-align: center; @include media-min(1200px) { margin: 30px 150px 0 150px; } p { line-height: 1.6; font-family: 'gilroy-light', sans-serif; } h1, h2, h3, h1 strong, h2 strong, h3 strong { color: #000000; font-family: 'gilroy-regular', sans-serif; font-size: 30px; line-height: 30px; font-weight: 400; margin-bottom: 30px; margin-top: 20px; text-transform: capitalize; } } gallery .gallery-item .gallery-icon>a, .product-col .product-box-img, .product-box>a:not(.product-box__link), .woocommerce-product-gallery__image>a, .blog-post__img__link { text-align: center; } /* 1.0 - single-prod-content */ .archive, .page, .single { .product-box { border: unset; box-shadow: unset; display: block; &:hover { box-shadow: unset; } .product-box-desc { padding: 20px 0; text-align: start } .imagewrapper { height: 450px; border: unset; width: 100%; object-fit: cover; @include media-max(1600px) { height: 350px; } } .product-box-img__hov, .product-box-img { height: 450px; border: unset; @include media-max(1600px) { height: 350px; } } &-desc__price { bdi { font-size: 16px; line-height: 16px; color: #333333; font-weight: 300; } } &-desc__h { font-size: 18px; line-height: 25px; color: #333333; font-weight: bold; margin-bottom: 5px; } } } .stock { text-align: center; font-weight: bold; font-size: 20px; } .single-prod-content { @include media-min(1200px) { padding-left: 20px; } /* 1.1 - product_title */ .product_title { margin: 20px 0 20px; text-align: center; @include media-max(sm) { margin: $single-prod-title-mobile-margin; } } /* 1.2 - woocommerce-product-rating */ .woocommerce-product-rating { margin: $paragraph-margin; .star-rating { margin: 4px 10px 0 0; float: left; } .woocommerce-review-link { font-size: 14px; } } /* 1.3 - price */ .price { font-family: 'gilroy-regular', sans-serif; color: #000; font-size: 20px; line-height: 1.2; font-weight: 700; margin: 40px 0 10px; border-top: 1px solid #bdbcbc; border-bottom: 1px solid #bdbcbc; padding: 20px 0; display: block; text-align: center; del { color: $single-prod-price-del-color; font-size: $single-prod-price-del-font-size; font-weight: $single-prod-price-del-font-weight; margin-right: 10px; } ins { text-decoration: none; } } /* 1.4 - description */ .description { margin: $paragraph-margin; } /* 1.5 - variations */ .variations { width: 100%; margin: $single-prod-variations-margin; td { padding: $single-prod-variations-td-padding; &.label { font-weight: $woo-bold-font-weight; label { margin: 0; } } &.value { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; .reset_variations { margin-left: 15px; } select { @extend .form-select; padding-left: 8px; } } } .single_variation_wrap { margin: $single-prod-variations-single_variation_wrap-margin; } } /* 1.6 - cart | variations_button */ .cart, .variations_button { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; .quantity-buttons { margin-right: 15px; } } .quantity-buttons { flex-direction: row-reverse !important; } /* 1.7 - product_meta */ .product_meta { margin: $single-prod-content-product_meta-margin; display: none; >span { display: block; font-weight: $woo-bold-font-weight; >span, >a { font-weight: 400; } } } /* 1.8 - tabs */ .tabs.wc-tabs { list-style: none; padding: 0; margin: $single-prod-wc-tabs-margin; border-bottom: 1px solid $woo-border-color; &:after { content: ' '; display: block; clear: both; } li { float: left; padding: 0; a { color: $single-prod-wc-tabs-a-color; font-size: $single-prod-wc-tabs-a-font-size; line-height: $single-prod-wc-tabs-a-line-height; font-weight: $single-prod-wc-tabs-a-font-weight; padding: $single-prod-wc-tabs-a-padding; display: block; border-bottom: 1px solid transparent; margin-bottom: -1px; @include css3(transition, $single-prod-wc-tabs-a-transition); &:hover { border-color: $single-prod-wc-tabs-a-border-color; color: $single-prod-wc-tabs-a-color-hover; text-decoration: none; } } &.active a { border-color: $single-prod-wc-tabs-a-border-color; color: $single-prod-wc-tabs-a-color-hover; text-decoration: none; } } } /* 1.9 - woocommerce-product-attributes */ .woocommerce-product-attributes { margin: $paragraph-margin; &-item__label { font-weight: $woo-bold-font-weight; padding-right: 10px; } &-item__value p { margin: 0; } } } /* 2.0 - single-prod-gal */ .single-prod-gal { position: relative; margin: 20px 0 20px; .flex-control-nav.flex-control-thumbs { list-style: none; padding: 0; margin: 0 -7.5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 15px; >li { float: left; width: 100% / $single-prod-gal-thumbnails-number-per-row; padding: 0 7.5px; margin-bottom: 15px; cursor: pointer; position: relative; >img { width: 100%; height: 100%; object-fit: cover; &:hover { border: 5px solid darken($primary-color, 20%); } } } } } /* 3.0 - quantity */ .quantity { input[type="number"] { width: 60px; height: 60px; text-align: center; padding-left: 8px !important; padding-right: 8px !important; border-radius: $input-border-radius 0 0 $input-border-radius; -moz-appearance: textfield; &:focus { border-color: $input-border-color; } } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } &-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; } &-buttons { display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; width: 30px; flex-direction: row; width: 120px; height: 42px; @include media-max(1200px) { height: auto; } button { height: 60px !important; width: 60px; font-size: 18px; line-height: 23px; border-width: $input-border-width; border-style: solid; border-color: $input-border-color; border-radius: 0 $input-border-radius $input-border-radius 0; border-left: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0; background: $input-bg; color: $input-color; font-weight: 400; letter-spacing: 0; @include css3(transition, $transition); +button { height: floor(($input-font-size * 1.5 + 2 + $input-padding-y * 2) - floor(($input-font-size * 1.5 + 2 + $input-padding-y * 2) / 2)); } &:hover { border-color: $input-border-color; background: $input-border-color; color: #fff; } &.quantity-buttons__plus {} &.quantity-buttons__minus { border-top: 1px solid $input-border-color; } } } +.quantity-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; } &.hidden+.quantity-buttons { display: none !important; } } /* 4.0 - star-rating */ .star-rating { overflow: hidden; position: relative; height: 14px; line-height: 1; width: 80px; margin: 8px auto 9px; &:before { height: 14px; width: 100%; content: ''; background-repeat: repeat-x; background-size: 16px 14px; position: absolute; top: 0; left: 0; } span { overflow: hidden; padding-top: 14px; background-repeat: repeat-x; background-size: 16px 14px; position: absolute; top: 0; left: 0; } } /* 5.0 - woocommerce-Reviews */ .woocommerce-Reviews { /* 5.1 - woocommerce-Reviews-title */ &-title, .comment-reply-title { font-family: $header-font-family; font-size: 110%; line-height: $header-font-line-height; color: $header-color; font-weight: $header-font-weight; letter-spacing: 0; text-transform: $header-text-transform; margin: 40px 0 10px; display: block; } /* 5.2 - comments */ #comments { ol.commentlist { margin: 0; width: 100%; background: 0 0; list-style: none; padding: 0; li { padding: 0; margin: 0 0 20px; border: 0; position: relative; background: 0; border: 0; } img.avatar { display: none; } .comment-text { margin: 0; border: 1px solid $woo-border-color; border-radius: 0; padding: 15px 15px; } .star-rating { margin: 0 0 10px; } .meta { margin: 0 0 10px; } .description { margin: 0; font-size: 90%; font-style: italic; p { margin: 0; } } } } /* 5.3 - review_form */ #review_form { #comment { resize: none; height: 120px; } input[type="text"], input[type="email"], textarea { @extend .form-control; } input[type="checkbox"] { @extend .form-check-input; } p { margin: 0 0 10px; } p.comment-form-author { margin-top: -10px; } .comment-form-cookies-consent label { display: inline; } p.form-submit { margin: $paragraph-margin; input[type="submit"] { @extend .button; } } p.stars { display: block; pointer-events: none; >span { display: inline-flex; } a { display: block; width: 22px; height: 18px; position: relative; text-indent: -999em; text-decoration: none; pointer-events: auto; &:before { display: block; width: 100%; height: 100%; content: ''; text-indent: 0; background-size: 22px 18px; position: absolute; top: 0; left: 0; } } } } } .related { >h2 { color: #000000; font-family: 'gilroy-regular', sans-serif; margin-bottom: 30px; margin-top: 50px; font-size: 30px; line-height: 30px; text-align: center; } } /* 6.0 - related */ .related .product-col { opacity: 1 !important; transform: translateZ(0) !important; margin: 10px 0 0; }