fix(mobile/shop): Corrects drag/drop because of transform3d

This commit is contained in:
sovanna 2020-01-19 15:07:41 +01:00
parent 952eccd560
commit 5b95796160
1 changed files with 30 additions and 22 deletions

View File

@ -281,17 +281,20 @@
} }
#root-shop .layout>aside.aside.menu-opened { #root-shop .layout>aside.aside.menu-opened {
transform: translate3d(0, 0, 0); /*transform: translate3d(0, 0, 0);*/
transition: transform .3s; transition: left .3s;
width: 310px; width: 310px;
left: 0;
} }
#root-shop .layout>aside.aside.menu-opened + section.main { #root-shop .layout>aside.aside.menu-opened + section.main {
transform: translate3d(310px, 0, 0); /*transform: translate3d(310px, 0, 0);*/
transition: transform .3s; transition: left .3s;
left: 310px;
position: relative;
} }
#root-shop .layout>aside.aside.menu-opened + section.main:after { /*#root-shop .layout>aside.aside.menu-opened + section.main:after {
content: ''; content: '';
position: absolute; position: absolute;
height: 100%; height: 100%;
@ -300,14 +303,14 @@
top: 0; top: 0;
bottom: 0; bottom: 0;
z-index: 10; z-index: 10;
} }*/
#root-shop .layout>aside.aside { #root-shop .layout>aside.aside {
transform: translate3d(-310px, 0px, 0px); /*transform: translate3d(-310px, 0px, 0px);*/
transition: transform .3s; transition: left .3s;
position: fixed; position: fixed;
z-index: 1; z-index: 1;
left: 0; left: -310px;
width: 310px; width: 310px;
height: 100%; height: 100%;
} }
@ -317,8 +320,9 @@
} }
#root-shop .layout>aside.aside + section.main { #root-shop .layout>aside.aside + section.main {
transform: translate3d(0, 0, 0); /*transform: translate3d(0, 0, 0);*/
transition: transform .3s; transition: left .3s;
left: 0;
} }
#root-shop .layout>section.main { #root-shop .layout>section.main {
@ -364,17 +368,20 @@
} }
#root-shop .layout>aside.aside.menu-opened { #root-shop .layout>aside.aside.menu-opened {
transform: translate3d(0, 0, 0); /*transform: translate3d(0, 0, 0);*/
transition: transform .3s; transition: left .3s;
width: 310px; width: 310px;
left: 0;
} }
#root-shop .layout>aside.aside.menu-opened + section.main { #root-shop .layout>aside.aside.menu-opened + section.main {
transform: translate3d(310px, 0, 0); /*transform: translate3d(310px, 0, 0);*/
transition: transform .3s; transition: left .3s;
left: 310px;
position: relative;
} }
#root-shop .layout>aside.aside.menu-opened + section.main:after { /*#root-shop .layout>aside.aside.menu-opened + section.main:after {
content: ''; content: '';
position: absolute; position: absolute;
height: 100%; height: 100%;
@ -382,14 +389,14 @@
background-color: rgba(0, 0, 0, .8); background-color: rgba(0, 0, 0, .8);
top: 0; top: 0;
bottom: 0; bottom: 0;
} }*/
#root-shop .layout>aside.aside { #root-shop .layout>aside.aside {
transform: translate3d(-310px, 0px, 0px); /*transform: translate3d(-310px, 0px, 0px);*/
transition: transform .3s; transition: left .3s;
position: fixed; position: fixed;
z-index: 1; z-index: 1;
left: 0; left: -310px;
width: 310px; width: 310px;
height: 100%; height: 100%;
} }
@ -399,8 +406,9 @@
} }
#root-shop .layout>aside.aside + section.main { #root-shop .layout>aside.aside + section.main {
transform: translate3d(0, 0, 0); /*transform: translate3d(0, 0, 0);*/
transition: transform .3s; transition: left .3s;
left: 0;
} }
#root-shop .layout>section.main { #root-shop .layout>section.main {