Skip to content

Commit ef09fb9

Browse files
fabiandevfabiandev
committed
Update demo
1 parent bd1b488 commit ef09fb9

File tree

5 files changed

+1195
-75296
lines changed

5 files changed

+1195
-75296
lines changed

‎docs/angular.main.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import 'reflect-metadata';
22
import 'zone.js';
3+
import { enableProdMode } from '@angular/core';
34
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
45
import { AppModule } from './angular.module';
56

7+
enableProdMode();
68
platformBrowserDynamic().bootstrapModule(AppModule);

‎docs/assets/animate.css

Lines changed: 170 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,13 @@
11
@charset "UTF-8";
22

33
/*!
4-
* animate.css -http://daneden.me/animate
5-
* Version - 3.6.0
4+
* animate.css -https://daneden.github.io/animate.css/
5+
* Version - 3.7.2
66
* Licensed under the MIT license - http://opensource.org/licenses/MIT
77
*
8-
* Copyright (c) 2018 Daniel Eden
8+
* Copyright (c) 2019 Daniel Eden
99
*/
1010

11-
.animated {
12-
-webkit-animation-duration: 1s;
13-
animation-duration: 1s;
14-
-webkit-animation-fill-mode: both;
15-
animation-fill-mode: both;
16-
}
17-
18-
.animated.infinite {
19-
-webkit-animation-iteration-count: infinite;
20-
animation-iteration-count: infinite;
21-
}
22-
2311
@-webkit-keyframes bounce {
2412
from,
2513
20%,
@@ -678,6 +666,69 @@
678666
transform-origin: center;
679667
}
680668

669+
@-webkit-keyframes heartBeat {
670+
0% {
671+
-webkit-transform: scale(1);
672+
transform: scale(1);
673+
}
674+
675+
14% {
676+
-webkit-transform: scale(1.3);
677+
transform: scale(1.3);
678+
}
679+
680+
28% {
681+
-webkit-transform: scale(1);
682+
transform: scale(1);
683+
}
684+
685+
42% {
686+
-webkit-transform: scale(1.3);
687+
transform: scale(1.3);
688+
}
689+
690+
70% {
691+
-webkit-transform: scale(1);
692+
transform: scale(1);
693+
}
694+
}
695+
696+
@keyframes heartBeat {
697+
0% {
698+
-webkit-transform: scale(1);
699+
transform: scale(1);
700+
}
701+
702+
14% {
703+
-webkit-transform: scale(1.3);
704+
transform: scale(1.3);
705+
}
706+
707+
28% {
708+
-webkit-transform: scale(1);
709+
transform: scale(1);
710+
}
711+
712+
42% {
713+
-webkit-transform: scale(1.3);
714+
transform: scale(1.3);
715+
}
716+
717+
70% {
718+
-webkit-transform: scale(1);
719+
transform: scale(1);
720+
}
721+
}
722+
723+
.heartBeat {
724+
-webkit-animation-name: heartBeat;
725+
animation-name: heartBeat;
726+
-webkit-animation-duration: 1.3s;
727+
animation-duration: 1.3s;
728+
-webkit-animation-timing-function: ease-in-out;
729+
animation-timing-function: ease-in-out;
730+
}
731+
681732
@-webkit-keyframes bounceIn {
682733
from,
683734
20%,
@@ -1850,73 +1901,89 @@
18501901

18511902
@-webkit-keyframes flip {
18521903
from {
1853-
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1854-
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1904+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
1905+
rotate3d(0, 1, 0, -360deg);
1906+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
18551907
-webkit-animation-timing-function: ease-out;
18561908
animation-timing-function: ease-out;
18571909
}
18581910

18591911
40% {
1860-
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1861-
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1912+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1913+
rotate3d(0, 1, 0, -190deg);
1914+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1915+
rotate3d(0, 1, 0, -190deg);
18621916
-webkit-animation-timing-function: ease-out;
18631917
animation-timing-function: ease-out;
18641918
}
18651919

18661920
50% {
1867-
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1868-
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1921+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1922+
rotate3d(0, 1, 0, -170deg);
1923+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1924+
rotate3d(0, 1, 0, -170deg);
18691925
-webkit-animation-timing-function: ease-in;
18701926
animation-timing-function: ease-in;
18711927
}
18721928

18731929
80% {
1874-
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
1875-
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
1930+
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
1931+
rotate3d(0, 1, 0, 0deg);
1932+
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
1933+
rotate3d(0, 1, 0, 0deg);
18761934
-webkit-animation-timing-function: ease-in;
18771935
animation-timing-function: ease-in;
18781936
}
18791937

18801938
to {
1881-
-webkit-transform: perspective(400px);
1882-
transform: perspective(400px);
1939+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
1940+
rotate3d(0, 1, 0, 0deg);
1941+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
18831942
-webkit-animation-timing-function: ease-in;
18841943
animation-timing-function: ease-in;
18851944
}
18861945
}
18871946

18881947
@keyframes flip {
18891948
from {
1890-
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1891-
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
1949+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
1950+
rotate3d(0, 1, 0, -360deg);
1951+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
18921952
-webkit-animation-timing-function: ease-out;
18931953
animation-timing-function: ease-out;
18941954
}
18951955

18961956
40% {
1897-
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1898-
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
1957+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1958+
rotate3d(0, 1, 0, -190deg);
1959+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1960+
rotate3d(0, 1, 0, -190deg);
18991961
-webkit-animation-timing-function: ease-out;
19001962
animation-timing-function: ease-out;
19011963
}
19021964

19031965
50% {
1904-
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1905-
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
1966+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1967+
rotate3d(0, 1, 0, -170deg);
1968+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
1969+
rotate3d(0, 1, 0, -170deg);
19061970
-webkit-animation-timing-function: ease-in;
19071971
animation-timing-function: ease-in;
19081972
}
19091973

19101974
80% {
1911-
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
1912-
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
1975+
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
1976+
rotate3d(0, 1, 0, 0deg);
1977+
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
1978+
rotate3d(0, 1, 0, 0deg);
19131979
-webkit-animation-timing-function: ease-in;
19141980
animation-timing-function: ease-in;
19151981
}
19161982

19171983
to {
1918-
-webkit-transform: perspective(400px);
1919-
transform: perspective(400px);
1984+
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
1985+
rotate3d(0, 1, 0, 0deg);
1986+
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
19201987
-webkit-animation-timing-function: ease-in;
19211988
animation-timing-function: ease-in;
19221989
}
@@ -2185,13 +2252,11 @@
21852252
80% {
21862253
-webkit-transform: skewX(-5deg);
21872254
transform: skewX(-5deg);
2188-
opacity: 1;
21892255
}
21902256

21912257
to {
21922258
-webkit-transform: translate3d(0, 0, 0);
21932259
transform: translate3d(0, 0, 0);
2194-
opacity: 1;
21952260
}
21962261
}
21972262

@@ -2211,13 +2276,11 @@
22112276
80% {
22122277
-webkit-transform: skewX(-5deg);
22132278
transform: skewX(-5deg);
2214-
opacity: 1;
22152279
}
22162280

22172281
to {
22182282
-webkit-transform: translate3d(0, 0, 0);
22192283
transform: translate3d(0, 0, 0);
2220-
opacity: 1;
22212284
}
22222285
}
22232286

