task 6809 | перенес assets из папки woocommerce, изменил размер вывода миниатюры в карточке товара на medium-size

pull/36/head
parent 7e5e4b0cb0
commit 0189c54e03
  1. 943
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/css/catalog.css
  2. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/css/gp-style-order.css
  3. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/country/ar.svg
  4. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/country/ru.svg
  5. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/logo/logo-black.svg
  6. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/logo/logo-gradient.svg
  7. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/logo/logo-white.svg
  8. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-back.svg
  9. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-black.svg
  10. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-left.svg
  11. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-right-input.svg
  12. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-right.svg
  13. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-selected-white.svg
  14. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/arrow-selected.svg
  15. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/basket.svg
  16. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/black-x.svg
  17. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/change-dot.svg
  18. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/filter.svg
  19. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/google-white.svg
  20. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/gradient-x.svg
  21. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/minus.svg
  22. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/plus-grey.svg
  23. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/plus.svg
  24. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/question.svg
  25. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/status-cancelled.svg
  26. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/status-chek.svg
  27. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/triangle-grey.svg
  28. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/vk-white.svg
  29. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/white-x.svg
  30. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/main/ya-white.svg
  31. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/mini-profile/basket-w.svg
  32. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/mini-profile/basket.svg
  33. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/mini-profile/profile-w.svg
  34. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/mini-profile/profile.svg
  35. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/social-media/tg.svg
  36. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/social-media/vk.svg
  37. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/img/svg/social-media/ya.svg
  38. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/js/_gp-function.js
  39. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/js/core.js
  40. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/js/gp-cabinet.js
  41. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/js/gp-form.js
  42. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/js/gp-main.js
  43. 0
      wp-content/themes/cosmopet/modules/shop/components/catalog/assets/js/gp-product.js
  44. 14
      wp-content/themes/cosmopet/modules/shop/components/catalog/component-controller.php
  45. 72
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-desktop.css
  46. 2
      wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-tease.twig
  47. 75
      wp-content/themes/cosmopet/templates/_pages/shop/product-single.twig
  48. 1342
      wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-core.css
  49. 1888
      wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-desktop.css
  50. 270
      wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-mobile.css
  51. 342
      wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-tablet.css
  52. 4
      wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-ultra.css
  53. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-Bold.woff
  54. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-Bold.woff2
  55. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-Medium.woff
  56. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-Medium.woff2
  57. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-Regular.woff
  58. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-Regular.woff2
  59. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-SemiBold.woff
  60. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/CraftworkGrotesk-SemiBold.woff2
  61. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/craftwork-grotesk-bold.ttf
  62. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/craftwork-grotesk-medium.ttf
  63. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/craftwork-grotesk-regular.ttf
  64. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/craftwork/craftwork-grotesk-semi-bold.ttf
  65. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/din-2014/din-2014-rounded-demi.ttf
  66. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/din-2014/din-2014-rounded-demi.woff
  67. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/din-2014/din-2014-rounded-demi.woff2
  68. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/din-2014/din-2014-rounded-regular.ttf
  69. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/din-2014/din-2014-rounded-regular.woff
  70. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/din-2014/din-2014-rounded-regular.woff2
  71. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/roboto/Roboto-Medium.woff
  72. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/roboto/Roboto-Medium.woff2
  73. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/roboto/Roboto-Regular.woff
  74. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/roboto/Roboto-Regular.woff2
  75. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/roboto/roboto-medium.ttf
  76. BIN
      wp-content/themes/cosmopet/woocommerce/assets/fonts/roboto/roboto-regular.ttf

