clones/FlipClock
1
0
Fork 0
mirror of https://github.com/objectivehtml/FlipClock.git synced 2024-09-21 10:27:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adjust asd animation to fix second half of flip animation on iOS devices.

Browse Source
This commit is contained in:
Ross Huelin 2017-06-26 14:33:18 +01:00
parent 17d9f3f1dd
commit d9ab089acf
3 changed files with 7 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
compiled/flipclock.css
View File

@ -173,9 +173,9 @@
.flip-clock-wrapper .flip { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7); }
.flip-clock-wrapper ul.play li.flip-clock-active {
-webkit-animation: asd 0.5s 0.5s linear both;
-moz-animation: asd 0.5s 0.5s linear both;
animation: asd 0.5s 0.5s linear both;
-webkit-animation: asd 0.01s 0.49s linear both;
-moz-animation: asd 0.01s 0.49s linear both;
animation: asd 0.01s 0.49s linear both;
z-index: 5; }
.flip-clock-divider {
@ -221,9 +221,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }
@ -231,9 +228,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }
@ -241,9 +235,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }
@ -251,9 +242,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }

18
src/flipclock/css/flipclock.css
View File

@ -173,9 +173,9 @@
.flip-clock-wrapper .flip { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7); }
.flip-clock-wrapper ul.play li.flip-clock-active {
-webkit-animation: asd 0.5s 0.5s linear both;
-moz-animation: asd 0.5s 0.5s linear both;
animation: asd 0.5s 0.5s linear both;
-webkit-animation: asd 0.01s 0.49s linear both;
-moz-animation: asd 0.01s 0.49s linear both;
animation: asd 0.01s 0.49s linear both;
z-index: 5; }
.flip-clock-divider {
@ -221,9 +221,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }
@ -231,9 +228,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }
@ -241,9 +235,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }
@ -251,9 +242,6 @@
0% {
z-index: 2; }
20% {
z-index: 4; }
100% {
z-index: 4; } }

5
src/flipclock/css/flipclock.scss
View File

@ -167,7 +167,7 @@
}
.flip-clock-wrapper ul.play li.flip-clock-active {
@include animation(asd .5s .5s linear both);
@include animation(asd .01s .49s linear both);
z-index: 2;
}
@ -214,9 +214,6 @@
0% {
z-index:2;
}
20% {
z-index:4;
}
100% {
z-index:4;
}