@@ -3492,3 +3555,71 @@
34923555
-webkit-animation-name: slideOutUp;
34933556
animation-name: slideOutUp;
34943557
}
3558+
3559+
.animated {
3560+
-webkit-animation-duration: 1s;
3561+
animation-duration: 1s;
3562+
-webkit-animation-fill-mode: both;
3563+
animation-fill-mode: both;
3564+
}
3565+
3566+
.animated.infinite {
3567+
-webkit-animation-iteration-count: infinite;
3568+
animation-iteration-count: infinite;
3569+
}
3570+
3571+
.animated.delay-1s {
3572+
-webkit-animation-delay: 1s;
3573+
animation-delay: 1s;
3574+
}
3575+
3576+
.animated.delay-2s {
3577+
-webkit-animation-delay: 2s;
3578+
animation-delay: 2s;
3579+
}
3580+
3581+
.animated.delay-3s {
3582+
-webkit-animation-delay: 3s;
3583+
animation-delay: 3s;
3584+
}
3585+
3586+
.animated.delay-4s {
3587+
-webkit-animation-delay: 4s;
3588+
animation-delay: 4s;
3589+
}
3590+
3591+
.animated.delay-5s {
3592+
-webkit-animation-delay: 5s;
3593+
animation-delay: 5s;
3594+
}
3595+
3596+
.animated.fast {
3597+
-webkit-animation-duration: 800ms;
3598+
animation-duration: 800ms;
3599+
}
3600+
3601+
.animated.faster {
3602+
-webkit-animation-duration: 500ms;
3603+
animation-duration: 500ms;
3604+
}
3605+
3606+
.animated.slow {
3607+
-webkit-animation-duration: 2s;
3608+
animation-duration: 2s;
3609+
}
3610+
3611+
.animated.slower {
3612+
-webkit-animation-duration: 3s;
3613+
animation-duration: 3s;
3614+
}
3615+
3616+
@media (print), (prefers-reduced-motion: reduce) {
3617+
.animated {
3618+
-webkit-animation-duration: 1ms !important;
3619+
animation-duration: 1ms !important;
3620+
-webkit-transition-duration: 1ms !important;
3621+
transition-duration: 1ms !important;
3622+
-webkit-animation-iteration-count: 1 !important;
3623+
animation-iteration-count: 1 !important;
3624+
}
3625+
}

0 commit comments

Comments
 (0)