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-tablet.css

161 lines
2.5 KiB

/* Стили для планшетов */
@media only screen and (max-width: 1200px) {
/* header */
.main-menu{
display: none;
}
.header__open-menu{
display: block;
}
.lang{
display: none;
}
.header__logo{
width: 136px;
height: 24px;
}
.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 */
/* footer */
.footer{
margin-top: 0;
}
.footer__about{
justify-content: center;
}
.footer-about__text{
display: none;
}
/* footer */
}
@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 */
}