magnificpopup-rails 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
data/LICENSE.txt ADDED
@@ -0,0 +1,22 @@
1
+ Copyright (c) 2013 Rene Vallecillo
2
+
3
+ MIT License
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,29 @@
1
+ # Magnificpopup::Rails
2
+
3
+ TODO: Write a gem description
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ gem 'magnificpopup-rails'
10
+
11
+ And then execute:
12
+
13
+ $ bundle
14
+
15
+ Or install it yourself as:
16
+
17
+ $ gem install magnificpopup-rails
18
+
19
+ ## Usage
20
+
21
+ TODO: Write usage instructions here
22
+
23
+ ## Contributing
24
+
25
+ 1. Fork it
26
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
27
+ 3. Commit your changes (`git commit -am 'Add some feature'`)
28
+ 4. Push to the branch (`git push origin my-new-feature`)
29
+ 5. Create new Pull Request
@@ -0,0 +1,5 @@
1
+ module Magnificpopup
2
+ module Rails
3
+ VERSION = "0.0.1"
4
+ end
5
+ end
@@ -0,0 +1,9 @@
1
+ require "magnificpopup/rails/version"
2
+
3
+ module Magnificpopup
4
+ module Rails
5
+ # Your code goes here...
6
+ class Engine < ::Rails::Engine
7
+ end
8
+ end
9
+ end
@@ -0,0 +1,396 @@
1
+ /* Magnific Popup CSS */
2
+ .mfp-bg {
3
+ top: 0;
4
+ left: 0;
5
+ width: 100%;
6
+ height: 100%;
7
+ z-index: 1042;
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: 1043;
20
+ position: fixed;
21
+ outline: none !important;
22
+ -webkit-backface-visibility: hidden; }
23
+
24
+ .mfp-container {
25
+ text-align: center;
26
+ position: absolute;
27
+ width: 100%;
28
+ height: 100%;
29
+ left: 0;
30
+ top: 0;
31
+ padding: 0 8px;
32
+ -webkit-box-sizing: border-box;
33
+ -moz-box-sizing: border-box;
34
+ box-sizing: border-box; }
35
+
36
+ .mfp-container:before {
37
+ content: '';
38
+ display: inline-block;
39
+ height: 100%;
40
+ vertical-align: middle; }
41
+
42
+ .mfp-align-top .mfp-container:before {
43
+ display: none; }
44
+
45
+ .mfp-content {
46
+ position: relative;
47
+ display: inline-block;
48
+ vertical-align: middle;
49
+ margin: 0 auto;
50
+ text-align: left;
51
+ z-index: 1045; }
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 !important; }
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
+ z-index: 1044; }
100
+
101
+ .mfp-preloader a {
102
+ color: #cccccc; }
103
+
104
+ .mfp-preloader a:hover {
105
+ color: white; }
106
+
107
+ .mfp-s-ready .mfp-preloader {
108
+ display: none; }
109
+
110
+ .mfp-s-error .mfp-content {
111
+ display: none; }
112
+
113
+ button.mfp-close,
114
+ button.mfp-arrow {
115
+ overflow: visible;
116
+ cursor: pointer;
117
+ background: transparent;
118
+ border: 0;
119
+ -webkit-appearance: none;
120
+ display: block;
121
+ padding: 0;
122
+ z-index: 1046;
123
+ -webkit-box-shadow: none;
124
+ box-shadow: none; }
125
+
126
+ button::-moz-focus-inner {
127
+ padding: 0;
128
+ border: 0; }
129
+
130
+ .mfp-close {
131
+ width: 44px;
132
+ height: 44px;
133
+ line-height: 44px;
134
+ position: absolute;
135
+ right: 0;
136
+ top: 0;
137
+ text-decoration: none;
138
+ text-align: center;
139
+ opacity: 0.65;
140
+ padding: 0 0 18px 10px;
141
+ color: white;
142
+ font-style: normal;
143
+ font-size: 28px;
144
+ font-family: Arial, Baskerville, monospace; }
145
+ .mfp-close:hover, .mfp-close:focus {
146
+ opacity: 1; }
147
+ .mfp-close:active {
148
+ top: 1px; }
149
+
150
+ .mfp-close-btn-in .mfp-close {
151
+ color: #333333; }
152
+
153
+ .mfp-image-holder .mfp-close,
154
+ .mfp-iframe-holder .mfp-close {
155
+ color: white;
156
+ right: -6px;
157
+ text-align: right;
158
+ padding-right: 6px;
159
+ width: 100%; }
160
+
161
+ .mfp-counter {
162
+ position: absolute;
163
+ top: 0;
164
+ right: 0;
165
+ color: #cccccc;
166
+ font-size: 12px;
167
+ line-height: 18px; }
168
+
169
+ .mfp-arrow {
170
+ position: absolute;
171
+ opacity: 0.65;
172
+ margin: 0;
173
+ top: 50%;
174
+ margin-top: -55px;
175
+ padding: 0;
176
+ width: 90px;
177
+ height: 110px;
178
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
179
+
180
+ .mfp-arrow:active {
181
+ margin-top: -54px; }
182
+
183
+ .mfp-arrow:hover,
184
+ .mfp-arrow:focus {
185
+ opacity: 1; }
186
+
187
+ .mfp-arrow:before, .mfp-arrow:after,
188
+ .mfp-arrow .mfp-b,
189
+ .mfp-arrow .mfp-a {
190
+ content: '';
191
+ display: block;
192
+ width: 0;
193
+ height: 0;
194
+ position: absolute;
195
+ left: 0;
196
+ top: 0;
197
+ margin-top: 35px;
198
+ margin-left: 35px;
199
+ border: medium inset transparent; }
200
+ .mfp-arrow:after,
201
+ .mfp-arrow .mfp-a {
202
+ border-top-width: 13px;
203
+ border-bottom-width: 13px;
204
+ top: 8px; }
205
+ .mfp-arrow:before,
206
+ .mfp-arrow .mfp-b {
207
+ border-top-width: 21px;
208
+ border-bottom-width: 21px; }
209
+
210
+ .mfp-arrow-left {
211
+ left: 0; }
212
+ .mfp-arrow-left:after,
213
+ .mfp-arrow-left .mfp-a {
214
+ border-right: 17px solid white;
215
+ margin-left: 31px; }
216
+ .mfp-arrow-left:before,
217
+ .mfp-arrow-left .mfp-b {
218
+ margin-left: 25px;
219
+ border-right: 27px solid #3f3f3f; }
220
+
221
+ .mfp-arrow-right {
222
+ right: 0; }
223
+ .mfp-arrow-right:after,
224
+ .mfp-arrow-right .mfp-a {
225
+ border-left: 17px solid white;
226
+ margin-left: 39px; }
227
+ .mfp-arrow-right:before,
228
+ .mfp-arrow-right .mfp-b {
229
+ border-left: 27px solid #3f3f3f; }
230
+
231
+ .mfp-iframe-holder {
232
+ padding-top: 40px;
233
+ padding-bottom: 40px; }
234
+
235
+ .mfp-iframe-holder .mfp-content {
236
+ line-height: 0;
237
+ width: 100%;
238
+ max-width: 900px; }
239
+
240
+ .mfp-iframe-scaler {
241
+ width: 100%;
242
+ height: 0;
243
+ overflow: hidden;
244
+ padding-top: 56.25%; }
245
+
246
+ .mfp-iframe-scaler iframe {
247
+ position: absolute;
248
+ display: block;
249
+ top: 0;
250
+ left: 0;
251
+ width: 100%;
252
+ height: 100%;
253
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
254
+ background: black; }
255
+
256
+ .mfp-iframe-holder .mfp-close {
257
+ top: -40px; }
258
+
259
+ /* Main image in popup */
260
+ img.mfp-img {
261
+ width: auto;
262
+ max-width: 100%;
263
+ height: auto;
264
+ display: block;
265
+ line-height: 0;
266
+ -webkit-box-sizing: border-box;
267
+ -moz-box-sizing: border-box;
268
+ box-sizing: border-box;
269
+ padding: 40px 0 40px;
270
+ margin: 0 auto; }
271
+
272
+ /* The shadow behind the image */
273
+ .mfp-figure:after {
274
+ content: '';
275
+ position: absolute;
276
+ left: 0;
277
+ top: 40px;
278
+ bottom: 40px;
279
+ display: block;
280
+ right: 0;
281
+ width: auto;
282
+ height: auto;
283
+ z-index: -1;
284
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
285
+ background: #444444; }
286
+
287
+ .mfp-figure {
288
+ line-height: 0; }
289
+
290
+ .mfp-bottom-bar {
291
+ margin-top: -36px;
292
+ position: absolute;
293
+ top: 100%;
294
+ left: 0;
295
+ width: 100%;
296
+ cursor: auto; }
297
+
298
+ .mfp-title {
299
+ text-align: left;
300
+ line-height: 18px;
301
+ color: #f3f3f3;
302
+ word-wrap: break-word;
303
+ padding-right: 36px; }
304
+
305
+ .mfp-figure small {
306
+ color: #bdbdbd;
307
+ display: block;
308
+ font-size: 12px;
309
+ line-height: 14px; }
310
+
311
+ .mfp-image-holder .mfp-content {
312
+ max-width: 100%; }
313
+
314
+ .mfp-gallery .mfp-image-holder .mfp-figure {
315
+ cursor: pointer; }
316
+
317
+ @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
318
+ /**
319
+ * Remove all paddings around the image on small screen
320
+ */
321
+ .mfp-img-mobile .mfp-image-holder {
322
+ padding-left: 0;
323
+ padding-right: 0; }
324
+
325
+ .mfp-img-mobile img.mfp-img {
326
+ padding: 0; }
327
+
328
+ /* The shadow behind the image */
329
+ .mfp-img-mobile .mfp-figure:after {
330
+ top: 0;
331
+ bottom: 0; }
332
+
333
+ .mfp-img-mobile .mfp-bottom-bar {
334
+ background: rgba(0, 0, 0, 0.6);
335
+ bottom: 0;
336
+ margin: 0;
337
+ top: auto;
338
+ padding: 3px 5px;
339
+ position: fixed;
340
+ -webkit-box-sizing: border-box;
341
+ -moz-box-sizing: border-box;
342
+ box-sizing: border-box; }
343
+
344
+ .mfp-img-mobile .mfp-bottom-bar:empty {
345
+ padding: 0; }
346
+
347
+ .mfp-img-mobile .mfp-counter {
348
+ right: 5px;
349
+ top: 3px; }
350
+
351
+ .mfp-img-mobile .mfp-close {
352
+ top: 0;
353
+ right: 0;
354
+ width: 35px;
355
+ height: 35px;
356
+ line-height: 35px;
357
+ background: rgba(0, 0, 0, 0.6);
358
+ position: fixed;
359
+ text-align: center;
360
+ padding: 0; }
361
+
362
+ .mfp-img-mobile .mfp-figure small {
363
+ display: inline;
364
+ margin-left: 5px; } }
365
+ @media all and (max-width: 900px) {
366
+ .mfp-arrow {
367
+ -webkit-transform: scale(0.75);
368
+ transform: scale(0.75); }
369
+
370
+ .mfp-arrow-left {
371
+ -webkit-transform-origin: 0;
372
+ transform-origin: 0; }
373
+
374
+ .mfp-arrow-right {
375
+ -webkit-transform-origin: 100%;
376
+ transform-origin: 100%; }
377
+
378
+ .mfp-container {
379
+ padding-left: 6px;
380
+ padding-right: 6px; } }
381
+ .mfp-ie7 .mfp-img {
382
+ padding: 0; }
383
+ .mfp-ie7 .mfp-bottom-bar {
384
+ width: 600px;
385
+ left: 50%;
386
+ margin-left: -300px;
387
+ margin-top: 5px;
388
+ padding-bottom: 5px; }
389
+ .mfp-ie7 .mfp-container {
390
+ padding: 0; }
391
+ .mfp-ie7 .mfp-content {
392
+ padding-top: 44px; }
393
+ .mfp-ie7 .mfp-close {
394
+ top: 0;
395
+ right: 0;
396
+ padding-top: 0; }