You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
template-for-verstka/assets/css/gp-style-mobile.css

246 lines
4.1 KiB

/* Стили для мобильных устройств */
@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);
}
/* 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__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 */
}