@ -0,0 +1,943 @@
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.wrapper{
margin: 0 auto;
max-width: 1600px;
}
/* compound */
.compound{
margin: -5px;
min-height: 33.95px;
display: flex;
align-items: start;
}
.compound__item{
margin: 5px;
padding: 4px 8px;
font-family: var(--font-family);
font-weight: 700;
font-size: 12px;
line-height: 133%;
color: var(--text-black);
border-radius: 16px;
background-color: var(--background-white);
display: block;
text-decoration: none;
}
.compound__item:first-child{
margin-left: 0;
}
.product__footer{
margin: 48px 24px 24px;
display: flex;
justify-content: center;
}
.product__footer--error{
margin: 45px 0;
}
/* compound */
/* select */
.select{
max-width: 144px;
position: relative;
}
.select__state{
width: 100%;
padding: 11px 47px 11px 13px;
/* pointer-events:none; */
border: 1px solid var(--background-black);
border-radius: 20px;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
cursor: pointer;
position: relative;
transition: opacity .2s ease-out;
}
.select:hover .select__state{
opacity: .8;
}
.select::after{
content: '';
position: absolute;
top: 20.5px;
right: 21.5px;
width: 17px;
height: 10px;
background-image: url(../img/svg/main/arrow-black.svg);
background-repeat: no-repeat;
background-size: contain;
pointer-events: none;
}
.state__block{
position: absolute;
top: 48px;
left: 0;
width: 100%;
height: 0;
overflow: hidden;
transition: height .2s ease-out;
}
.state__content{
padding: 8px;
border-radius: 6px;
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2);
background-color: var(--background-white);
list-style-type: none;
}
.state__content li{
margin-top: 8px;
}
.state__content li:first-child{
margin-top: 0;
}
.state__button{
width: 100%;
padding: 4px 32px 4px 4px;
background: none;
border: none;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-dark);
text-align: start;
border-radius: 6px;
transition: background-color .2s ease-out;
position: relative;
}
.state__button:hover,
.state__button.active{
background-color: var(--background-grey);
}
.state__button.active::before{
content: '';
position: absolute;
top: 10px;
right: 8px;
width: 16px;
height: 12px;
background-image: url(../img/svg/main/arrow-selected.svg);
}
/* select */
/* Sidebar Filters */
.modal__filter .modal__header {
height: 100%;
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: stretch;
}
.WpfWoofiltersWidget {
height: 100%;
}
.WpfWoofiltersWidget .wpfMainWrapper {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 2rem;
}
.wpfFilterWrapper {
padding-top: 26px!important;
padding-bottom: 25px!important;
border-bottom: 1px solid var(--text-3);
position: relative;
margin: 0!important;
}
.wpfFilterWrapper .wfpDescription {
padding: 0!important;
padding-right: 30px!important;
margin: 0!important;
font-family: var(--font-family);
font-weight: 700;
font-size: 16px;
line-height: 125%;
color: var(--text-black);
cursor: pointer;
text-transform: uppercase;
}
.wpfFilterWrapper .wfpDescription:after {
content: '';
position: absolute;
top: 24px;
right: 0;
width: 24px;
aspect-ratio: 1;
background-image: url(../img/svg/main/black-x.svg);
transform: rotate(45deg);
transition: transform .2s;
pointer-events: none;
}
.wpfFilterWrapper.expanded .wfpDescription::after {
transform: rotate(0deg);
}
.wpfCheckboxHier, .wpfExpandablePart {
display: none;
}
.wpfCheckboxHier {
padding-top: 24px;
}
.wpfLiLabel, .wpfFilterVerScroll li label {
display: flex!important;
flex-direction: row;
align-items: center;
gap: 8px;
padding-left: 0;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
cursor: pointer;
}
.wpfCheckbox {
display: flex!important;
align-content: center;
justify-content: center;
}
.wpfCheckbox label {
display: none!important;
}
.wpfFilterWrapper[data-filter-type="wpfPrice"] .wpfFilterContent {
padding: 0!important;
}
.wpfFilterLayoutHor {
justify-content: space-between;
}
.wpfPriceInputs {
justify-content: space-between!important;
}
.wpfFilterWrapper .ui-slider-horizontal {
height: 6px!important;
}
.wpfExpandablePart {
padding: 0 10px;
}
.ui-slider.ui-widget-content:not(.iris-slider-offset) {
border-radius: 999px!important;
border: 0!important;
background: var(--background-grey)!important;
}
.ui-slider .ui-slider-range {
background: rgb(30, 164, 156)!important;
}
.wpfPriceFilterRange.ui-slider.ui-widget-content .ui-slider-handle {
border-radius: 999px!important;
border: 2px solid white!important;
background: rgb(30, 164, 156)!important;
height: 16px!important;
width: 16px!important;
}
.wpfPriceRangeField#wpfMinPrice, .wpfPriceRangeField#wpfMaxPrice {
min-width: 80px!important;
box-sizing: border-box;
text-align: left!important;
}
.wpfPriceRangeField#wpfMinPrice:after,
.wpfPriceRangeField#wpfMaxPrice:after {
content: ' ₽';
}
.wpfPriceRangeField#wpfMaxPrice {
text-align: right!important;
}
.wpfFilterDelimeter {
display: none!important;
}
.wpfFilterButtons .wpfFilterButton {
height: 56px;
text-transform: capitalize!important;
width: 100%!important;
padding: 16px 24px 24px 24px!important;
font-weight: 700!important;
text-align: center!important;
position: relative!important;
background: var(--gradient-turquoise);
border: none;
transition: opacity .2s ease-out;
font-family: var(--font-family);
font-size: 20px!important;
line-height: 120%;
color: var(--text-black);
border-radius: 20px!important;
cursor: pointer;
}
.wpfFilterButtons .wpfClearButton.wpfButton {
padding-bottom: 4px;
width: 100%;
text-align: center;
text-transform: capitalize!important;
font-family: var(--font-family);
font-weight: 700;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
border-bottom: 0!important;
cursor: pointer;
border-radius: 0!important;
text-decoration: underline!important;
}
.wpfFilterContent ul li input[type="checkbox"] {
width: 18px;
height: 18px;
border: 2px solid var(--background-black)!important;
background: var(--background-white);
flex-shrink: 0;
border-radius: 4px!important;
appearance: none!important;
-webkit-appearance: none!important;
outline: none!important;
}
.wpfFilterContent ul li input[type="checkbox"]:checked {
background-color: var(--background-black);
background-image: url(../../static/img/svg/main/arrow-selected-white.svg);
background-repeat: no-repeat;
background-position: center;
}
.wpfFilterWrapper ul:not(.wpfButtonsFilter) li{
min-width: 50%;
}
.to-know{
width: 100%;
padding: 12px;
display: flex;
justify-content: center;
border: none;
transition: opacity .2s ease-out;
text-transform: uppercase;
}
.to-know:hover{
opacity: .8;
}
.to-know p{
padding-bottom: 4px;
font-family: var(--font-family);
font-weight: 700;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
border-bottom: 1px var(--text-black) solid;
cursor: pointer;
}
.to-know--background-none{
background: none;
}
.compound{
flex-wrap: wrap;
}
.product__item.hiding .product-item__price p {
color: #999;
}
.product-item__price-disc, .product-item__price {
display: flex;
align-items: center;
gap: 20px;
}
.product-item__price-disc, .product-item__price{
display: flex;
align-items: center;
gap: 20px;
}
.product-item__price-sale__perc{
font-size: 20px;
text-transform: uppercase;
color: #FA0505;
}
.product-item__price-sale__text {
text-decoration: line-through;
color: #999999;
font-size: 18px;
}
.product-item__price-sale__perc::after{
display: none;
}
/* Основные стили для компьютера */
/* product */
.product{
padding: 24px;
}
.product__header{
display: flex;
justify-content: space-between;
align-items: center;
}
.product__tag{
margin: 36px -12px -12px -12px;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.product-tag__item{
margin: 12px;
padding: 1px;
border-radius: 16px;
background: var(--gradient-blue);
border: none;
}
.product-tag-item__content{
padding: 3px 11px;
background: var(--background-white);
border-radius: 15px;
display: flex;
align-items: center;
}
.product-tag-item__text{
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
background: var(--gradient-blue);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.product-tag-item__button{
margin: 2px 0 2px 4px;
width: 20px;
aspect-ratio: 1;
background: none;
border: none;
background-image: url(../img/svg/main/gradient-x.svg);
background-repeat: no-repeat;
background-position: center;
}
.product__error{
margin: auto;
padding: 0 16px;
font-family: var(--font-family);
font-weight: 700;
font-size: 24px;
line-height: 100%;
text-transform: uppercase;
color: var(--text-0);
text-align: center;
}
.product__error-button{
border-radius: 20px;
padding: 4px 24px;
font-family: var(--font-family);
font-weight: 600;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
border: 1px solid var(--text-0);
background: var(--background-white);
text-decoration: none;
}
.product__title{
font-family: var(--font-family);
font-weight: 700;
font-size: 36px;
line-height: 111%;
text-transform: uppercase;
text-align: center;
color: var(--text-black);
}
.product__main{
margin: 36px -12px -12px;
/* width: 100%; */
display: flex;
align-items: stretch;
flex-wrap: wrap;
}
.product__item{
margin: 12px;
width: calc(25% - 24px);
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: var(--background-grey);
border-radius: 24px;
overflow: hidden;
position: relative;
}
.product__item::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: calc(100% - 2px);
height: calc(100% - 2px);
border: 1px solid #000;
border-radius: 24px;
pointer-events: none;
transition: opacity .2s ease-out;
opacity: 0;
}
.product__item:hover::before{
opacity: 1;
}
.product__item.active::before{
opacity: 0;
}
.product-item__block-label{
position: absolute;
top: 16px;
left: 16px;
}
.product-item__label{
position: absolute;
top: 16px;
left: 16px;
margin: -2px;
display: flex;
align-items: center;
z-index: 10;
}
.product-item-label__tag{
margin: 2px;
padding: 4px 8px;
font-family: var(--font-family);
font-weight: 700;
font-size: 12px;
line-height: 133%;
color: #f4f1f0;
border-radius: 16px;
display: block;
text-decoration: none;
}
.product-item-label__tag--new{
background: var(--gradient-blue);
}
.product-item-label__tag--new-green{
background: #d9ffcc;
color: #4e7623;
}
.product-item-label__tag--sale{
background: var(--gradient-red);
}
.product-item-label__tag--sale-red{
color: #fa0505;
background: #ffe5e5;
}
.product-item-label__tag--black{
background: var(--background-black);
color: var(--text-white);
}
.product-item-label__tag--title{
padding: 4px 2px;
font-size: 16px;
line-height: 125%;
color: var(--text-black);
display: flex;
align-items: center;
}
.product-item__product-card{
height: 274px;
display: flex;
justify-content: center;
align-items: center;
}
.product-item__images{
height: 242px;
object-fit: contain;
}
.product-item__content-card{
padding: 15.5px;
}
.product-item__title{
margin-top: 8px;
font-family: var(--font-family);
font-weight: 500;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
text-decoration: none;
display: block;
}
.product-item__title:first-child{
margin-top: 0;
}
.product-item__price{
margin-top: 8px;
display: flex;
align-items: center;
}
.product-item__price p{
font-family: var(--font-family);
font-weight: 700;
font-size: 20px;
line-height: 200%;
text-transform: uppercase;
}
/* .product-item__price p::after{
content: '₽';
padding-left: 5px;
} */
.product-item__price span{
margin-left: 9px;
font-family: var(--font-family);
font-weight: 500;
font-size: 12px;
line-height: 133%;
color: var(--text-red);
}
.product-item__price del{
margin-left: 24px;
font-family: var(--font-family);
font-weight: 700;
font-size: 18px;
line-height: 133%;
text-transform: uppercase;
text-decoration: line-through;
color: var(--text-6);
}
.product-item__price del::after{
content: '₽';
}
.product-item__price span::before{
content: '-';
}
.product-item__price span::after{
content: '%';
}
.product-item__bye{
margin-top: 8px;
}
.product__item.hiding .product-item__price{
color: var(--text-grey);
}
.product-item__overlay{
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 100%;
padding: 24px;
display: flex;
flex-direction: column;
justify-content: space-between;
border-radius: 24px;
backdrop-filter: blur(25px);
background-color: rgba(242, 242, 242, 0.8);
z-index: 10;
transition: top .4s ease-out;
}
.product-item__overlay.active{
top: 0;
}
.product-item-overlay__header{}
.product-item-overlay__tags{
margin: 4px -6px -6px -6px;
font-family: var(--font-family);
font-weight: 500;
font-size: 12px;
line-height: 133%;
color: var(--text-3);
display: flex;
flex-wrap: wrap;
list-style-type: none;
}
.product-item-overlay__tags li{
margin: 4px 6px;
position: relative;
}
.product-item-overlay__tags li:nth-child(n+1)::after{
content: '';
position: absolute;
top: 6px;
right: -8px;
width: 4px;
aspect-ratio: 1;
background-color: var(--text-3);
border-radius: 50%;
}
.product-item-overlay__tags li:last-child::after,
.product-item-overlay__tags li:last-child::before{
display: none;
}
.product-item-overlay__price{
margin-top: 32px;
font-family: var(--font-family);
font-weight: 700;
font-size: 24px;
line-height: 100%;
text-transform: uppercase;
text-align: right;
color: var(--text-black);
}
.product-item-overlay__price::after{
content: 'AED';
}
.product-item-overlay__block-button{
margin-top: 32px;
}
.product-item-overlay__button{
margin-top: 16px;
}
.product-item-overlay__button:first-child{
margin-top: 0;
}
.product-item-overlay__input-block{
}
.product-item-overlay__field{
margin-top: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.product-item-overlay__field:first-child{
margin-top: 0;
}
.product-item-overlay-field__title{
font-family: var(--font-family);
font-weight: 700;
font-size: 16px;
line-height: 125%;
color: var(--text-0);
}
.product-item__form{
}
.active-filters {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 20px;
margin-top: 20px;
}
.active-filter-tag {
padding: 6px 12px;
border: 1px solid #3EC2A6;
border-radius: 16px;
color: #3EC2A6;
font-weight: 400;
font-size: 20px;
line-height: 120%;
white-space: nowrap;
cursor: default;
transition: all 0.2s;
text-transform: uppercase;
}
.active-filter-tag:hover {
background-color: #e8f8f5;
cursor: pointer;
}
.active-filters__clear.button--white {
padding: 6px 12px;
height: 38px;
margin-top: 20px;
}
/* Стили для планшетов */
@media only screen and (max-width: 1200px) {
/* product */
.product{
padding: 12px;
padding-top: 20px;
}
.product__title{
font-weight: 700;
font-size: 26px;
line-height: 123%;
text-transform: uppercase;
}
.to-know p {
font-size: 18px;
}
}
/* Стили для мобильных устройств */
@media only screen and (max-width: 720px) {
/* product */
.product__item{
width: calc(100% - 24px);
}
/* product */
/* modal */
.modal__basket{
width: 100%;
}
.modal__filter{
width: 100%;
}
.modal__to-know,
.modal__to-know-submit{
width: 100%;
}
.modal__button .to-know{
display: flex;
background: none;
}
}
@media only screen and (max-width: 576px) {
.product__header{
flex-direction: column;
align-items: start;
}
.product__header .button{
margin-top: 48px;
}
/* product */
}

@ -1,12 +1,12 @@
<?php <?php
wp_enqueue_script('shop_scripts', get_template_directory_uri() . '/woocommerce/assets/js/gp-main.js', ['jquery'], '', true); // wp_enqueue_script('shop_scripts', get_template_directory_uri() . '/woocommerce/assets/js/gp-main.js', ['jquery'], '', true);
wp_enqueue_style('shop_styles_core', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-core.css'); // wp_enqueue_style('shop_styles_core', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-core.css');
wp_enqueue_style('shop_styles_desktop', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-desktop.css'); // wp_enqueue_style('shop_styles_desktop', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-desktop.css');
wp_enqueue_style('shop_styles_tablet', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-tablet.css'); // wp_enqueue_style('shop_styles_tablet', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-tablet.css');
wp_enqueue_style('shop_styles_mobile', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-mobile.css'); // wp_enqueue_style('shop_styles_mobile', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-mobile.css');
wp_enqueue_style('shop_styles_order', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-order.css'); // wp_enqueue_style('shop_styles_order', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-order.css');
wp_enqueue_style('shop_styles_ultra', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-ultra.css'); // wp_enqueue_style('shop_styles_ultra', get_template_directory_uri() . '/woocommerce/assets/css/gp-style-ultra.css');
function get_active_woobewoo_filters_for_twig() { function get_active_woobewoo_filters_for_twig() {
$filters = []; $filters = [];

@ -2031,4 +2031,74 @@ main{
font-weight: 500; font-weight: 500;
font-size: 20px; font-size: 20px;
line-height: 120%; line-height: 120%;
} }
.toggle__table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.toggle__table th,
.toggle__table td {
width: 33.33%;
vertical-align: top;
padding: 8px;
text-align: left;
}
.toggle-table__title {
font-weight: bold;
font-size: 16px;
}
.toggle-table__item {
position: relative;
padding-bottom: 10px;
}
.toggle-table__item p {
display: inline-block;
margin: 0;
background: #fff; /* подложка, если нужно перекрыть линию */
padding-right: 4px;
z-index: 1;
position: relative;
}
/* Линия-многоточие */
.toggle-table-item__line {
position: absolute;
left: 0;
bottom: 4px;
width: 100%;
border-bottom: 1px dotted #aaa;
z-index: 0;
}
/* Адаптив */
@media (max-width: 768px) {
.toggle__table th,
.toggle__table td {
font-size: 14px;
padding: 6px;
}
}
/* Maks */
.toggle__table tbody,
.toggle__table thead,
.toggle__table thead tr{
width: 100%;
}
.toggle__table thead tr{
display:flex;
}
.toggle__table tbody tr{
display: flex;
gap: 8px;
}

@ -19,7 +19,7 @@
{% endif %} {% endif %}
</div> </div>
<a href="{{ post.link }}" class="product-item__product-card"> <a href="{{ post.link }}" class="product-item__product-card">
<img src="{{ post.thumbnail.src('shop_single') }}" alt="{{ post.title }}" class="product-item__images"> <img src="{{ post.thumbnail.src('medium') }}" alt="{{ post.title }}" class="product-item__images">
</a> </a>
<div class="product-item__content-card"> <div class="product-item__content-card">
<div class="compound"> <div class="compound">

@ -206,77 +206,7 @@
{{ function('pll_e', 'РЕКОМЕНДАЦИИ ПО КОРМЛЕНИЮ') }} {{ function('pll_e', 'РЕКОМЕНДАЦИИ ПО КОРМЛЕНИЮ') }}
</p> </p>
<div class="toggle__block-content"> <div class="toggle__block-content">
<div class="toggle__content"> <div class="toggle__content">
<style>
.toggle__table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
.toggle__table th,
.toggle__table td {
width: 33.33%;
vertical-align: top;
padding: 8px;
text-align: left;
}
.toggle-table__title {
font-weight: bold;
font-size: 16px;
}
.toggle-table__item {
position: relative;
padding-bottom: 10px;
}
.toggle-table__item p {
display: inline-block;
margin: 0;
background: #fff; /* подложка, если нужно перекрыть линию */
padding-right: 4px;
z-index: 1;
position: relative;
}
/* Линия-многоточие */
.toggle-table-item__line {
position: absolute;
left: 0;
bottom: 4px;
width: 100%;
border-bottom: 1px dotted #aaa;
z-index: 0;
}
/* Адаптив */
@media (max-width: 768px) {
.toggle__table th,
.toggle__table td {
font-size: 14px;
padding: 6px;
}
}
/* Maks */
.toggle__table tbody,
.toggle__table thead,
.toggle__table thead tr{
width: 100%;
}
.toggle__table thead tr{
display:flex;
}
.toggle__table tbody tr{
display: flex;
gap: 8px;
}
</style>
<table class="toggle__table toggle__table--three"> <table class="toggle__table toggle__table--three">
{% if product_meta.feeding_recommendations_table.header is defined %} {% if product_meta.feeding_recommendations_table.header is defined %}
@ -302,9 +232,6 @@
</tbody> </tbody>
</table> </table>
{# Старая таблица #} {# Старая таблица #}
{# <div class="toggle__table toggle__table--three"> {# <div class="toggle__table toggle__table--three">
{% if product_meta.feeding_recommendations_table.header %} {% if product_meta.feeding_recommendations_table.header %}

@ -1,270 +0,0 @@
/* Стили для мобильных устройств */
@media only screen and (max-width: 720px) {
/* product */
.product__item{
width: calc(100% - 24px);
}
/* product */
/* modal */
.modal__basket{
width: 100%;
}
.modal__filter{
width: 100%;
}
.modal__to-know,
.modal__to-know-submit{
width: 100%;
}
.modal__button .to-know{
display: flex;
background: none;
}
.modal__basket .modal__header {
height: calc(100% - 156px);
margin-bottom: -36px;
}
.modal-basket-item__block-image{
position: absolute;
width: 80px;
}
.modal-basket-item__image{
width: 48px;
}
.modal-basket-item__content{
margin-left: 0;
padding-left: 96px;
}
.modal-basket-item__control{
margin-left: -80px;
}
.modal-basket-item__title{
min-height: 40px;
font-size: 16px;
}
.modal-basket__item--return{
flex-direction: column;
align-items: start;
}
.modal-basket__item--return .modal-basket-item__title{
margin-right: auto;
}
.notification--width-584{
width: 100%;
}
.notification__title{
font-size: 20px;
}
.notification__text--center-pc{
text-align: start;
}
.notification__img{
height: 360px;
}
.notification__title{
padding-right: 96px;
}
.modal-form__buttons--two{
flex-wrap: wrap;
}
.modal-form__buttons--two button, .modal-form__buttons--two input{
margin-top: 24px;
width: 100%;
}
.modal-form__buttons--two button:first-child, .modal-form__buttons--two input:first-child{
margin-top: 0;
}
.modal-map__control{
flex-wrap: wrap;
}
.modal-map-control__item{
width: calc(100% - 24px);
}
.form__full-mobile{
width: 100%;
border-radius: 0;
border: none;
}
.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){
width: 69px;
}
.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){
}
.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){
width: 82px;
}
.form__input{
padding: 12px 14px;
}
.modal-form--height-100-phone{
min-height: 100%;
}
/* modal */
/* footer */
.footer__about{
display: none;
}
.footer__wrapper{
flex-direction: column;
}
.footer__content{
width: 100%;
}
.footer__form{
margin-top: 24px;
margin-left: 0;
width: 100%;
}
.footer__social-media{
display: block;
margin-top: 24px;
}
.footer-about__text{
padding-top: 35px;
display: block;
text-align: left;
}
.footer__list{
margin-top: 20px;
}
/* footer */
/* detail */
.toggle__table--two .toggle-table__block{
width: 100%;
}
.toggle__table--two .toggle-table__block:nth-child(even){
margin-top: 32px;
margin-left: 0;
}
.toggle__table--three .toggle-table__block:nth-child(1){
width: 31%;
}
/* detail */
/* cabinet */
.cabinet-card__title{
font-size: 20px;
}
.cabinet-card__no-orders{
margin-top: 16px;
}
.cabinet-card-order__header{
flex-direction: column;
}
.cabinet-card-order__payment{
margin-top: 16px;
}
.cabinet-card-order-detail__main{
flex-direction: column;
}
.cabinet-card-order-detail-main__links{
margin-top: 24px;
align-items: start;
}
.cabinet-card-order-detail-main-product__img{
width: 70px;
height: 70px;
}
.cabinet-card-order-detail-main__product{
margin-top: 16px;
align-items: start;
}
.cabinet-card-order-detail-main-product__content{
margin-left: 16px;
flex-wrap: wrap;
position: relative;
}
.cabinet-card-order-detail-main-product__description{
width: 100%;
}
.cabinet-card-order-detail-main-product__count{
position: absolute;
left: 116px;
bottom: 0;
}
.cabinet-card-order-detail-main-product__price{
position: absolute;
left: 153px;
bottom: 0;
}
.cabinet-card__content{
padding-right: 19px;
}
/* .cabinet-card__order.active */
/* .cabinet-card__order.active */
/* cabinet */
}
@media only screen and (max-width: 576px) {
/* header */
/* header */
/* product */
.product__header{
flex-direction: column;
align-items: start;
}
.product__header .button{
margin-top: 48px;
}
/* product */
/* modal */
.modal__aside{
left: 0;
}
.form-input-radio__title span{
display: block;
width: 100%;
color: var(--text-grey);
}
.modal-form__title{
font-size: 20px;
}
/* modal */
/* detail */
.detail-block-form__item,
.detail-block-form__submit{
min-width: 100%;
}
/* detail */
/* cabinet */
.cabinet-card-order-detail-main-product__img{
width: 40px;
height: 40px;
}
.cabinet-card-order-detail-main-product__count{
left: auto;
right: 71px;
}
.cabinet-card-order-detail-main-product__price{
left: auto;
right: 0;
}
.cabinet-card-order__detail-short{
transition-delay: 0;
transition-duration: 0;
}
/* cabinet */
}

@ -1,342 +0,0 @@
/* Стили для планшетов */
@media only screen and (max-width: 1200px) {
/* header */
main{
padding-top: 64px;
}
.main-menu{
display: none;
}
.header__open-menu{
display: block;
}
.lang{
display: none;
}
.header__logo{
width: 136px;
height: 29px;
}
.header__content{
height: auto;
padding: 8px 16px;
}
.mini-profile__item:nth-child(2){
margin-left: 0;
}
.header::after{
left: 0;
width: 100%;
}
.header__pc-menu{
display: none;
}
.header__phone-menu{
display: block;
}
.header__menu-block{
top: 56px;
}
.header__content::after{
left: 0;
right: 0;
width: 100%;
}
/* header */
/* footer */
.footer{
margin-top: 0;
padding: 24px 16px;
}
/* footer */
/* breadcrumbs */
.breadcrumbs{
display: none;
}
/* breadcrumbs */
/* product */
.product{
padding: 12px;
padding-top: 20px;
}
.product__title{
font-weight: 700;
font-size: 26px;
line-height: 123%;
text-transform: uppercase;
}
.to-know p {
font-size: 18px;
}
.toggle-table__title{
font-weight: 700;
font-size: 12px;
line-height: 133%;
}
.toggle-table__item p{
font-weight: 500;
font-size: 12px;
line-height: 133%;
}
.toggle-table-item__line{
margin-top: 12px;
}
.detail{
margin: 24px 16px;
}
.back-detail{
display: inline;
}
.detail-catalot__title{
font-size: 22px;
}
.product__footer--error{
margin: 48px 0px 24px;
}
/* product */
/* modal */
.modal{
padding: 0;
}
.modal__text{
padding-right: 0;
}
.form__button-pc{
display: none;
}
.form__button-mobile{
display: block;
}
.modal-form{
/* min-height: 100%;
width: 100%;
border-radius: 0;
border: none; */
}
.modal__notification{
margin: 24px;
}
.form-input-phone__list{
left: 0;
}
.modal-form-content__line--two{
flex-wrap: wrap;
}
.modal-form-content__line--two .modal-form-content-line__element{
margin-top: 24px;
width: 100%;
}
.modal-form-content__line--two .modal-form-content-line__element:first-child{
margin-top: 0;
}
.modal-map{
width: 100%;
flex-direction: column;
border-radius: 0;
}
.modal-map__left, .modal-map__right{
width: 100%;
}
.modal-map__map iframe {
width: 100%;
height: 528px;
}
.modal-map-form__button{
display: none;
}
.modal-map-form__sub-button{
margin-top: 64px;
padding: 0 24px;
display: flex;
}
/* modal */
/* cabinet */
.cabinet{
flex-direction: column;
position: relative;
}
.cabinet__control{
display: flex;
position: relative;
}
.cabinet__orders, .cabinet__profile{
width: calc(100% - 48px);
}
.cabinet__orders, .cabinet__profile{
position: absolute;
opacity: 0;
transition: opacity .2s ease-out;
}
.cabinet-content{
pointer-events:none;
}
.cabinet__orders.active, .cabinet__profile.active{
opacity: 1;
}
.cabinet__orders.hide, .cabinet__profile.hide{
position: static;
display: block;
pointer-events:auto;
width: 100%;
}
.cabinet__subscription-pc{
display: none;
}
.cabinet__subscription-mobile{
display: block;
margin: 24px 24px 0 24px;
}
.cabinet__orders .cabinet-card:nth-child(2){
margin-top: 0;
}
/* cabinet */
}
@media only screen and (max-width: 980px) {
/* product */
.product__item{
width: calc(50% - 24px);
}
/* product */
/* detail */
.detail{
flex-direction: column;
}
.detail__images{
display: none;
}
.detail__content{
width: 100%;
}
.detail__content{
margin-left: 0;
}
.detail__images-phone{
display: block;
margin-top: 48px;
margin-bottom: 48px;
position: relative;
overflow: hidden;
}
.detail__images-phone .swiper-slide{
display: flex;
justify-content: center;
}
.detail-images-phone__image-block{
width: 100%;
aspect-ratio: 1;
max-width: 500px;
display: flex;
justify-content: center;
align-items: center;
background: var(--background-grey);
border-radius: 16px;
}
.detail__images-phone .swiper-pagination-bullet{
width: 8px;
height: 8px;
border-radius: 50%;
border: 1px solid #666;
background-color: #666;
opacity: 1;
}
.detail__images-phone .swiper-pagination-bullet.swiper-pagination-bullet-active{
background-color: var(--background-white);
}
.detail__images-phone .swiper-pagination{
margin-bottom: 19px;
}
.detail__title{
font-size: 26px;
line-height: 123%;
}
.gallery__slider .swiper-pagination {
display: block;
}
.gallery__pagination{
display: none;
}
.gallery__slider .swiper-pagination-bullet{
width: 8px;
height: 8px;
border-radius: 50%;
border: 1px solid #666;
background-color: #666;
opacity: 1;
}
.gallery__wrapper .gallery-button{
display: none;
}
.gallery__slider .swiper-pagination-bullet.swiper-pagination-bullet-active{
background-color: var(--background-white);
}
.gallery__slider{
margin-left:0;
padding: 0px 0px 50px 0px;
/* padding: 40px; */
}
.gallery__block {
width: 100%;
aspect-ratio: 1;
height: auto;
}
/* detail */
}
@media only screen and (max-width: 750px) {
/* cabinet */
.cabinet-card-order__open-detail{
margin-top: 144px;
}
.cabinet-card-order__detail-short{
right: auto;
left: 0;
bottom: 48px;
}
.cabinet-card-order-detail-short__item{
margin-left: -27px;
}
.cabinet-card-order-detail-short__item:first-child{
margin-left: 0;
}
.cabinet-card__order.active .cabinet-card-order__open-detail{
margin-top: 24px;
}
/* cabinet */
}

@ -1,4 +0,0 @@
/* Стили для ультрашироких экранов */
@media only screen and (min-width: 1400px) {
}
Loading…
Cancel
Save