внесение правок
This commit is contained in:
Kirill Pet
@@ -418,6 +418,54 @@ button{
|
||||
.form__button:hover{
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
.label{
|
||||
padding-bottom: 4px;
|
||||
|
||||
display: inline-block;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
.label::after{
|
||||
content: '';
|
||||
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: -20px;
|
||||
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
|
||||
background-image: url(../img/svg/main/question.svg);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
.label__title{
|
||||
font-family: var(--font-family);
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 125%;
|
||||
color: var(--text-3);
|
||||
}
|
||||
.label__question{
|
||||
position: absolute;
|
||||
|
||||
padding: 8px;
|
||||
|
||||
border-radius: 6px;
|
||||
transition: height .2s ease-out;
|
||||
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2);
|
||||
overflow: hidden;
|
||||
background-color: var(--background-white);
|
||||
|
||||
opacity: 0;
|
||||
transition: opacity .2s ease-out;
|
||||
pointer-events: none;
|
||||
}
|
||||
.label:hover .label__question{
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
/* form */
|
||||
|
||||
|
||||
@@ -446,7 +494,7 @@ button{
|
||||
|
||||
/* breadcrumbs */
|
||||
.breadcrumbs{
|
||||
margin: 96px 24px 24px;
|
||||
margin: 24px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -638,6 +686,53 @@ button{
|
||||
.to-know--background-none{
|
||||
background: none;
|
||||
}
|
||||
.back{
|
||||
margin-top: 16px;
|
||||
margin-left: 16px;
|
||||
|
||||
padding: 8px;
|
||||
padding-left: 32px;
|
||||
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
font-family: var(--font-family);
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
color: var(--text-black);
|
||||
|
||||
text-decoration: none;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
.back::before{
|
||||
content: '';
|
||||
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 0;
|
||||
|
||||
margin-right: 8px;
|
||||
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
|
||||
background-image: url(../img/svg/main/arrow-back.svg);
|
||||
}
|
||||
|
||||
.back::after{
|
||||
content: '';
|
||||
|
||||
position: absolute;
|
||||
bottom: 6px;
|
||||
left: 0;
|
||||
|
||||
width: calc(100% - 8px);
|
||||
height: 1px;
|
||||
|
||||
background: var(--text-black);
|
||||
}
|
||||
/* button */
|
||||
|
||||
/* select */
|
||||
@@ -848,6 +943,9 @@ button{
|
||||
filter: blur(10px);
|
||||
transition: filter .2s ease-out;
|
||||
}
|
||||
.modal__item--no-title{
|
||||
padding-top: 72px;
|
||||
}
|
||||
.modal__item.active{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -875,6 +973,29 @@ button{
|
||||
text-transform: uppercase;
|
||||
color: var(--text-black);
|
||||
}
|
||||
.modal__small-title{
|
||||
font-family: var(--font-family);
|
||||
font-weight: 700;
|
||||
font-size: 24px;
|
||||
line-height: 100%;
|
||||
text-transform: uppercase;
|
||||
color: var(--text-black);
|
||||
}
|
||||
.modal__text{
|
||||
margin-top: 16px;
|
||||
|
||||
font-family: var(--font-family);
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
color: var(--text-0);
|
||||
}
|
||||
.modal__form-sub{
|
||||
margin-top: 48px;
|
||||
}
|
||||
.modal-form-sub__submit{
|
||||
margin-top: 64px;
|
||||
}
|
||||
.modal__block-button{
|
||||
margin-top: 24px;
|
||||
}
|
||||
@@ -921,6 +1042,10 @@ button{
|
||||
.modal__basket{
|
||||
width: 600px;
|
||||
}
|
||||
.modal__to-know,
|
||||
.modal__to-know-submit{
|
||||
width: 412px;
|
||||
}
|
||||
.modal-basket__item{
|
||||
padding-top: 23px;
|
||||
padding-bottom: 24px;
|
||||
@@ -952,6 +1077,33 @@ button{
|
||||
.modal-basket__item:hover .modal-basket__item::before{
|
||||
opacity: .8;
|
||||
}
|
||||
.modal-basket__item--return{
|
||||
padding-right: 5px;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.modal-basket__item--return .modal-basket-item__title{
|
||||
padding-right: 10px;
|
||||
}
|
||||
.modal-basket__item--return::before{
|
||||
display: none;
|
||||
}
|
||||
.modal-basket-item__return{
|
||||
border-radius: 20px;
|
||||
padding: 4px 24px;
|
||||
|
||||
font-family: var(--font-family);
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
color: var(--text-white);
|
||||
|
||||
background: var(--background-black);
|
||||
|
||||
border: none;
|
||||
}
|
||||
.modal-basket-item__block-image{
|
||||
width: 128px;
|
||||
aspect-ratio: 1;
|
||||
@@ -1014,6 +1166,15 @@ button{
|
||||
.modal__basket .modal__content{
|
||||
height: calc(100% - 100px);
|
||||
overflow-x: hidden;
|
||||
|
||||
}
|
||||
.modal__basket .modal__content::-webkit-scrollbar {
|
||||
width: 7px;
|
||||
background-color: #f9f9fd;
|
||||
}
|
||||
.modal__basket .modal__content::-webkit-scrollbar-thumb {
|
||||
background-color: var(--background-black);
|
||||
border-radius: 2px;
|
||||
}
|
||||
/* modal */
|
||||
|
||||
@@ -1039,11 +1200,14 @@ button{
|
||||
background-image: url(../img/svg/main/black-x.svg);
|
||||
transform: rotate(45deg);
|
||||
transition: transform .2s;
|
||||
pointer-events: none;
|
||||
}
|
||||
.toggle.active::after{
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.toggle__title{
|
||||
padding-right: 30px;
|
||||
|
||||
font-family: var(--font-family);
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
@@ -1093,6 +1257,8 @@ button{
|
||||
.checkbox{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
.checkbox__state{
|
||||
border-radius: 4px;
|
||||
@@ -1102,6 +1268,8 @@ button{
|
||||
|
||||
border: 2px solid var(--background-black);
|
||||
background: var(--background-white);
|
||||
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.checkbox.active .checkbox__state{
|
||||
background-color: var(--background-black);
|
||||
@@ -1121,6 +1289,23 @@ button{
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
color: var(--text-dark);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
.checkbox__label a{
|
||||
color: #76ce75;
|
||||
|
||||
text-decoration: none;
|
||||
}
|
||||
.checkbox--small{
|
||||
margin-top: 24px;
|
||||
}
|
||||
.checkbox--small .checkbox__label{
|
||||
padding-left: 24px;
|
||||
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 133%;
|
||||
}
|
||||
/* checkbox */
|
||||
|
||||
@@ -1134,6 +1319,8 @@ button{
|
||||
aspect-ratio: 1;
|
||||
|
||||
accent-color: var(--background-black);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
.radio__label{
|
||||
padding-left: 8px;
|
||||
@@ -1143,6 +1330,8 @@ button{
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
color: var(--text-dark);
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
/* radio */
|
||||
|
||||
|
||||
@@ -248,7 +248,7 @@
|
||||
text-decoration: none;
|
||||
}
|
||||
.header.white{
|
||||
/* background-color: thistle; */
|
||||
background: none;
|
||||
}
|
||||
.header.white .header__logo-black{
|
||||
display: none;
|
||||
@@ -284,6 +284,10 @@
|
||||
.header.white .header__open-menu::after{
|
||||
background: var(--background-white);
|
||||
}
|
||||
|
||||
main{
|
||||
padding-top: 72px;
|
||||
}
|
||||
/* header end */
|
||||
|
||||
/* product */
|
||||
@@ -310,6 +314,7 @@
|
||||
border-radius: 16px;
|
||||
|
||||
background: var(--gradient-blue);
|
||||
border: none;
|
||||
}
|
||||
.product-tag-item__content{
|
||||
padding: 3px 11px;
|
||||
@@ -344,6 +349,16 @@
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
.product__error{
|
||||
margin: auto;
|
||||
|
||||
font-family: var(--font-family);
|
||||
font-weight: 700;
|
||||
font-size: 24px;
|
||||
line-height: 100%;
|
||||
text-transform: uppercase;
|
||||
color: var(--text-0);
|
||||
}
|
||||
.product__title{
|
||||
font-family: var(--font-family);
|
||||
font-weight: 700;
|
||||
@@ -651,9 +666,9 @@
|
||||
/* product */
|
||||
|
||||
/* modal */
|
||||
.modal__button .to-know{
|
||||
/* .modal__button .to-know{
|
||||
display: none;
|
||||
}
|
||||
} */
|
||||
/* modal */
|
||||
|
||||
/* footer */
|
||||
@@ -704,6 +719,9 @@
|
||||
.footer-list__item:nth-child(even){
|
||||
width: 322px;
|
||||
}
|
||||
.footer-list__item .button{
|
||||
border-radius: 24px;
|
||||
}
|
||||
.footer-list__title{
|
||||
font-family: var(--font-family);
|
||||
font-weight: 700;
|
||||
@@ -941,14 +959,21 @@
|
||||
margin-top: 48px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
.detail__catalot{
|
||||
.detail__wrapper-catalot{
|
||||
margin-top: 64px;
|
||||
|
||||
width: 100%;
|
||||
width: calc(100% + 16px);
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
.detail__catalot{
|
||||
|
||||
}
|
||||
.detail-catalot__header{
|
||||
padding-right: 16px;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@@ -993,6 +1018,9 @@
|
||||
.detail__images-phone{
|
||||
display: none;
|
||||
}
|
||||
.back-detail{
|
||||
display: none;
|
||||
}
|
||||
.toggle__table{
|
||||
margin-top: 32px;
|
||||
|
||||
|
||||
@@ -13,6 +13,10 @@
|
||||
.modal__filter{
|
||||
width: 100%;
|
||||
}
|
||||
.modal__to-know,
|
||||
.modal__to-know-submit{
|
||||
width: 100%;
|
||||
}
|
||||
.modal__button .to-know{
|
||||
display: flex;
|
||||
|
||||
@@ -65,6 +69,11 @@
|
||||
|
||||
margin-top: 24px;
|
||||
}
|
||||
.footer-about__text{
|
||||
padding-top: 35px;
|
||||
display: block;
|
||||
text-align: left;
|
||||
}
|
||||
.footer__list{
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
/* Стили для планшетов */
|
||||
@media only screen and (max-width: 1200px) {
|
||||
/* header */
|
||||
main{
|
||||
padding-top: 64px;
|
||||
}
|
||||
.main-menu{
|
||||
display: none;
|
||||
}
|
||||
@@ -12,7 +15,7 @@
|
||||
}
|
||||
.header__logo{
|
||||
width: 136px;
|
||||
height: 24px;
|
||||
height: 29px;
|
||||
}
|
||||
.header__content{
|
||||
height: auto;
|
||||
@@ -41,16 +44,50 @@
|
||||
/* footer */
|
||||
.footer{
|
||||
margin-top: 0;
|
||||
}
|
||||
.footer__about{
|
||||
justify-content: center;
|
||||
}
|
||||
.footer-about__text{
|
||||
display: none;
|
||||
|
||||
padding: 24px 16px;
|
||||
}
|
||||
/* footer */
|
||||
|
||||
/* breadcrumbs */
|
||||
.breadcrumbs{
|
||||
display: none;
|
||||
}
|
||||
/* breadcrumbs */
|
||||
|
||||
/* product */
|
||||
.product{
|
||||
padding: 12px;
|
||||
}
|
||||
.product__title{
|
||||
font-weight: 400;
|
||||
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%;
|
||||
}
|
||||
.detail{
|
||||
margin: 24px 16px;
|
||||
}
|
||||
.back-detail{
|
||||
display: inline;
|
||||
}
|
||||
.detail-catalot__title{
|
||||
font-size: 22px;
|
||||
}
|
||||
/* product */
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 980px) {
|
||||
|
||||
Reference in New Issue
Block a user