Fix css transform for android 4.4.2 webview
This commit is contained in:
parent
e6a7b1ca31
commit
b4dbdb7ac4
4 changed files with 17 additions and 0 deletions
|
|
@ -56,6 +56,7 @@
|
||||||
padding: 50px 10px 30px;
|
padding: 50px 10px 30px;
|
||||||
background-color: $v-subtle-gray;
|
background-color: $v-subtle-gray;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
-webkit-transform: translateY(100%);
|
||||||
transform: translateY(100%);
|
transform: translateY(100%);
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
animation-name: slideUpFadeIn;
|
animation-name: slideUpFadeIn;
|
||||||
|
|
@ -76,10 +77,12 @@
|
||||||
|
|
||||||
@keyframes slideUpFadeIn {
|
@keyframes slideUpFadeIn {
|
||||||
from {
|
from {
|
||||||
|
-webkit-transform: translateY(100%);
|
||||||
transform: translateY(100%);
|
transform: translateY(100%);
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
to {
|
to {
|
||||||
|
-webkit-transform: translateY(0);
|
||||||
transform: translateY(0);
|
transform: translateY(0);
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,7 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
transition: transform 2.5s ease;
|
transition: transform 2.5s ease;
|
||||||
&.shrink{
|
&.shrink{
|
||||||
|
-webkit-transform: scale(.8);
|
||||||
transform: scale(.8);
|
transform: scale(.8);
|
||||||
}
|
}
|
||||||
&-container {
|
&-container {
|
||||||
|
|
|
||||||
|
|
@ -100,6 +100,7 @@
|
||||||
top:50%;
|
top:50%;
|
||||||
&, &.next {
|
&, &.next {
|
||||||
left:100%;
|
left:100%;
|
||||||
|
-webkit-transform: translate(100%, -40%);
|
||||||
transform: translate(100%, -40%);
|
transform: translate(100%, -40%);
|
||||||
}
|
}
|
||||||
&.next, &.prev {
|
&.next, &.prev {
|
||||||
|
|
@ -110,10 +111,12 @@
|
||||||
left:50%;
|
left:50%;
|
||||||
}
|
}
|
||||||
&.current {
|
&.current {
|
||||||
|
-webkit-transform: translate(-50%, -40%);
|
||||||
transform: translate(-50%, -40%);
|
transform: translate(-50%, -40%);
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
}
|
}
|
||||||
&.prev {
|
&.prev {
|
||||||
|
-webkit-transform: translate(-150%, -40%);
|
||||||
transform: translate(-150%, -40%);
|
transform: translate(-150%, -40%);
|
||||||
}
|
}
|
||||||
.item {
|
.item {
|
||||||
|
|
@ -152,13 +155,16 @@
|
||||||
left:50%;
|
left:50%;
|
||||||
}
|
}
|
||||||
&.current {
|
&.current {
|
||||||
|
-webkit-transform: translate(-50%, -40%);
|
||||||
transform: translate(-50%, -40%);
|
transform: translate(-50%, -40%);
|
||||||
}
|
}
|
||||||
&.prev {
|
&.prev {
|
||||||
|
-webkit-transform: translate(-150%, -40%);
|
||||||
transform: translate(-150%, -40%);
|
transform: translate(-150%, -40%);
|
||||||
}
|
}
|
||||||
&.next {
|
&.next {
|
||||||
left:100%;
|
left:100%;
|
||||||
|
-webkit-transform: translate(100%, -40%);
|
||||||
transform: translate(100%, -40%);
|
transform: translate(100%, -40%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -170,6 +176,7 @@
|
||||||
button {
|
button {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
|
-webkit-transform: translateY(-50%);
|
||||||
transform: translateY(-50%);
|
transform: translateY(-50%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -379,6 +386,7 @@
|
||||||
.bit-address {
|
.bit-address {
|
||||||
.item{
|
.item{
|
||||||
top: 40%;
|
top: 40%;
|
||||||
|
-webkit-transform: translateY(-40%);
|
||||||
transform: translateY(-40%);
|
transform: translateY(-40%);
|
||||||
font-size:1rem;
|
font-size:1rem;
|
||||||
}
|
}
|
||||||
|
|
@ -417,6 +425,7 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
.card {
|
.card {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
-webkit-transform: scale(1);
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
&:before {
|
&:before {
|
||||||
|
|
@ -445,6 +454,7 @@
|
||||||
margin: 1.5rem auto 0;
|
margin: 1.5rem auto 0;
|
||||||
position: relative;
|
position: relative;
|
||||||
opacity: .5;
|
opacity: .5;
|
||||||
|
-webkit-transform:scale(.85);
|
||||||
transform:scale(.85);
|
transform:scale(.85);
|
||||||
transition:transform .2s ease;
|
transition:transform .2s ease;
|
||||||
.item {
|
.item {
|
||||||
|
|
|
||||||
|
|
@ -152,6 +152,7 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 500px;
|
height: 500px;
|
||||||
|
-webkit-transform: translateY(-499px);
|
||||||
transform: translateY(-499px);
|
transform: translateY(-499px);
|
||||||
|
|
||||||
&.collapsible {
|
&.collapsible {
|
||||||
|
|
@ -161,6 +162,7 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 200px;
|
height: 200px;
|
||||||
|
-webkit-transform: translateY(100px);
|
||||||
transform: translateY(100px);
|
transform: translateY(100px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -180,6 +182,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&__balance {
|
&__balance {
|
||||||
|
-webkit-transform: scale3d(1, 1, 1) translateY(45px);
|
||||||
transform: scale3d(1, 1, 1) translateY(45px);
|
transform: scale3d(1, 1, 1) translateY(45px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue