удалил toggle на стрицых подписки

This commit is contained in:
Kirill Pet
2025-05-03 20:24:53 +03:00
parent f3eedee26f
commit 6ead69e180
5 changed files with 178 additions and 211 deletions

View File

@@ -2296,45 +2296,23 @@ button{
.subscription__status--end{ .subscription__status--end{
color: var(--text-green); color: var(--text-green);
} }
.subscription__toggle{ .subscription__add{
width: 100%; width: 100%;
} }
.subscription__toggle-header{ .subscription__add-header{
position: relative;
} }
.subscription__toggle-header::after{ .subscription__add-product{
content: '';
position: absolute;
top: 3.5px;
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;
}
.subscription__toggle-header.active::after{
transform: rotate(0deg);
}
.subscription__toggle-product{
align-items: start; align-items: start;
} }
.subscription__toggle-product > *:not(:first-child){ .subscription__add-product > *:not(:first-child){
padding-top: 14px; padding-top: 14px;
} }
.subscription__toggle-title{ .subscription__add-title{
font-family: var(--font-family); font-family: var(--font-family);
font-weight: 600; font-weight: 600;
line-height: 133%; line-height: 133%;
} }
.subscription__toggle-wrapper{ .subscription__add-content{
height: 0;
overflow: hidden;
transition: all .3s;
}
.subscription__toggle-content{
} }

View File

@@ -1955,42 +1955,39 @@ main{
.subscription__item{ .subscription__item{
font-size: 20px; font-size: 20px;
} }
.subscription__toggle{ .subscription__add{
color: var(--text-black); color: var(--text-black);
} }
.subscription__toggle-header{ .subscription__add-header{
} }
.subscription__toggle-title{ .subscription__add-title{
font-size: 24px; font-size: 24px;
} }
.subscription__toggle-wrapper{ .subscription__add-content{
}
.subscription__toggle-content{
padding: 24px 0 12px 0; padding: 24px 0 12px 0;
} }
.subscription__toggle-product{ .subscription__add-product{
align-items: start; align-items: start;
} }
.subscription__toggle-product > *:nth-child(3){ .subscription__add-product > *:nth-child(3){
margin-left: auto; margin-left: auto;
align-items: center; align-items: center;
} }
.subscription__toggle .cabinet-card-order-detail-main-product-description__what { .subscription__add .cabinet-card-order-detail-main-product-description__what {
font-size: 16px; font-size: 16px;
line-height: 125%; line-height: 125%;
} }
.subscription__toggle .cabinet-card-order-detail-main-product-description__with-what { .subscription__add .cabinet-card-order-detail-main-product-description__with-what {
font-weight: 500; font-weight: 500;
font-size: 16px; font-size: 16px;
} }
.subscription__toggle .cabinet-card-order-detail-main-product__count{ .subscription__add .cabinet-card-order-detail-main-product__count{
font-weight: 700; font-weight: 700;
font-size: 16px; font-size: 16px;
line-height: 100%; line-height: 100%;
} }
.subscription__toggle .cabinet-card-order-detail-main-product__price{ .subscription__add .cabinet-card-order-detail-main-product__price{
font-weight: 500; font-weight: 500;
font-size: 20px; font-size: 20px;
line-height: 120%; line-height: 120%;

View File

@@ -282,37 +282,37 @@
margin-top: 6px; margin-top: 6px;
} }
.subscription__toggle-title { .subscription__add-title {
font-size: 20px; font-size: 20px;
} }
.subscription__toggle-product{ .subscription__add-product{
flex-wrap: wrap; flex-wrap: wrap;
} }
.subscription__toggle-product > *:not(:first-child){ .subscription__add-product > *:not(:first-child){
padding-top: 0; padding-top: 0;
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product__img{ .subscription__add-product .cabinet-card-order-detail-main-product__img{
width: 73px; width: 73px;
height: 66px; height: 66px;
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product-description__what{ .subscription__add-product .cabinet-card-order-detail-main-product-description__what{
font-size: 12px; font-size: 12px;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product-description__with-what{ .subscription__add-product .cabinet-card-order-detail-main-product-description__with-what{
margin-top: 8px; margin-top: 8px;
font-size: 12px; font-size: 12px;
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product__description { .subscription__add-product .cabinet-card-order-detail-main-product__description {
width: calc(100% - 73px); width: calc(100% - 73px);
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product__content{ .subscription__add-product .cabinet-card-order-detail-main-product__content{
position: static; position: static;
margin-top: -10px; margin-top: -10px;
margin-left: auto; margin-left: auto;
@@ -322,11 +322,11 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product__count{ .subscription__add-product .cabinet-card-order-detail-main-product__count{
position: static; position: static;
font-size: 12px; font-size: 12px;
} }
.subscription__toggle-product .cabinet-card-order-detail-main-product__price{ .subscription__add-product .cabinet-card-order-detail-main-product__price{
position: static; position: static;
font-size: 16px; font-size: 16px;
} }

View File

@@ -424,14 +424,13 @@
<p>СБП</p> <p>СБП</p>
</div> </div>
<div class="subscription__item"> <div class="subscription__item">
<div class="subscription__toggle" data-js-toggle> <div class="subscription__add">
<div class="subscription__toggle-header" data-js-toggle-button> <div class="subscription__add-header">
<p class="subscription__toggle-title">Товары:</p> <p class="subscription__add-title">Товары:</p>
</div> </div>
<div class="subscription__toggle-wrapper" data-js-toggle-wrapper> <div class="subscription__add-content">
<div class="subscription__toggle-content" data-js-toggle-content> <div class="cabinet-card-order-detail-main__product subscription__add-product">
<div class="cabinet-card-order-detail-main__product subscription__toggle-product">
<img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img"> <img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img">
<div class="cabinet-card-order-detail-main-product__description"> <div class="cabinet-card-order-detail-main-product__description">
@@ -446,7 +445,7 @@
</div> </div>
</div> </div>
<div class="cabinet-card-order-detail-main__product subscription__toggle-product"> <div class="cabinet-card-order-detail-main__product subscription__add-product">
<img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img"> <img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img">
<div class="cabinet-card-order-detail-main-product__description"> <div class="cabinet-card-order-detail-main-product__description">
@@ -461,7 +460,7 @@
</div> </div>
</div> </div>
<div class="cabinet-card-order-detail-main__product subscription__toggle-product"> <div class="cabinet-card-order-detail-main__product subscription__add-product">
<img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img"> <img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img">
<div class="cabinet-card-order-detail-main-product__description"> <div class="cabinet-card-order-detail-main-product__description">
@@ -478,7 +477,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="subscription__item"> <div class="subscription__item">
<p>Сумма</p> <p>Сумма</p>
<p><span>16420 ₽ <small>/ месяц</small></span></p> <p><span>16420 ₽ <small>/ месяц</small></span></p>
@@ -492,13 +490,12 @@
<p><span>16420 ₽ <small>/ месяц</small></span></p> <p><span>16420 ₽ <small>/ месяц</small></span></p>
</div> </div>
<div class="subscription__item"> <div class="subscription__item">
<div class="subscription__toggle" data-js-toggle> <div class="subscription__add" >
<div class="subscription__toggle-header" data-js-toggle-button> <div class="subscription__add-header">
<p class="subscription__toggle-title">Доставка:</p> <p class="subscription__add-title">Доставка:</p>
</div> </div>
<div class="subscription__toggle-wrapper" data-js-toggle-wrapper> <div class="subscription__add-content" data-js-tabs>
<div class="subscription__toggle-content" data-js-toggle-content data-js-tabs>
<form action=""> <form action="">
<div class="modal-form-content__line"> <div class="modal-form-content__line">
<div class="modal-form-content-line__element"> <div class="modal-form-content-line__element">
@@ -520,7 +517,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>

View File

@@ -424,14 +424,13 @@
<p>СБП</p> <p>СБП</p>
</div> </div>
<div class="subscription__item"> <div class="subscription__item">
<div class="subscription__toggle" data-js-toggle> <div class="subscription__add">
<div class="subscription__toggle-header" data-js-toggle-button> <div class="subscription__add-header">
<p class="subscription__toggle-title">Товары:</p> <p class="subscription__add-title">Товары:</p>
</div> </div>
<div class="subscription__toggle-wrapper" data-js-toggle-wrapper> <div class="subscription__add-content">
<div class="subscription__toggle-content" data-js-toggle-content> <div class="cabinet-card-order-detail-main__product subscription__add-product">
<div class="cabinet-card-order-detail-main__product subscription__toggle-product">
<img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img"> <img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img">
<div class="cabinet-card-order-detail-main-product__description"> <div class="cabinet-card-order-detail-main-product__description">
@@ -446,7 +445,7 @@
</div> </div>
</div> </div>
<div class="cabinet-card-order-detail-main__product subscription__toggle-product"> <div class="cabinet-card-order-detail-main__product subscription__add-product">
<img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img"> <img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img">
<div class="cabinet-card-order-detail-main-product__description"> <div class="cabinet-card-order-detail-main-product__description">
@@ -461,7 +460,7 @@
</div> </div>
</div> </div>
<div class="cabinet-card-order-detail-main__product subscription__toggle-product"> <div class="cabinet-card-order-detail-main__product subscription__add-product">
<img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img"> <img src="assets/img/product/mini-card.png" alt="" class="cabinet-card-order-detail-main-product__img">
<div class="cabinet-card-order-detail-main-product__description"> <div class="cabinet-card-order-detail-main-product__description">
@@ -478,7 +477,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="subscription__item"> <div class="subscription__item">
<p>Сумма</p> <p>Сумма</p>
<p><span>16420 ₽ <small>/ месяц</small></span></p> <p><span>16420 ₽ <small>/ месяц</small></span></p>
@@ -492,13 +490,12 @@
<p><span>16420 ₽ <small>/ месяц</small></span></p> <p><span>16420 ₽ <small>/ месяц</small></span></p>
</div> </div>
<div class="subscription__item"> <div class="subscription__item">
<div class="subscription__toggle" data-js-toggle> <div class="subscription__add">
<div class="subscription__toggle-header" data-js-toggle-button> <div class="subscription__add-header">
<p class="subscription__toggle-title">Доставка:</p> <p class="subscription__add-title">Доставка:</p>
</div> </div>
<div class="subscription__toggle-wrapper" data-js-toggle-wrapper> <div class="subscription__add-content" data-js-tabs>
<div class="subscription__toggle-content" data-js-toggle-content data-js-tabs>
<div class="tabs__buttons"> <div class="tabs__buttons">
<button class="modal-map-control__item active" data-js-tabs-button> <button class="modal-map-control__item active" data-js-tabs-button>
<div class="modal-map-control-item__content"> <div class="modal-map-control-item__content">
@@ -568,7 +565,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>