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