1 | .pace { |
---|
2 | -webkit-pointer-events: none; |
---|
3 | pointer-events: none; |
---|
4 | -webkit-user-select: none; |
---|
5 | -moz-user-select: none; |
---|
6 | user-select: none; |
---|
7 | } |
---|
8 | |
---|
9 | .pace-inactive { |
---|
10 | display: none; |
---|
11 | } |
---|
12 | |
---|
13 | .pace .pace-progress { |
---|
14 | background: #fff; |
---|
15 | position: fixed; |
---|
16 | z-index: 2000; |
---|
17 | top: 0; |
---|
18 | right: 100%; |
---|
19 | width: 100%; |
---|
20 | height: 2px; |
---|
21 | } |
---|
22 | |
---|
23 | .pace .pace-progress-inner { |
---|
24 | display: block; |
---|
25 | position: absolute; |
---|
26 | right: 0px; |
---|
27 | width: 100px; |
---|
28 | height: 100%; |
---|
29 | box-shadow: 0 0 10px #fff, 0 0 5px #fff; |
---|
30 | opacity: 1.0; |
---|
31 | -webkit-transform: rotate(3deg) translate(0px, -4px); |
---|
32 | -moz-transform: rotate(3deg) translate(0px, -4px); |
---|
33 | -ms-transform: rotate(3deg) translate(0px, -4px); |
---|
34 | -o-transform: rotate(3deg) translate(0px, -4px); |
---|
35 | transform: rotate(3deg) translate(0px, -4px); |
---|
36 | } |
---|
37 | |
---|
38 | .pace .pace-activity { |
---|
39 | display: block; |
---|
40 | position: fixed; |
---|
41 | z-index: 2000; |
---|
42 | top: 15px; |
---|
43 | right: 50%; |
---|
44 | width: 14px; |
---|
45 | height: 14px; |
---|
46 | border: solid 2px transparent; |
---|
47 | border-top-color: #fff; |
---|
48 | border-left-color: #fff; |
---|
49 | border-radius: 10px; |
---|
50 | -webkit-animation: pace-spinner 400ms linear infinite; |
---|
51 | -moz-animation: pace-spinner 400ms linear infinite; |
---|
52 | -ms-animation: pace-spinner 400ms linear infinite; |
---|
53 | -o-animation: pace-spinner 400ms linear infinite; |
---|
54 | animation: pace-spinner 400ms linear infinite; |
---|
55 | } |
---|
56 | |
---|
57 | @media (max-width: 767px) { |
---|
58 | .pace .pace-activity { |
---|
59 | top: 15px; |
---|
60 | right: 15px; |
---|
61 | width: 14px; |
---|
62 | height: 14px; |
---|
63 | } |
---|
64 | } |
---|
65 | |
---|
66 | @-webkit-keyframes pace-spinner { |
---|
67 | 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } |
---|
68 | 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } |
---|
69 | } |
---|
70 | @-moz-keyframes pace-spinner { |
---|
71 | 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); } |
---|
72 | 100% { -moz-transform: rotate(360deg); transform: rotate(360deg); } |
---|
73 | } |
---|
74 | @-o-keyframes pace-spinner { |
---|
75 | 0% { -o-transform: rotate(0deg); transform: rotate(0deg); } |
---|
76 | 100% { -o-transform: rotate(360deg); transform: rotate(360deg); } |
---|
77 | } |
---|
78 | @-ms-keyframes pace-spinner { |
---|
79 | 0% { -ms-transform: rotate(0deg); transform: rotate(0deg); } |
---|
80 | 100% { -ms-transform: rotate(360deg); transform: rotate(360deg); } |
---|
81 | } |
---|
82 | @keyframes pace-spinner { |
---|
83 | 0% { transform: rotate(0deg); transform: rotate(0deg); } |
---|
84 | 100% { transform: rotate(360deg); transform: rotate(360deg); } |
---|
85 | } |
---|