blueimp-gallery-rails 2.3.2 → 2.7.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/{vendor → app}/assets/images/error.png +0 -0
- data/{vendor → app}/assets/images/error.svg +0 -0
- data/{vendor → app}/assets/images/loading.gif +0 -0
- data/{vendor → app}/assets/images/play-pause.png +0 -0
- data/{vendor → app}/assets/images/play-pause.svg +0 -0
- data/{vendor → app}/assets/images/video-play.png +0 -0
- data/{vendor → app}/assets/images/video-play.svg +0 -0
- data/app/assets/javascripts/blueimp-gallery-fullscreen.js +85 -0
- data/app/assets/javascripts/blueimp-gallery-indicator.js +153 -0
- data/app/assets/javascripts/blueimp-gallery-jquery.js +5 -0
- data/app/assets/javascripts/blueimp-gallery-standard.js +5 -0
- data/app/assets/javascripts/blueimp-gallery-video.js +156 -0
- data/{vendor → app}/assets/javascripts/blueimp-gallery.js +272 -547
- data/app/assets/javascripts/blueimp-helper.js +187 -0
- data/app/assets/javascripts/jquery.blueimp-gallery.js +75 -0
- data/app/assets/stylesheets/blueimp-gallery-indicator.css +67 -0
- data/app/assets/stylesheets/blueimp-gallery-standard.css +5 -0
- data/app/assets/stylesheets/blueimp-gallery-video.css.erb +69 -0
- data/{vendor → app}/assets/stylesheets/blueimp-gallery.css.erb +26 -93
- data/lib/blueimp-gallery-rails/version.rb +1 -1
- metadata +22 -12
@@ -0,0 +1,187 @@
|
|
1
|
+
/*
|
2
|
+
* blueimp helper JS 1.1.0
|
3
|
+
* https://github.com/blueimp/Gallery
|
4
|
+
*
|
5
|
+
* Copyright 2013, Sebastian Tschan
|
6
|
+
* https://blueimp.net
|
7
|
+
*
|
8
|
+
* Licensed under the MIT license:
|
9
|
+
* http://www.opensource.org/licenses/MIT
|
10
|
+
*/
|
11
|
+
|
12
|
+
/*global define, window, document */
|
13
|
+
|
14
|
+
(function () {
|
15
|
+
'use strict';
|
16
|
+
|
17
|
+
function extend(obj1, obj2) {
|
18
|
+
var prop;
|
19
|
+
for (prop in obj2) {
|
20
|
+
if (obj2.hasOwnProperty(prop)) {
|
21
|
+
obj1[prop] = obj2[prop];
|
22
|
+
}
|
23
|
+
}
|
24
|
+
return obj1;
|
25
|
+
}
|
26
|
+
|
27
|
+
function Helper(query) {
|
28
|
+
if (!this || this.find !== Helper.prototype.find) {
|
29
|
+
// Called as function instead of as constructor,
|
30
|
+
// so we simply return a new instance:
|
31
|
+
return new Helper(query);
|
32
|
+
}
|
33
|
+
this.length = 0;
|
34
|
+
if (query) {
|
35
|
+
if (typeof query === 'string') {
|
36
|
+
query = this.find(query);
|
37
|
+
}
|
38
|
+
if (query.nodeType || query === query.window) {
|
39
|
+
// Single HTML element
|
40
|
+
this.length = 1;
|
41
|
+
this[0] = query;
|
42
|
+
} else {
|
43
|
+
// HTML element collection
|
44
|
+
var i = query.length;
|
45
|
+
this.length = i;
|
46
|
+
while (i) {
|
47
|
+
i -= 1;
|
48
|
+
this[i] = query[i];
|
49
|
+
}
|
50
|
+
}
|
51
|
+
}
|
52
|
+
}
|
53
|
+
|
54
|
+
Helper.extend = extend;
|
55
|
+
|
56
|
+
Helper.contains = function (container, element) {
|
57
|
+
do {
|
58
|
+
element = element.parentNode;
|
59
|
+
if (element === container) {
|
60
|
+
return true;
|
61
|
+
}
|
62
|
+
} while (element);
|
63
|
+
return false;
|
64
|
+
};
|
65
|
+
|
66
|
+
Helper.parseJSON = function (string) {
|
67
|
+
return window.JSON && JSON.parse(string);
|
68
|
+
};
|
69
|
+
|
70
|
+
extend(Helper.prototype, {
|
71
|
+
|
72
|
+
find: function (query) {
|
73
|
+
var container = this[0] || document;
|
74
|
+
if (typeof query === 'string') {
|
75
|
+
if (container.querySelectorAll) {
|
76
|
+
query = container.querySelectorAll(query);
|
77
|
+
} else if (query.charAt(0) === '#') {
|
78
|
+
query = container.getElementById(query.slice(1));
|
79
|
+
} else {
|
80
|
+
query = container.getElementsByTagName(query);
|
81
|
+
}
|
82
|
+
}
|
83
|
+
return new Helper(query);
|
84
|
+
},
|
85
|
+
|
86
|
+
hasClass: function (className) {
|
87
|
+
if (!this[0]) {
|
88
|
+
return false;
|
89
|
+
}
|
90
|
+
return new RegExp('(^|\\s+)' + className +
|
91
|
+
'(\\s+|$)').test(this[0].className);
|
92
|
+
},
|
93
|
+
|
94
|
+
addClass: function (className) {
|
95
|
+
var i = this.length,
|
96
|
+
element;
|
97
|
+
while (i) {
|
98
|
+
i -= 1;
|
99
|
+
element = this[i];
|
100
|
+
if (!element.className) {
|
101
|
+
element.className = className;
|
102
|
+
return this;
|
103
|
+
}
|
104
|
+
if (this.hasClass(className)) {
|
105
|
+
return this;
|
106
|
+
}
|
107
|
+
element.className += ' ' + className;
|
108
|
+
}
|
109
|
+
return this;
|
110
|
+
},
|
111
|
+
|
112
|
+
removeClass: function (className) {
|
113
|
+
var regexp = new RegExp('(^|\\s+)' + className + '(\\s+|$)'),
|
114
|
+
i = this.length,
|
115
|
+
element;
|
116
|
+
while (i) {
|
117
|
+
i -= 1;
|
118
|
+
element = this[i];
|
119
|
+
element.className = element.className.replace(regexp, ' ');
|
120
|
+
}
|
121
|
+
return this;
|
122
|
+
},
|
123
|
+
|
124
|
+
on: function (eventName, handler) {
|
125
|
+
var eventNames = eventName.split(/\s+/),
|
126
|
+
i,
|
127
|
+
element;
|
128
|
+
while (eventNames.length) {
|
129
|
+
eventName = eventNames.shift();
|
130
|
+
i = this.length;
|
131
|
+
while (i) {
|
132
|
+
i -= 1;
|
133
|
+
element = this[i];
|
134
|
+
if (element.addEventListener) {
|
135
|
+
element.addEventListener(eventName, handler, false);
|
136
|
+
} else if (element.attachEvent) {
|
137
|
+
element.attachEvent('on' + eventName, handler);
|
138
|
+
}
|
139
|
+
}
|
140
|
+
}
|
141
|
+
return this;
|
142
|
+
},
|
143
|
+
|
144
|
+
off: function (eventName, handler) {
|
145
|
+
var eventNames = eventName.split(/\s+/),
|
146
|
+
i,
|
147
|
+
element;
|
148
|
+
while (eventNames.length) {
|
149
|
+
eventName = eventNames.shift();
|
150
|
+
i = this.length;
|
151
|
+
while (i) {
|
152
|
+
i -= 1;
|
153
|
+
element = this[i];
|
154
|
+
if (element.removeEventListener) {
|
155
|
+
element.removeEventListener(eventName, handler, false);
|
156
|
+
} else if (element.detachEvent) {
|
157
|
+
element.detachEvent('on' + eventName, handler);
|
158
|
+
}
|
159
|
+
}
|
160
|
+
}
|
161
|
+
return this;
|
162
|
+
},
|
163
|
+
|
164
|
+
empty: function () {
|
165
|
+
var i = this.length,
|
166
|
+
element;
|
167
|
+
while (i) {
|
168
|
+
i -= 1;
|
169
|
+
element = this[i];
|
170
|
+
while (element.hasChildNodes()) {
|
171
|
+
element.removeChild(element.lastChild);
|
172
|
+
}
|
173
|
+
}
|
174
|
+
return this;
|
175
|
+
}
|
176
|
+
|
177
|
+
});
|
178
|
+
|
179
|
+
if (typeof define === 'function' && define.amd) {
|
180
|
+
define(function () {
|
181
|
+
return Helper;
|
182
|
+
});
|
183
|
+
} else {
|
184
|
+
window.blueimp = window.blueimp || {};
|
185
|
+
window.blueimp.helper = Helper;
|
186
|
+
}
|
187
|
+
}());
|
@@ -0,0 +1,75 @@
|
|
1
|
+
/*
|
2
|
+
* blueimp Gallery jQuery plugin 1.1.0
|
3
|
+
* https://github.com/blueimp/Gallery
|
4
|
+
*
|
5
|
+
* Copyright 2013, Sebastian Tschan
|
6
|
+
* https://blueimp.net
|
7
|
+
*
|
8
|
+
* Licensed under the MIT license:
|
9
|
+
* http://www.opensource.org/licenses/MIT
|
10
|
+
*/
|
11
|
+
|
12
|
+
/*global define, window, document */
|
13
|
+
|
14
|
+
(function (factory) {
|
15
|
+
'use strict';
|
16
|
+
if (typeof define === 'function' && define.amd) {
|
17
|
+
define([
|
18
|
+
'jquery',
|
19
|
+
'./blueimp-gallery.js'
|
20
|
+
], factory);
|
21
|
+
} else {
|
22
|
+
factory(
|
23
|
+
window.jQuery,
|
24
|
+
window.blueimp.Gallery
|
25
|
+
);
|
26
|
+
}
|
27
|
+
}(function ($, Gallery) {
|
28
|
+
'use strict';
|
29
|
+
|
30
|
+
// Global click handler to open links with data-gallery attribute
|
31
|
+
// in the Gallery lightbox:
|
32
|
+
$(document.body).on('click', '[data-gallery]', function (event) {
|
33
|
+
// Get the container id from the data-gallery attribute:
|
34
|
+
var id = $(this).data('gallery'),
|
35
|
+
widget = $(id),
|
36
|
+
container = (widget.length && widget) ||
|
37
|
+
$(Gallery.prototype.options.container),
|
38
|
+
options = $.extend(
|
39
|
+
// Retrieve custom options from data-attributes
|
40
|
+
// on the Gallery widget:
|
41
|
+
container.data(),
|
42
|
+
{
|
43
|
+
container: container[0],
|
44
|
+
index: this,
|
45
|
+
event: event,
|
46
|
+
onopen: function () {
|
47
|
+
container
|
48
|
+
.data('gallery', this)
|
49
|
+
.trigger('open', arguments);
|
50
|
+
},
|
51
|
+
onslide: function () {
|
52
|
+
container.trigger('slide', arguments);
|
53
|
+
},
|
54
|
+
onslideend: function () {
|
55
|
+
container.trigger('slideend', arguments);
|
56
|
+
},
|
57
|
+
onslidecomplete: function () {
|
58
|
+
container.trigger('slidecomplete', arguments);
|
59
|
+
},
|
60
|
+
onclose: function () {
|
61
|
+
container
|
62
|
+
.trigger('close')
|
63
|
+
.removeData('gallery');
|
64
|
+
}
|
65
|
+
}
|
66
|
+
),
|
67
|
+
// Select all links with the same data-gallery attribute:
|
68
|
+
links = $('[data-gallery="' + id + '"]');
|
69
|
+
if (options.filter) {
|
70
|
+
links = links.filter(options.filter);
|
71
|
+
}
|
72
|
+
return new Gallery(links, options);
|
73
|
+
});
|
74
|
+
|
75
|
+
}));
|
@@ -0,0 +1,67 @@
|
|
1
|
+
@charset 'UTF-8';
|
2
|
+
/*
|
3
|
+
* blueimp Gallery Indicator CSS 1.0.0
|
4
|
+
* https://github.com/blueimp/Gallery
|
5
|
+
*
|
6
|
+
* Copyright 2013, Sebastian Tschan
|
7
|
+
* https://blueimp.net
|
8
|
+
*
|
9
|
+
* Licensed under the MIT license:
|
10
|
+
* http://www.opensource.org/licenses/MIT
|
11
|
+
*/
|
12
|
+
|
13
|
+
.blueimp-gallery > .indicator {
|
14
|
+
position: absolute;
|
15
|
+
top: auto;
|
16
|
+
right: 15px;
|
17
|
+
bottom: 15px;
|
18
|
+
left: 15px;
|
19
|
+
margin: 0 40px;
|
20
|
+
padding: 0;
|
21
|
+
list-style: none;
|
22
|
+
text-align: center;
|
23
|
+
line-height: 10px;
|
24
|
+
display: none;
|
25
|
+
}
|
26
|
+
.blueimp-gallery > .indicator > li {
|
27
|
+
display: inline-block;
|
28
|
+
width: 9px;
|
29
|
+
height: 9px;
|
30
|
+
margin: 6px 3px 0 3px;
|
31
|
+
border: 1px solid transparent;
|
32
|
+
background: #ccc;
|
33
|
+
background: rgba(255, 255, 255, 0.25) center no-repeat;
|
34
|
+
border-radius: 5px;
|
35
|
+
box-shadow: 0 0 2px #000;
|
36
|
+
opacity: 0.5;
|
37
|
+
cursor: pointer;
|
38
|
+
}
|
39
|
+
.blueimp-gallery > .indicator > .active {
|
40
|
+
background-color: #fff;
|
41
|
+
border-color: #fff;
|
42
|
+
opacity: 0.8;
|
43
|
+
}
|
44
|
+
.blueimp-gallery-controls > .indicator {
|
45
|
+
display: block;
|
46
|
+
/* Fix z-index issues (controls behind slide element) on Android: */
|
47
|
+
-webkit-transform: translateZ(0);
|
48
|
+
-moz-transform: translateZ(0);
|
49
|
+
-ms-transform: translateZ(0);
|
50
|
+
-o-transform: translateZ(0);
|
51
|
+
transform: translateZ(0);
|
52
|
+
}
|
53
|
+
.blueimp-gallery-single > .indicator {
|
54
|
+
display: none;
|
55
|
+
}
|
56
|
+
.blueimp-gallery > .indicator {
|
57
|
+
-webkit-user-select: none;
|
58
|
+
-khtml-user-select: none;
|
59
|
+
-moz-user-select: none;
|
60
|
+
-ms-user-select: none;
|
61
|
+
user-select: none;
|
62
|
+
}
|
63
|
+
|
64
|
+
/* IE7 fixes */
|
65
|
+
*+html .blueimp-gallery > .indicator > li {
|
66
|
+
display: inline;
|
67
|
+
}
|
@@ -0,0 +1,69 @@
|
|
1
|
+
@charset 'UTF-8';
|
2
|
+
/*
|
3
|
+
* blueimp Gallery Video Factory CSS 1.0.0
|
4
|
+
* https://github.com/blueimp/Gallery
|
5
|
+
*
|
6
|
+
* Copyright 2013, Sebastian Tschan
|
7
|
+
* https://blueimp.net
|
8
|
+
*
|
9
|
+
* Licensed under the MIT license:
|
10
|
+
* http://www.opensource.org/licenses/MIT
|
11
|
+
*/
|
12
|
+
|
13
|
+
.blueimp-gallery > .slides > .slide > .video-content > video,
|
14
|
+
.blueimp-gallery > .slides > .slide > .video-content > img {
|
15
|
+
position: absolute;
|
16
|
+
top: 0;
|
17
|
+
right: 0;
|
18
|
+
bottom: 0;
|
19
|
+
left: 0;
|
20
|
+
/* Prevent artifacts in Mozilla Firefox: */
|
21
|
+
-moz-backface-visibility: hidden;
|
22
|
+
}
|
23
|
+
.blueimp-gallery > .slides > .slide > .video-content > video,
|
24
|
+
.blueimp-gallery > .slides > .slide > .video-content > img {
|
25
|
+
margin: auto;
|
26
|
+
max-width: 100%;
|
27
|
+
max-height: 100%;
|
28
|
+
opacity: 1;
|
29
|
+
}
|
30
|
+
.blueimp-gallery > .slides > .slide > .video-content > a {
|
31
|
+
position: absolute;
|
32
|
+
top: 50%;
|
33
|
+
right: 0;
|
34
|
+
left: 0;
|
35
|
+
margin: -64px auto 0;
|
36
|
+
width: 128px;
|
37
|
+
height: 128px;
|
38
|
+
background: url(<%= image_path("video-play.png") %>) center no-repeat;
|
39
|
+
opacity: 0.8;
|
40
|
+
cursor: pointer;
|
41
|
+
}
|
42
|
+
.blueimp-gallery > .slides > .slide > .video-playing > a,
|
43
|
+
.blueimp-gallery > .slides > .slide > .video-playing > img {
|
44
|
+
display: none;
|
45
|
+
}
|
46
|
+
.blueimp-gallery > .slides > .slide > .video-content > video {
|
47
|
+
display: none;
|
48
|
+
}
|
49
|
+
.blueimp-gallery > .slides > .slide > .video-playing > video {
|
50
|
+
display: block;
|
51
|
+
}
|
52
|
+
.blueimp-gallery > .slides > .slide > .video-loading > a {
|
53
|
+
background: url(<%= image_path("loading.gif") %>) center no-repeat;
|
54
|
+
background-size: 64px 64px;
|
55
|
+
}
|
56
|
+
|
57
|
+
/* Replace PNGs with SVGs for capable browsers (excluding IE<9) */
|
58
|
+
body:last-child .blueimp-gallery > .slides > .slide > .video-content > a {
|
59
|
+
background-image: url(<%= image_path("video-play.svg") %>);
|
60
|
+
}
|
61
|
+
|
62
|
+
/* IE7 fixes */
|
63
|
+
*+html .blueimp-gallery > .slides > .slide > .video-content {
|
64
|
+
height: 100%;
|
65
|
+
}
|
66
|
+
*+html .blueimp-gallery > .slides > .slide > .video-content > a {
|
67
|
+
left: 50%;
|
68
|
+
margin-left: -64px;
|
69
|
+
}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
@charset 'UTF-8';
|
2
2
|
/*
|
3
|
-
* blueimp Gallery CSS 2.
|
3
|
+
* blueimp Gallery CSS 2.5.0
|
4
4
|
* https://github.com/blueimp/Gallery
|
5
5
|
*
|
6
6
|
* Copyright 2013, Sebastian Tschan
|
@@ -11,9 +11,7 @@
|
|
11
11
|
*/
|
12
12
|
|
13
13
|
.blueimp-gallery,
|
14
|
-
.blueimp-gallery > .slides > .slide > .slide-content
|
15
|
-
.blueimp-gallery > .slides > .slide > .video-content > video,
|
16
|
-
.blueimp-gallery > .slides > .slide > .video-content > img {
|
14
|
+
.blueimp-gallery > .slides > .slide > .slide-content {
|
17
15
|
position: absolute;
|
18
16
|
top: 0;
|
19
17
|
right: 0;
|
@@ -22,9 +20,7 @@
|
|
22
20
|
/* Prevent artifacts in Mozilla Firefox: */
|
23
21
|
-moz-backface-visibility: hidden;
|
24
22
|
}
|
25
|
-
.blueimp-gallery > .slides > .slide > .slide-content
|
26
|
-
.blueimp-gallery > .slides > .slide > .video-content > video,
|
27
|
-
.blueimp-gallery > .slides > .slide > .video-content > img {
|
23
|
+
.blueimp-gallery > .slides > .slide > .slide-content {
|
28
24
|
margin: auto;
|
29
25
|
max-width: 100%;
|
30
26
|
max-height: 100%;
|
@@ -39,6 +35,7 @@
|
|
39
35
|
opacity: 0;
|
40
36
|
visibility: hidden;
|
41
37
|
display: none;
|
38
|
+
-ms-touch-action: none;
|
42
39
|
}
|
43
40
|
.blueimp-gallery-carousel {
|
44
41
|
position: relative;
|
@@ -77,29 +74,7 @@
|
|
77
74
|
-o-transition: opacity 0.5s linear;
|
78
75
|
transition: opacity 0.5s linear;
|
79
76
|
}
|
80
|
-
.blueimp-gallery > .slides > .slide
|
81
|
-
position: absolute;
|
82
|
-
top: 50%;
|
83
|
-
right: 0;
|
84
|
-
left: 0;
|
85
|
-
margin: -64px auto 0;
|
86
|
-
width: 128px;
|
87
|
-
height: 128px;
|
88
|
-
background: url(<%= image_path("video-play.png") %>) center no-repeat;
|
89
|
-
cursor: pointer;
|
90
|
-
}
|
91
|
-
.blueimp-gallery > .slides > .slide > .video-playing > a,
|
92
|
-
.blueimp-gallery > .slides > .slide > .video-playing > img {
|
93
|
-
display: none;
|
94
|
-
}
|
95
|
-
.blueimp-gallery > .slides > .slide > .video-content > video {
|
96
|
-
display: none;
|
97
|
-
}
|
98
|
-
.blueimp-gallery > .slides > .slide > .video-playing > video {
|
99
|
-
display: block;
|
100
|
-
}
|
101
|
-
.blueimp-gallery > .slides > .slide-loading,
|
102
|
-
.blueimp-gallery > .slides > .slide > .video-loading > a {
|
77
|
+
.blueimp-gallery > .slides > .slide-loading {
|
103
78
|
background: url(<%= image_path("loading.gif") %>) center no-repeat;
|
104
79
|
background-size: 64px 64px;
|
105
80
|
}
|
@@ -137,11 +112,6 @@
|
|
137
112
|
opacity: 0.5;
|
138
113
|
cursor: pointer;
|
139
114
|
display: none;
|
140
|
-
-webkit-user-select: none;
|
141
|
-
-khtml-user-select: none;
|
142
|
-
-moz-user-select: none;
|
143
|
-
-ms-user-select: none;
|
144
|
-
user-select: none;
|
145
115
|
}
|
146
116
|
.blueimp-gallery > .next {
|
147
117
|
left: auto;
|
@@ -157,6 +127,7 @@
|
|
157
127
|
line-height: 30px;
|
158
128
|
color: #fff;
|
159
129
|
text-shadow: 0 0 2px #000;
|
130
|
+
opacity: 0.8;
|
160
131
|
display: none;
|
161
132
|
}
|
162
133
|
.blueimp-gallery > .close {
|
@@ -166,7 +137,6 @@
|
|
166
137
|
margin: -15px;
|
167
138
|
font-size: 30px;
|
168
139
|
text-decoration: none;
|
169
|
-
opacity: 0.8;
|
170
140
|
cursor: pointer;
|
171
141
|
}
|
172
142
|
.blueimp-gallery > .play-pause {
|
@@ -177,57 +147,17 @@
|
|
177
147
|
height: 15px;
|
178
148
|
background: url(<%= image_path("play-pause.png") %>) 0 0 no-repeat;
|
179
149
|
cursor: pointer;
|
180
|
-
opacity: 0.
|
150
|
+
opacity: 0.5;
|
181
151
|
display: none;
|
182
152
|
}
|
183
153
|
.blueimp-gallery-playing > .play-pause {
|
184
154
|
background-position: -15px 0;
|
185
155
|
}
|
186
|
-
.blueimp-gallery > .indicator {
|
187
|
-
position: absolute;
|
188
|
-
top: auto;
|
189
|
-
right: 15px;
|
190
|
-
bottom: 15px;
|
191
|
-
left: 15px;
|
192
|
-
margin: 0 40px;
|
193
|
-
padding: 0;
|
194
|
-
list-style: none;
|
195
|
-
text-align: center;
|
196
|
-
line-height: 10px;
|
197
|
-
display: none;
|
198
|
-
}
|
199
|
-
.blueimp-gallery > .indicator > li {
|
200
|
-
display: inline-block;
|
201
|
-
width: 10px;
|
202
|
-
height: 10px;
|
203
|
-
margin: 6px 3px 0 3px;
|
204
|
-
background: #ccc;
|
205
|
-
background: rgba(255, 255, 255, 0.25);
|
206
|
-
border-radius: 5px;
|
207
|
-
box-shadow: 0 0 2px #000;
|
208
|
-
cursor: pointer;
|
209
|
-
}
|
210
|
-
.blueimp-gallery > .indicator > li > img {
|
211
|
-
display: block;
|
212
|
-
width: 10px;
|
213
|
-
height: 10px;
|
214
|
-
border-radius: 5px;
|
215
|
-
opacity: 0.5;
|
216
|
-
}
|
217
|
-
.blueimp-gallery > .indicator > .active {
|
218
|
-
background: #fff;
|
219
|
-
}
|
220
|
-
.blueimp-gallery > .indicator > .active > img {
|
221
|
-
margin: -1px;
|
222
|
-
border: 1px solid #fff;
|
223
|
-
opacity: 1;
|
224
|
-
}
|
225
156
|
.blueimp-gallery-controls > .prev,
|
226
157
|
.blueimp-gallery-controls > .next,
|
227
158
|
.blueimp-gallery-controls > .close,
|
228
159
|
.blueimp-gallery-controls > .title,
|
229
|
-
.blueimp-gallery-controls > .play-pause
|
230
|
-
.blueimp-gallery-controls > .indicator {
|
160
|
+
.blueimp-gallery-controls > .play-pause {
|
231
161
|
display: block;
|
232
162
|
/* Fix z-index issues (controls behind slide element) on Android: */
|
233
163
|
-webkit-transform: translateZ(0);
|
@@ -240,21 +170,34 @@
|
|
240
170
|
.blueimp-gallery-left > .prev,
|
241
171
|
.blueimp-gallery-single > .next,
|
242
172
|
.blueimp-gallery-right > .next,
|
243
|
-
.blueimp-gallery-single > .play-pause
|
244
|
-
.blueimp-gallery-single > .indicator {
|
173
|
+
.blueimp-gallery-single > .play-pause {
|
245
174
|
display: none;
|
246
175
|
}
|
176
|
+
.blueimp-gallery > .slides > .slide > .slide-content,
|
177
|
+
.blueimp-gallery > .prev,
|
178
|
+
.blueimp-gallery > .next,
|
179
|
+
.blueimp-gallery > .close,
|
180
|
+
.blueimp-gallery > .play-pause {
|
181
|
+
-webkit-user-select: none;
|
182
|
+
-khtml-user-select: none;
|
183
|
+
-moz-user-select: none;
|
184
|
+
-ms-user-select: none;
|
185
|
+
user-select: none;
|
186
|
+
}
|
247
187
|
|
248
188
|
/* Replace PNGs with SVGs for capable browsers (excluding IE<9) */
|
249
|
-
body:last-child .blueimp-gallery > .slides > .slide > .video-content > a {
|
250
|
-
background-image: url(<%= image_path("video-play.svg") %>);
|
251
|
-
}
|
252
189
|
body:last-child .blueimp-gallery > .slides > .slide-error {
|
253
190
|
background-image: url(<%= image_path("error.svg") %>);
|
254
191
|
}
|
255
192
|
body:last-child .blueimp-gallery > .play-pause {
|
193
|
+
width: 20px;
|
194
|
+
height: 20px;
|
195
|
+
background-size: 40px 20px;
|
256
196
|
background-image: url(<%= image_path("play-pause.svg") %>);
|
257
197
|
}
|
198
|
+
body:last-child .blueimp-gallery-playing > .play-pause {
|
199
|
+
background-position: -20px 0;
|
200
|
+
}
|
258
201
|
|
259
202
|
@media (max-width: 767px) {
|
260
203
|
.blueimp-gallery-carousel {
|
@@ -270,13 +213,3 @@ body:last-child .blueimp-gallery > .play-pause {
|
|
270
213
|
*+html .blueimp-gallery > .slides > .slide > .slide-content {
|
271
214
|
position: relative;
|
272
215
|
}
|
273
|
-
*+html .blueimp-gallery > .slides > .slide > .video-content {
|
274
|
-
height: 100%;
|
275
|
-
}
|
276
|
-
*+html .blueimp-gallery > .slides > .slide > .video-content > a {
|
277
|
-
left: 50%;
|
278
|
-
margin-left: -64px;
|
279
|
-
}
|
280
|
-
*+html .blueimp-gallery > .indicator > li {
|
281
|
-
display: inline;
|
282
|
-
}
|