Diffstat (limited to 'frontend/delta/less/web/overlay.less') (more/less context) (ignore whitespace changes)
-rw-r--r-- | frontend/delta/less/web/overlay.less | 157 |
1 files changed, 0 insertions, 157 deletions
diff --git a/frontend/delta/less/web/overlay.less b/frontend/delta/less/web/overlay.less deleted file mode 100644 index bac3ca3..0000000 --- a/frontend/delta/less/web/overlay.less +++ b/dev/null | |||
@@ -1,157 +0,0 @@ | |||
1 | @import "mixin"; | ||
2 | |||
3 | div.overlay { | ||
4 | z-index: 99999; | ||
5 | position: fixed; | ||
6 | top: 50%; | ||
7 | left: 50%; | ||
8 | width: 200px; | ||
9 | height: 200px; | ||
10 | margin-left: -100px; | ||
11 | margin-top: -100px; | ||
12 | background: rgba(0,0,0,0.8); | ||
13 | .border-radius(20px); | ||
14 | |||
15 | .title { | ||
16 | color: #FFF; | ||
17 | font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; | ||
18 | font-weight: bold; | ||
19 | text-align: center; | ||
20 | display: block; | ||
21 | font-size: 26px; | ||
22 | position: absolute; | ||
23 | bottom: 30px; | ||
24 | left: 0; | ||
25 | width: 100%; | ||
26 | } | ||
27 | |||
28 | .icon { | ||
29 | position: relative; | ||
30 | display: inline-block; | ||
31 | width: 128px; | ||
32 | height: 128px; | ||
33 | top: 40%; | ||
34 | left: 50%; | ||
35 | margin-left: -64px; | ||
36 | margin-top: -64px; | ||
37 | |||
38 | text-align: center; | ||
39 | vertical-align: middle; | ||
40 | |||
41 | .icon-font(); | ||
42 | font-size: 96pt; | ||
43 | color: white; | ||
44 | text-shadow: none; | ||
45 | } | ||
46 | |||
47 | &.ios-overlay-show { | ||
48 | .animation(ios-overlay-show, 750ms); | ||
49 | } | ||
50 | |||
51 | |||
52 | &.ios-overlay-hide { | ||
53 | .animation(ios-overlay-hide, 750ms, forwards); | ||
54 | } | ||
55 | |||
56 | //http://37signals.com/svn/posts/2577-loading-spinner-animation-using-css-and-webkit | ||
57 | div.spinner { | ||
58 | position: relative; | ||
59 | width: 100px; | ||
60 | height: 100px; | ||
61 | left: 50% !important; | ||
62 | top: 40% !important; | ||
63 | |||
64 | margin-left: -50px; | ||
65 | margin-top: -50px; | ||
66 | |||
67 | // display: inline-block; | ||
68 | display: block; | ||
69 | |||
70 | div { | ||
71 | width: 12%; | ||
72 | height: 26%; | ||
73 | background: #ffffff; | ||
74 | position: absolute; | ||
75 | left: 44.5%; | ||
76 | top: 37%; | ||
77 | opacity: 0; | ||
78 | .animation(fade, 1s, linear, infinite); | ||
79 | .border-radius(50px); | ||
80 | .box-shadow(0, 0, 3px, rgba(0,0,0,0.2)); | ||
81 | } | ||
82 | |||
83 | div.bar01 {.transform( 0deg, 0, -142%); .animation-delay(-0.00000s);} | ||
84 | div.bar02 {.transform( 30deg, 0, -142%); .animation-delay(-0.91670s);} | ||
85 | div.bar03 {.transform( 60deg, 0, -142%); .animation-delay(-0.83300s);} | ||
86 | div.bar04 {.transform( 90deg, 0, -142%); .animation-delay(-0.75000s);} | ||
87 | div.bar05 {.transform(120deg, 0, -142%); .animation-delay(-0.66700s);} | ||
88 | div.bar06 {.transform(150deg, 0, -142%); .animation-delay(-0.58330s);} | ||
89 | div.bar07 {.transform(180deg, 0, -142%); .animation-delay(-0.50000s);} | ||
90 | div.bar08 {.transform(210deg, 0, -142%); .animation-delay(-0.41667s);} | ||
91 | div.bar09 {.transform(240deg, 0, -142%); .animation-delay(-0.33300s);} | ||
92 | div.bar10 {.transform(270deg, 0, -142%); .animation-delay(-0.25000s);} | ||
93 | div.bar11 {.transform(300deg, 0, -142%); .animation-delay(-0.16670s);} | ||
94 | div.bar12 {.transform(330deg, 0, -142%); .animation-delay(-0.08330s);} | ||
95 | |||
96 | @-webkit-keyframes fade { | ||
97 | from {opacity: 1;} | ||
98 | to {opacity: 0.25;} | ||
99 | } | ||
100 | @-o-keyframes fade { | ||
101 | from {opacity: 1;} | ||
102 | to {opacity: 0.25;} | ||
103 | } | ||
104 | @keyframes fade { | ||
105 | from {opacity: 1;} | ||
106 | to {opacity: 0.25;} | ||
107 | } | ||
108 | } | ||
109 | } | ||
110 | |||
111 | //======================================================== | ||
112 | |||
113 | @-webkit-keyframes ios-overlay-show { | ||
114 | 0% { opacity: 0; } | ||
115 | 100% { opacity: 1; } | ||
116 | } | ||
117 | @-moz-keyframes ios-overlay-show { | ||
118 | 0% { opacity: 0; } | ||
119 | 100% { opacity: 1; } | ||
120 | } | ||
121 | @-ms-keyframes ios-overlay-show { | ||
122 | 0% { opacity: 0; } | ||
123 | 100% { opacity: 1; } | ||
124 | } | ||
125 | @-o-keyframes ios-overlay-show { | ||
126 | 0% { opacity: 0; } | ||
127 | 100% { opacity: 1; } | ||
128 | } | ||
129 | @keyframes ios-overlay-show { | ||
130 | 0% { opacity: 0; } | ||
131 | 100% { opacity: 1; } | ||
132 | } | ||
133 | |||
134 | //-------------------------------------------------------- | ||
135 | |||
136 | @-webkit-keyframes ios-overlay-hide { | ||
137 | 0% { opacity: 1; } | ||
138 | 100% { opacity: 0; } | ||
139 | } | ||
140 | @-moz-keyframes ios-overlay-hide { | ||
141 | 0% { opacity: 1; } | ||
142 | 100% { opacity: 0; } | ||
143 | } | ||
144 | @-ms-keyframes ios-overlay-hide { | ||
145 | 0% { opacity: 1; } | ||
146 | 100% { opacity: 0; } | ||
147 | } | ||
148 | @-o-keyframes ios-overlay-hide { | ||
149 | 0% { opacity: 1; } | ||
150 | 100% { opacity: 0; } | ||
151 | } | ||
152 | @keyframes ios-overlay-hide { | ||
153 | 0% { opacity: 1; } | ||
154 | 100% { opacity: 0; } | ||
155 | } | ||
156 | |||
157 | //======================================================== | ||