diff options
Diffstat (limited to 'client/src/app/+signup/shared/signup-success.component.scss')
-rw-r--r-- | client/src/app/+signup/shared/signup-success.component.scss | 76 |
1 files changed, 76 insertions, 0 deletions
diff --git a/client/src/app/+signup/shared/signup-success.component.scss b/client/src/app/+signup/shared/signup-success.component.scss new file mode 100644 index 000000000..fbc27c8bc --- /dev/null +++ b/client/src/app/+signup/shared/signup-success.component.scss | |||
@@ -0,0 +1,76 @@ | |||
1 | svg { | ||
2 | width: 100px; | ||
3 | display: block; | ||
4 | margin: 40px auto 0; | ||
5 | } | ||
6 | |||
7 | .path { | ||
8 | stroke-dasharray: 1000; | ||
9 | stroke-dashoffset: 0; | ||
10 | |||
11 | &.circle { | ||
12 | -webkit-animation: dash .9s ease-in-out; | ||
13 | animation: dash .9s ease-in-out; | ||
14 | } | ||
15 | |||
16 | &.line { | ||
17 | stroke-dashoffset: 1000; | ||
18 | -webkit-animation: dash .9s .35s ease-in-out forwards; | ||
19 | animation: dash .9s .35s ease-in-out forwards; | ||
20 | } | ||
21 | |||
22 | &.check { | ||
23 | stroke-dashoffset: -100; | ||
24 | -webkit-animation: dash-check .9s .35s ease-in-out forwards; | ||
25 | animation: dash-check .9s .35s ease-in-out forwards; | ||
26 | } | ||
27 | } | ||
28 | |||
29 | .bottom-message { | ||
30 | text-align: center; | ||
31 | margin: 20px 0 60px; | ||
32 | font-size: 1.25em; | ||
33 | color: #73AF55; | ||
34 | } | ||
35 | |||
36 | .alert { | ||
37 | font-size: 15px; | ||
38 | text-align: center; | ||
39 | } | ||
40 | |||
41 | |||
42 | @-webkit-keyframes dash { | ||
43 | 0% { | ||
44 | stroke-dashoffset: 1000; | ||
45 | } | ||
46 | 100% { | ||
47 | stroke-dashoffset: 0; | ||
48 | } | ||
49 | } | ||
50 | |||
51 | @keyframes dash { | ||
52 | 0% { | ||
53 | stroke-dashoffset: 1000; | ||
54 | } | ||
55 | 100% { | ||
56 | stroke-dashoffset: 0; | ||
57 | } | ||
58 | } | ||
59 | |||
60 | @-webkit-keyframes dash-check { | ||
61 | 0% { | ||
62 | stroke-dashoffset: -100; | ||
63 | } | ||
64 | 100% { | ||
65 | stroke-dashoffset: 900; | ||
66 | } | ||
67 | } | ||
68 | |||
69 | @keyframes dash-check { | ||
70 | 0% { | ||
71 | stroke-dashoffset: -100; | ||
72 | } | ||
73 | 100% { | ||
74 | stroke-dashoffset: 900; | ||
75 | } | ||
76 | } | ||