magnific-popup-rails 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1 @@
1
+ //= require ./magnific-popup
@@ -0,0 +1,389 @@
1
+ /* Magnific Popup CSS */
2
+ .mfp-bg {
3
+ top: 0;
4
+ left: 0;
5
+ width: 100%;
6
+ height: 100%;
7
+ z-index: 502;
8
+ overflow: hidden;
9
+ position: fixed;
10
+ background: #0b0b0b;
11
+ opacity: 0.8;
12
+ filter: alpha(opacity=80); }
13
+
14
+ .mfp-wrap {
15
+ top: 0;
16
+ left: 0;
17
+ width: 100%;
18
+ height: 100%;
19
+ z-index: 503;
20
+ position: fixed;
21
+ outline: none !important;
22
+ -webkit-backface-visibility: hidden; }
23
+
24
+ .mfp-container {
25
+ height: 100%;
26
+ text-align: center;
27
+ position: absolute;
28
+ width: 100%;
29
+ height: 100%;
30
+ left: 0;
31
+ top: 0;
32
+ padding: 0 8px;
33
+ -webkit-box-sizing: border-box;
34
+ -moz-box-sizing: border-box;
35
+ box-sizing: border-box; }
36
+
37
+ .mfp-container:before {
38
+ content: '';
39
+ display: inline-block;
40
+ height: 100%;
41
+ vertical-align: middle; }
42
+
43
+ .mfp-align-top .mfp-container:before {
44
+ display: none; }
45
+
46
+ .mfp-content {
47
+ position: relative;
48
+ display: inline-block;
49
+ vertical-align: middle;
50
+ margin: 0 auto;
51
+ text-align: left; }
52
+
53
+ .mfp-inline-holder .mfp-content,
54
+ .mfp-ajax-holder .mfp-content {
55
+ width: 100%;
56
+ cursor: auto; }
57
+
58
+ .mfp-ajax-cur {
59
+ cursor: progress; }
60
+
61
+ .mfp-zoom-out-cur,
62
+ .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
63
+ cursor: -moz-zoom-out;
64
+ cursor: -webkit-zoom-out;
65
+ cursor: zoom-out; }
66
+
67
+ .mfp-zoom {
68
+ cursor: pointer;
69
+ cursor: -webkit-zoom-in;
70
+ cursor: -moz-zoom-in;
71
+ cursor: zoom-in; }
72
+
73
+ .mfp-auto-cursor .mfp-content {
74
+ cursor: auto; }
75
+
76
+ .mfp-close,
77
+ .mfp-arrow,
78
+ .mfp-preloader,
79
+ .mfp-counter {
80
+ -webkit-user-select: none;
81
+ -moz-user-select: none;
82
+ user-select: none; }
83
+
84
+ .mfp-loading.mfp-figure {
85
+ display: none; }
86
+
87
+ .mfp-hide {
88
+ display: none; }
89
+
90
+ .mfp-preloader {
91
+ color: #cccccc;
92
+ position: absolute;
93
+ top: 50%;
94
+ width: auto;
95
+ text-align: center;
96
+ margin-top: -0.8em;
97
+ left: 8px;
98
+ right: 8px; }
99
+
100
+ .mfp-preloader a {
101
+ color: #cccccc; }
102
+
103
+ .mfp-preloader a:hover {
104
+ color: white; }
105
+
106
+ .mfp-s-ready .mfp-preloader {
107
+ display: none; }
108
+
109
+ .mfp-s-error .mfp-content {
110
+ display: none; }
111
+
112
+ button.mfp-close,
113
+ button.mfp-arrow {
114
+ overflow: visible;
115
+ cursor: pointer;
116
+ background: transparent;
117
+ border: 0;
118
+ -webkit-appearance: none;
119
+ display: block;
120
+ padding: 0; }
121
+
122
+ button::-moz-focus-inner {
123
+ padding: 0;
124
+ border: 0; }
125
+
126
+ .mfp-close {
127
+ width: 44px;
128
+ height: 44px;
129
+ line-height: 44px;
130
+ position: absolute;
131
+ right: 0;
132
+ top: 0;
133
+ text-decoration: none;
134
+ text-align: center;
135
+ opacity: 0.65;
136
+ padding: 0 0 18px 10px;
137
+ color: white;
138
+ font-style: normal;
139
+ font-size: 28px;
140
+ font-family: Arial, Baskerville, monospace; }
141
+ .mfp-close:hover, .mfp-close:focus {
142
+ opacity: 1; }
143
+ .mfp-close:active {
144
+ top: 1px; }
145
+
146
+ .mfp-close-btn-in .mfp-close {
147
+ color: #333333; }
148
+
149
+ .mfp-image-holder .mfp-close,
150
+ .mfp-iframe-holder .mfp-close {
151
+ color: white;
152
+ right: -6px;
153
+ text-align: right;
154
+ padding-right: 6px;
155
+ width: 100%; }
156
+
157
+ .mfp-counter {
158
+ position: absolute;
159
+ top: 0;
160
+ right: 0;
161
+ color: #cccccc;
162
+ font-size: 12px;
163
+ line-height: 18px; }
164
+
165
+ .mfp-arrow {
166
+ position: absolute;
167
+ top: 0;
168
+ opacity: 0.65;
169
+ margin: 0;
170
+ top: 50%;
171
+ margin-top: -55px;
172
+ padding: 0;
173
+ width: 90px;
174
+ height: 110px;
175
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
176
+
177
+ .mfp-arrow:active {
178
+ margin-top: -54px; }
179
+
180
+ .mfp-arrow:hover,
181
+ .mfp-arrow:focus {
182
+ opacity: 1; }
183
+
184
+ .mfp-arrow:before, .mfp-arrow:after,
185
+ .mfp-arrow .mfp-b,
186
+ .mfp-arrow .mfp-a {
187
+ content: '';
188
+ display: block;
189
+ width: 0;
190
+ height: 0;
191
+ position: absolute;
192
+ left: 0;
193
+ top: 0;
194
+ margin-top: 35px;
195
+ margin-left: 35px;
196
+ border: solid transparent; }
197
+ .mfp-arrow:after,
198
+ .mfp-arrow .mfp-a {
199
+ opacity: 0.8;
200
+ border-top-width: 12px;
201
+ border-bottom-width: 12px;
202
+ top: 8px; }
203
+ .mfp-arrow:before,
204
+ .mfp-arrow .mfp-b {
205
+ border-top-width: 20px;
206
+ border-bottom-width: 20px; }
207
+
208
+ .mfp-arrow-left {
209
+ left: 0; }
210
+ .mfp-arrow-left:after,
211
+ .mfp-arrow-left .mfp-a {
212
+ border-right: 12px solid black;
213
+ left: 5px; }
214
+ .mfp-arrow-left:before,
215
+ .mfp-arrow-left .mfp-b {
216
+ border-right: 20px solid white; }
217
+
218
+ .mfp-arrow-right {
219
+ right: 0; }
220
+ .mfp-arrow-right:after,
221
+ .mfp-arrow-right .mfp-a {
222
+ border-left: 12px solid black;
223
+ left: 3px; }
224
+ .mfp-arrow-right:before,
225
+ .mfp-arrow-right .mfp-b {
226
+ border-left: 20px solid white; }
227
+
228
+ .mfp-iframe-holder {
229
+ padding-top: 40px;
230
+ padding-bottom: 40px; }
231
+
232
+ .mfp-iframe-holder .mfp-content {
233
+ line-height: 0;
234
+ width: 100%;
235
+ max-width: 900px; }
236
+
237
+ .mfp-iframe-scaler {
238
+ width: 100%;
239
+ height: 0;
240
+ overflow: hidden;
241
+ padding-top: 56.25%; }
242
+
243
+ .mfp-iframe-scaler iframe {
244
+ position: absolute;
245
+ top: -3px;
246
+ left: 0;
247
+ width: 100%;
248
+ height: 100%;
249
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
250
+ background: black; }
251
+
252
+ .mfp-iframe-holder .mfp-close {
253
+ top: -43px; }
254
+
255
+ /* Main image in popup */
256
+ img.mfp-img {
257
+ width: auto;
258
+ max-width: 100%;
259
+ height: auto;
260
+ display: block;
261
+ line-height: 0;
262
+ -webkit-box-sizing: border-box;
263
+ -moz-box-sizing: border-box;
264
+ box-sizing: border-box;
265
+ padding: 40px 0 40px;
266
+ margin: 0 auto; }
267
+
268
+ /* The shadow behind the image */
269
+ .mfp-figure:after {
270
+ content: '';
271
+ position: absolute;
272
+ left: 0;
273
+ top: 40px;
274
+ bottom: 40px;
275
+ display: block;
276
+ right: 0;
277
+ width: auto;
278
+ height: auto;
279
+ z-index: -1;
280
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); }
281
+
282
+ .mfp-figure {
283
+ line-height: 0; }
284
+
285
+ .mfp-bottom-bar {
286
+ margin-top: -36px;
287
+ position: absolute;
288
+ top: 100%;
289
+ left: 0;
290
+ width: 100%;
291
+ cursor: auto; }
292
+
293
+ .mfp-title {
294
+ text-align: left;
295
+ line-height: 18px;
296
+ color: #f3f3f3; }
297
+
298
+ .mfp-figure small {
299
+ color: #bdbdbd;
300
+ display: block;
301
+ font-size: 12px;
302
+ line-height: 14px; }
303
+
304
+ .mfp-image-holder .mfp-content {
305
+ max-width: 100%; }
306
+
307
+ .mfp-gallery .mfp-image-holder .mfp-figure {
308
+ cursor: pointer; }
309
+
310
+ @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
311
+ /**
312
+ * Remove all paddings around the image on small screen
313
+ */
314
+ .mfp-img-mobile .mfp-image-holder {
315
+ padding-left: 0;
316
+ padding-right: 0; }
317
+
318
+ .mfp-img-mobile img.mfp-img {
319
+ padding: 0; }
320
+
321
+ /* The shadow behind the image */
322
+ .mfp-img-mobile .mfp-figure:after {
323
+ top: 0;
324
+ bottom: 0; }
325
+
326
+ .mfp-img-mobile .mfp-bottom-bar {
327
+ background: rgba(0, 0, 0, 0.6);
328
+ bottom: 0;
329
+ margin: 0;
330
+ top: auto;
331
+ padding: 3px 5px;
332
+ position: fixed;
333
+ -webkit-box-sizing: border-box;
334
+ -moz-box-sizing: border-box;
335
+ box-sizing: border-box; }
336
+
337
+ .mfp-img-mobile .mfp-bottom-bar:empty {
338
+ padding: 0; }
339
+
340
+ .mfp-img-mobile .mfp-counter {
341
+ right: 5px;
342
+ top: 3px; }
343
+
344
+ .mfp-img-mobile .mfp-close {
345
+ top: 0;
346
+ right: 0;
347
+ width: 35px;
348
+ height: 35px;
349
+ line-height: 35px;
350
+ background: rgba(0, 0, 0, 0.6);
351
+ position: fixed;
352
+ text-align: center;
353
+ padding: 0; }
354
+
355
+ .mfp-img-mobile .mfp-figure small {
356
+ display: inline;
357
+ margin-left: 5px; } }
358
+ @media all and (max-width: 800px) {
359
+ .mfp-arrow {
360
+ -webkit-transform: scale(0.75);
361
+ transform: scale(0.75); }
362
+
363
+ .mfp-arrow-left {
364
+ -webkit-transform-origin: 0;
365
+ transform-origin: 0; }
366
+
367
+ .mfp-arrow-right {
368
+ -webkit-transform-origin: 100%;
369
+ transform-origin: 100%; }
370
+
371
+ .mfp-container {
372
+ padding-left: 6px;
373
+ padding-right: 6px; } }
374
+ .mfp-ie7 .mfp-img {
375
+ padding: 0; }
376
+ .mfp-ie7 .mfp-bottom-bar {
377
+ width: 600px;
378
+ left: 50%;
379
+ margin-left: -300px;
380
+ margin-top: 5px;
381
+ padding-bottom: 5px; }
382
+ .mfp-ie7 .mfp-container {
383
+ padding: 0; }
384
+ .mfp-ie7 .mfp-content {
385
+ padding-top: 44px; }
386
+ .mfp-ie7 .mfp-close {
387
+ top: 0;
388
+ right: 0;
389
+ padding-top: 0; }
metadata ADDED
@@ -0,0 +1,72 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: magnific-popup-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.1
5
+ platform: ruby
6
+ authors:
7
+ - Joshua Jansen
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2013-05-07 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: rake
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - '>='
18
+ - !ruby/object:Gem::Version
19
+ version: '0'
20
+ type: :development
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - '>='
25
+ - !ruby/object:Gem::Version
26
+ version: '0'
27
+ description: Magnific Popup is a free responsive jQuery lightbox plugin that is focused
28
+ on performance and providing best experience for user with any device
29
+ email:
30
+ - joshua@itflows.nl
31
+ executables: []
32
+ extensions: []
33
+ extra_rdoc_files: []
34
+ files:
35
+ - Gemfile
36
+ - LICENSE
37
+ - README.md
38
+ - Rakefile
39
+ - lib/magnific-popup-rails.rb
40
+ - lib/magnific-popup-rails/engine.rb
41
+ - lib/magnific-popup-rails/version.rb
42
+ - magnific-popup-rails.gemspec
43
+ - vendor/assets/javascripts/magnific-popup-rails/index.js
44
+ - vendor/assets/javascripts/magnific-popup-rails/jquery.magnific-popup.js
45
+ - vendor/assets/stylesheets/magnific-popup-rails/index.css
46
+ - vendor/assets/stylesheets/magnific-popup-rails/magnific-popup.css
47
+ homepage: https://github.com/joshuajansen/magnific-popup-rails
48
+ licenses: []
49
+ metadata: {}
50
+ post_install_message:
51
+ rdoc_options: []
52
+ require_paths:
53
+ - lib
54
+ required_ruby_version: !ruby/object:Gem::Requirement
55
+ requirements:
56
+ - - '>='
57
+ - !ruby/object:Gem::Version
58
+ version: '0'
59
+ required_rubygems_version: !ruby/object:Gem::Requirement
60
+ requirements:
61
+ - - '>='
62
+ - !ruby/object:Gem::Version
63
+ version: '0'
64
+ requirements: []
65
+ rubyforge_project:
66
+ rubygems_version: 2.0.0
67
+ signing_key:
68
+ specification_version: 4
69
+ summary: Magnific Popup displays images before they're completely loaded to take full
70
+ advantage of progressive loading. For in and out transitions CSS3 is used instead
71
+ of slow JavaScript animation.
72
+ test_files: []