pswp-rails 4.1.1.1 → 4.1.1.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,3 +0,0 @@
1
- @import './photoswipe-eskimo/main-settings.scss';
2
- @import './photoswipe-eskimo/main.scss';
3
- @import './photoswipe-eskimo/default-skin/default-skin.scss';
@@ -1,21 +0,0 @@
1
- The MIT License (MIT)
2
-
3
- Copyright (c) 2014-2016 Dmitry Semenov, http://dimsemenov.com
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in
13
- all copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
- THE SOFTWARE.
@@ -1,9 +0,0 @@
1
- $pswp__show-hide-transition-duration: 333ms !default;
2
- $pswp__controls-transition-duration: 333ms !default;
3
- $pswp__background-color: #000 !default;
4
- $pswp__placeholder-color: #222 !default;
5
- $pswp__box-sizing-border-box: true !default; // disable .pswp * { box-sizing:border-box } (in case you already have it in your site css)
6
- $pswp__root-z-index: 1500 !default;
7
- $pswp__assets-path: '' !default; // path to skin assets folder (preloader, PNG and SVG sprite)
8
- $pswp__error-text-color: #CCC !default; // "Image not loaded" text color
9
- $pswp__include-minimal-style: true !default;
@@ -1,194 +0,0 @@
1
- /*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
2
-
3
- /*
4
- Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
5
- */
6
-
7
- // PhotoSwipe uses Autoprefixer, so vendor prefixed are added automatically when needed.
8
-
9
- @import "main-settings";
10
-
11
-
12
- /* pswp = photoswipe */
13
- .pswp {
14
- display: none;
15
- position:absolute;
16
- width: 100%;
17
- height: 100%;
18
- left:0;
19
- top:0;
20
- overflow: hidden;
21
- -ms-touch-action: none;
22
- touch-action: none;
23
- z-index: $pswp__root-z-index;
24
- @include text-size-adjust(100%);
25
- /* create separate layer, to avoid paint on window.onscroll in webkit/blink */
26
- @include backface-visibility(hidden);
27
- outline: none;
28
-
29
- @if $pswp__box-sizing-border-box == true {
30
- * {
31
- @include box-sizing(border-box);
32
- }
33
- }
34
-
35
- img {
36
- max-width: none;
37
- }
38
- }
39
-
40
- /* style is added when JS option showHideOpacity is set to true */
41
- .pswp--animate_opacity {
42
- /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
43
- opacity: 0.001;
44
- will-change:opacity;
45
- /* for open/close transition */
46
- @include transition(opacity $pswp__show-hide-transition-duration cubic-bezier(.4,0,.22,1));
47
- }
48
-
49
- .pswp--open {
50
- display: block;
51
- }
52
-
53
- .pswp--zoom-allowed .pswp__img {
54
- @include cursor(zoom-in);
55
- }
56
-
57
- .pswp--zoomed-in .pswp__img {
58
- @include cursor(grab);
59
- }
60
-
61
- .pswp--dragging .pswp__img {
62
- @include cursor(grabbing);
63
- }
64
-
65
- /*
66
- Background is added as a separate element.
67
- As animating opacity is much faster than animating rgba() background-color.
68
- */
69
- .pswp__bg {
70
- position: absolute;
71
- left: 0;
72
- top: 0;
73
- width: 100%;
74
- height: 100%;
75
- background: $pswp__background-color;
76
- opacity: 0;
77
- @include backface-visibility(hidden);
78
- will-change:opacity;
79
- }
80
-
81
- .pswp__scroll-wrap {
82
- position: absolute;
83
- left: 0;
84
- top: 0;
85
- width: 100%;
86
- height: 100%;
87
- overflow:hidden;
88
- }
89
-
90
- .pswp__container,
91
- .pswp__zoom-wrap {
92
- -ms-touch-action: none;
93
- touch-action: none;
94
- position: absolute;
95
- left: 0;
96
- right: 0;
97
- top: 0;
98
- bottom: 0;
99
- }
100
-
101
- /* Prevent selection and tap highlights */
102
- .pswp__container,
103
- .pswp__img {
104
- @include noselect;
105
- -webkit-tap-highlight-color: rgba(0,0,0,0);
106
- -webkit-touch-callout: none;
107
- }
108
-
109
- .pswp__zoom-wrap {
110
- position: absolute;
111
- width: 100%;
112
- @include transform-origin(left, top);
113
- /* for open/close transition */
114
- @include transition(transform $pswp__show-hide-transition-duration cubic-bezier(.4,0,.22,1));
115
- }
116
-
117
- .pswp__bg {
118
- will-change: opacity;
119
- /* for open/close transition */
120
- @include transition(opacity $pswp__show-hide-transition-duration cubic-bezier(.4,0,.22,1));
121
- }
122
-
123
- .pswp--animated-in {
124
- .pswp__bg,
125
- .pswp__zoom-wrap {
126
- @include transition(none);
127
- }
128
- }
129
-
130
- .pswp__container,
131
- .pswp__zoom-wrap {
132
- @include backface-visibility(hidden);
133
- }
134
-
135
- .pswp__item {
136
- position: absolute;
137
- left: 0;
138
- right: 0;
139
- top: 0;
140
- bottom: 0;
141
- overflow: hidden;
142
- }
143
-
144
- .pswp__img {
145
- position: absolute;
146
- width: auto;
147
- height: auto;
148
- top: 0;
149
- left: 0;
150
- }
151
-
152
- /*
153
- stretched thumbnail or div placeholder element (see below)
154
- style is added to avoid flickering in webkit/blink when layers overlap
155
- */
156
- .pswp__img--placeholder {
157
- @include backface-visibility(hidden);
158
- }
159
-
160
- /*
161
- div element that matches size of large image
162
- large image loads on top of it
163
- */
164
- .pswp__img--placeholder--blank {
165
- background: $pswp__placeholder-color;
166
- }
167
-
168
- .pswp--ie .pswp__img {
169
- width: 100% !important;
170
- height: auto !important;
171
- left: 0;
172
- top: 0;
173
- }
174
-
175
- /*
176
- Error message appears when image is not loaded
177
- (JS option errorMsg controls markup)
178
- */
179
- .pswp__error-msg {
180
- position: absolute;
181
- left: 0;
182
- top: 50%;
183
- width: 100%;
184
- text-align: center;
185
- font-size: 14px;
186
- line-height: 16px;
187
- margin-top: -8px;
188
- color: $pswp__error-text-color;
189
- }
190
-
191
- .pswp__error-msg a {
192
- color: $pswp__error-text-color;
193
- text-decoration: underline;
194
- }
@@ -1,585 +0,0 @@
1
- /*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
2
-
3
- /*
4
-
5
- Contents:
6
-
7
- 1. Buttons
8
- 2. Share modal and links
9
- 3. Index indicator ("1 of X" counter)
10
- 4. Caption
11
- 5. Loading indicator
12
- 6. Additional styles (root element, top bar, idle state, hidden state, etc.)
13
-
14
- */
15
-
16
- // PhotoSwipe uses Autoprefixer, so vendor prefixed are added automatically when needed.
17
-
18
-
19
-
20
- @import "../main-settings";
21
-
22
-
23
- /*
24
-
25
- 1. Buttons
26
-
27
- */
28
-
29
- /* <button> css reset */
30
- .pswp__button {
31
- width: 44px;
32
- height: 44px;
33
- position: relative;
34
- background: none;
35
- @include cursor(pointer);
36
- overflow: visible;
37
- @include appearance(none);
38
- display: block;
39
- border: 0;
40
- padding: 0;
41
- margin: 0;
42
- float: right;
43
- opacity: 0.75;
44
- @include transition(opacity 0.2s);
45
- @include box-shadow(none);
46
-
47
- &:focus,
48
- &:hover {
49
- opacity: 1;
50
- }
51
-
52
- &:active {
53
- outline: none;
54
- opacity: 0.9;
55
- }
56
-
57
- &::-moz-focus-inner {
58
- padding: 0;
59
- border: 0
60
- }
61
- }
62
-
63
- /* pswp__ui--over-close class it added when mouse is over element that should close gallery */
64
- .pswp__ui--over-close .pswp__button--close {
65
- opacity: 1;
66
- }
67
-
68
- .pswp__button,
69
- .pswp__button--arrow--left:before,
70
- .pswp__button--arrow--right:before {
71
- background: asset-data-url('photoswipe/default-skin/default-skin.png') 0 0 no-repeat;
72
- background-size: 264px 88px;
73
- width: 44px;
74
- height: 44px;
75
- }
76
-
77
- @media (-webkit-min-device-pixel-ratio: 1.1), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
78
-
79
- /* Serve SVG sprite if browser supports SVG and resolution is more than 105dpi */
80
- .pswp--svg .pswp__button,
81
- .pswp--svg .pswp__button--arrow--left:before,
82
- .pswp--svg .pswp__button--arrow--right:before {
83
- background-image: asset-data-url('photoswipe/default-skin/default-skin.svg');
84
- }
85
-
86
- .pswp--svg .pswp__button--arrow--left,
87
- .pswp--svg .pswp__button--arrow--right {
88
- background: none;
89
- }
90
- }
91
-
92
- .pswp__button--close {
93
- background-position: 0 -44px;
94
- }
95
-
96
- .pswp__button--share {
97
- background-position: -44px -44px;
98
- }
99
-
100
- .pswp__button--fs {
101
- display: none;
102
- }
103
-
104
- .pswp--supports-fs .pswp__button--fs {
105
- display: block;
106
- }
107
-
108
- .pswp--fs .pswp__button--fs {
109
- background-position: -44px 0;
110
- }
111
-
112
- .pswp__button--zoom {
113
- display: none;
114
- background-position: -88px 0;
115
- }
116
-
117
- .pswp--zoom-allowed .pswp__button--zoom {
118
- display: block;
119
- }
120
-
121
- .pswp--zoomed-in .pswp__button--zoom {
122
- background-position: -132px 0;
123
- }
124
-
125
- /* no arrows on touch screens */
126
- .pswp--touch {
127
- .pswp__button--arrow--left,
128
- .pswp__button--arrow--right {
129
- visibility: hidden;
130
- }
131
- }
132
-
133
- /*
134
- Arrow buttons hit area
135
- (icon is added to :before pseudo-element)
136
- */
137
- .pswp__button--arrow--left,
138
- .pswp__button--arrow--right {
139
- background: none;
140
- top: 50%;
141
- margin-top: -50px;
142
- width: 70px;
143
- height: 100px;
144
- position: absolute;
145
- }
146
-
147
- .pswp__button--arrow--left {
148
- left: 0;
149
- }
150
-
151
- .pswp__button--arrow--right {
152
- right: 0;
153
- }
154
-
155
- .pswp__button--arrow--left:before,
156
- .pswp__button--arrow--right:before {
157
- content: '';
158
- top: 35px;
159
- background-color: rgba(0,0,0,0.3);
160
- height: 30px;
161
- width: 32px;
162
- position: absolute;
163
- }
164
-
165
- .pswp__button--arrow--left:before {
166
- left: 6px;
167
- background-position: -138px -44px;
168
- }
169
-
170
- .pswp__button--arrow--right:before {
171
- right: 6px;
172
- background-position: -94px -44px;
173
- }
174
-
175
-
176
- /*
177
-
178
- 2. Share modal/popup and links
179
-
180
- */
181
-
182
- .pswp__counter,
183
- .pswp__share-modal {
184
- @include noselect;
185
- }
186
-
187
- .pswp__share-modal {
188
- display: block;
189
- background: rgba(0, 0, 0, 0.5);
190
- width: 100%;
191
- height: 100%;
192
- top: 0;
193
- left: 0;
194
- padding: 10px;
195
- position: absolute;
196
- z-index: $pswp__root-z-index + 100;
197
- opacity: 0;
198
- @include transition(opacity 0.25s ease-out);
199
- @include backface-visibility(hidden);
200
- will-change: opacity;
201
- }
202
-
203
- .pswp__share-modal--hidden {
204
- display: none;
205
- }
206
-
207
- .pswp__share-tooltip {
208
- z-index: $pswp__root-z-index + 120;
209
- position: absolute;
210
- background: #FFF;
211
- top: 56px;
212
- @include border-radius(2px);
213
- display: block;
214
- width: auto;
215
- right: 44px;
216
- @include box-shadow(0 2px 5px rgba(0, 0, 0, 0.25));
217
- @include transform(translateY(6px));
218
- @include transition(transform 0.25s);
219
- @include backface-visibility(hidden);
220
- will-change: transform;
221
-
222
- a {
223
- display: block;
224
- padding: 8px 12px;
225
- color: #000;
226
- text-decoration: none;
227
- font-size: 14px;
228
- line-height: 18px;
229
-
230
- &:hover {
231
- text-decoration: none;
232
- color: #000;
233
- }
234
-
235
-
236
- &:first-child {
237
- /* round corners on the first/last list item */
238
- @include border-radius(2px 2px 0 0);
239
- }
240
-
241
- &:last-child {
242
- @include border-radius(0 0 2px 2px);
243
- }
244
- }
245
- }
246
-
247
- .pswp__share-modal--fade-in {
248
- opacity: 1;
249
-
250
- .pswp__share-tooltip {
251
- @include transform(translateY(0));
252
- }
253
- }
254
-
255
- /* increase size of share links on touch devices */
256
- .pswp--touch .pswp__share-tooltip a {
257
- padding: 16px 12px;
258
- }
259
-
260
- a.pswp__share--facebook {
261
- &:before {
262
- content: '';
263
- display: block;
264
- width: 0;
265
- height: 0;
266
- position: absolute;
267
- top: -12px;
268
- right: 15px;
269
- border: 6px solid rgba(0, 0, 0, 0);
270
- border-bottom-color: #FFF;
271
- @include pointer-events(none);
272
-
273
- }
274
-
275
- &:hover {
276
- background: #3E5C9A;
277
- color: #FFF;
278
-
279
- &:before {
280
- border-bottom-color: #3E5C9A;
281
- }
282
- }
283
- }
284
-
285
- a.pswp__share--twitter {
286
- &:hover {
287
- background: #55ACEE;
288
- color: #FFF;
289
- }
290
- }
291
-
292
- a.pswp__share--pinterest {
293
- &:hover {
294
- background: #CCC;
295
- color: #CE272D;
296
- }
297
- }
298
-
299
- a.pswp__share--download {
300
- &:hover {
301
- background: #DDD;
302
- }
303
- }
304
-
305
-
306
- /*
307
-
308
- 3. Index indicator ("1 of X" counter)
309
-
310
- */
311
-
312
- .pswp__counter {
313
- position: absolute;
314
- left: 0;
315
- top: 0;
316
- height: 44px;
317
- font-size: 13px;
318
- line-height: 44px;
319
- color: #FFF;
320
- opacity: 0.75;
321
- padding: 0 10px;
322
- }
323
-
324
-
325
- /*
326
-
327
- 4. Caption
328
-
329
- */
330
-
331
- .pswp__caption {
332
- position: absolute;
333
- left: 0;
334
- bottom: 0;
335
- width: 100%;
336
- min-height: 44px;
337
-
338
- small {
339
- font-size: 11px;
340
- color: #BBB;
341
- }
342
- }
343
-
344
- .pswp__caption__center {
345
- text-align: left;
346
- max-width: 420px;
347
- margin: 0 auto;
348
- font-size: 13px;
349
- padding: 10px;
350
- line-height: 20px;
351
- color: #CCC;
352
- }
353
-
354
- .pswp__caption--empty {
355
- display: none;
356
- }
357
-
358
- /* Fake caption element, used to calculate height of next/prev image */
359
- .pswp__caption--fake {
360
- visibility: hidden;
361
- }
362
-
363
-
364
- /*
365
-
366
- 5. Loading indicator (preloader)
367
-
368
- You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR
369
-
370
- */
371
-
372
- .pswp__preloader {
373
- width: 44px;
374
- height: 44px;
375
- position: absolute;
376
- top: 0;
377
- left: 50%;
378
- margin-left: -22px;
379
- opacity: 0;
380
- @include transition(opacity 0.25s ease-out);
381
- will-change: opacity;
382
- direction: ltr;
383
- }
384
-
385
- .pswp__preloader__icn {
386
- width: 20px;
387
- height: 20px;
388
- margin: 12px;
389
- }
390
-
391
- .pswp__preloader--active {
392
- opacity: 1;
393
-
394
- .pswp__preloader__icn {
395
- /* We use .gif in browsers that don't support CSS animation */
396
- background: asset-data-url('photoswipe/default-skin/preloader.gif') 0 0 no-repeat;
397
- }
398
- }
399
-
400
- .pswp--css_animation {
401
- .pswp__preloader--active {
402
- opacity: 1;
403
-
404
- .pswp__preloader__icn {
405
- @include animation(clockwise 500ms linear infinite);
406
- }
407
-
408
- .pswp__preloader__donut {
409
- @include animation(donut-rotate 1000ms cubic-bezier(.4,0,.22,1) infinite);
410
- }
411
- }
412
-
413
- .pswp__preloader__icn {
414
- background: none;
415
- opacity: 0;
416
- width: 14px;
417
- height: 14px;
418
- position: absolute;
419
- left: 15px;
420
- top: 15px;
421
- margin: 0;
422
- }
423
-
424
-
425
- .pswp__preloader__cut {
426
- /*
427
- The idea of animating inner circle is based on Polymer ("material") loading indicator
428
- by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
429
- */
430
- position: relative;
431
- width: 7px;
432
- height: 14px;
433
- overflow: hidden;
434
- }
435
-
436
- .pswp__preloader__donut {
437
- @include box-sizing(border-box);
438
- width: 14px;
439
- height: 14px;
440
- border: 2px solid #FFF;
441
- @include border-radius(50%);
442
- border-left-color: transparent;
443
- border-bottom-color: transparent;
444
- position: absolute;
445
- top: 0;
446
- left: 0;
447
- background: none;
448
- margin: 0;
449
- }
450
- }
451
-
452
- @media screen and (max-width: 1024px) {
453
- .pswp__preloader {
454
- position: relative;
455
- left: auto;
456
- top: auto;
457
- margin: 0;
458
- float: right;
459
- }
460
- }
461
-
462
- @include keyframes(clockwise) {
463
- 0% { @include transform(rotate(0deg)) }
464
- 100% { @include transform(rotate(360deg)) }
465
- }
466
-
467
- @include keyframes(donut-rotate) {
468
- 0% { @include transform(rotate(0)) }
469
- 50% { @include transform(rotate(-140deg)) }
470
- 100% { @include transform(rotate(0)) }
471
- }
472
-
473
-
474
- /*
475
-
476
- 6. Additional styles
477
-
478
- */
479
-
480
- /* root element of UI */
481
- .pswp__ui {
482
- @include font-smoothing(auto);
483
- visibility: visible;
484
- opacity: 1;
485
- z-index: $pswp__root-z-index + 50;
486
- }
487
-
488
- /* top black bar with buttons and "1 of X" indicator */
489
- .pswp__top-bar {
490
- position: absolute;
491
- left: 0;
492
- top: 0;
493
- height: 44px;
494
- width: 100%;
495
- }
496
-
497
- .pswp__caption,
498
- .pswp__top-bar,
499
- .pswp--has_mouse .pswp__button--arrow--left,
500
- .pswp--has_mouse .pswp__button--arrow--right {
501
- @include backface-visibility(hidden);
502
- will-change: opacity;
503
- @include transition(opacity $pswp__controls-transition-duration cubic-bezier(.4,0,.22,1));
504
- }
505
-
506
- /* pswp--has_mouse class is added only when two subsequent mousemove events occur */
507
- .pswp--has_mouse {
508
- .pswp__button--arrow--left,
509
- .pswp__button--arrow--right {
510
- visibility: visible;
511
- }
512
- }
513
-
514
- .pswp__top-bar,
515
- .pswp__caption {
516
- background-color: rgba(0,0,0,0.5);
517
- }
518
-
519
- /* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
520
- .pswp__ui--fit {
521
- .pswp__top-bar,
522
- .pswp__caption {
523
- background-color: rgba(0,0,0,0.3);
524
- }
525
- }
526
-
527
- /* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
528
-
529
- .pswp__ui--idle {
530
- .pswp__top-bar {
531
- opacity: 0;
532
- }
533
-
534
- .pswp__button--arrow--left,
535
- .pswp__button--arrow--right {
536
- opacity: 0;
537
- }
538
- }
539
-
540
- /*
541
- pswp__ui--hidden class is added when controls are hidden
542
- e.g. when user taps to toggle visibility of controls
543
- */
544
- .pswp__ui--hidden {
545
- .pswp__top-bar,
546
- .pswp__caption,
547
- .pswp__button--arrow--left,
548
- .pswp__button--arrow--right {
549
- /* Force paint & create composition layer for controls. */
550
- opacity: 0.001;
551
- }
552
- }
553
-
554
- /* pswp__ui--one-slide class is added when there is just one item in gallery */
555
- .pswp__ui--one-slide {
556
- .pswp__button--arrow--left,
557
- .pswp__button--arrow--right,
558
- .pswp__counter {
559
- display: none;
560
- }
561
- }
562
-
563
- .pswp__element--disabled {
564
- display: none !important;
565
- }
566
-
567
- @if $pswp__include-minimal-style == true {
568
- .pswp--minimal--dark {
569
- .pswp__top-bar {
570
- background: none;
571
- }
572
- }
573
- }
574
-
575
-
576
-
577
-
578
-
579
-
580
-
581
-
582
-
583
-
584
-
585
-