@@ -17,29 +18,6 @@
{% block late_js %}
{% if album.medias %}
- {% macro img_description(media) -%}
- {%- if media.big -%}
Full size{%- endif -%}
- {# clean up tags and whitespace, including newlines, in the description #}
- {%- if media.description -%}
{{ media.description }}{%- endif -%}
- {%- if media.exif -%}
-
- {%- if media.exif.gps -%}
-
{{ 'N{:.6f}'.format(media.exif.gps.lat) if media.exif.gps.lat > 0 else 'S{:.6f}'.format(-media.exif.gps.lat) }}{{ 'E{:.6f}'.format(media.exif.gps.lon) if media.exif.gps.lon > 0 else 'W{:.6f}'.format(-media.exif.gps.lon) }}
- {%- endif -%}
- {%- if media.exif.Make or media.exif.Model -%}
-
{{ media.exif.Make }} {{ media.exif.Model }}
- {%- endif -%}
- {%- if media.exif.datetime -%}
-
{{ media.exif.datetime }}
- {%- endif -%}
- {% endif %}
- {%- endmacro %}
-
diff --git a/src/sigal/themes/photoswipe/static/app.js b/src/sigal/themes/photoswipe/static/app.js
deleted file mode 100644
index de825ae..0000000
--- a/src/sigal/themes/photoswipe/static/app.js
+++ /dev/null
@@ -1,214 +0,0 @@
-echo.init({
- offset: 100,
- throttle: 250,
- unload: false
-});
-
-var initPhotoSwipeFromDOM = function(gallerySelector) {
-
- // parse slide data (url, title, size ...) from DOM elements
- // (children of gallerySelector)
- var parseThumbnailElements = function(el) {
- var thumbElements = el.childNodes,
- numNodes = thumbElements.length,
- items = [],
- figureEl,
- linkEl,
- size,
- item;
-
- for(var i = 0; i < numNodes; i++) {
-
- figureEl = thumbElements[i]; //
element
-
- // include only element nodes
- if(figureEl.nodeType !== 1) {
- continue;
- }
-
- linkEl = figureEl.children[0]; // element
-
- // create slide object
- if (linkEl.getAttribute('data-type') == 'video') {
- item = {
- html: linkEl.getAttribute('data-video')
- };
- } else {
- size = linkEl.getAttribute('data-size').split('x');
- item = {
- src: linkEl.getAttribute('href'),
- w: parseInt(size[0], 10),
- h: parseInt(size[1], 10)
- };
- }
-
- if(figureEl.children.length > 1) {
- // content
- item.title = figureEl.children[1].innerHTML;
- }
-
- if(linkEl.children.length > 0) {
- // ![]()
thumbnail element, retrieving thumbnail url
- item.msrc = linkEl.children[0].getAttribute('data-echo');
- }
-
- item.el = figureEl; // save link to element for getThumbBoundsFn
- items.push(item);
- }
-
- return items;
- };
-
- // find nearest parent element
- var closest = function closest(el, fn) {
- return el && ( fn(el) ? el : closest(el.parentNode, fn) );
- };
-
- // triggers when user clicks on thumbnail
- var onThumbnailsClick = function(e) {
- e = e || window.event;
- e.preventDefault ? e.preventDefault() : e.returnValue = false;
-
- var eTarget = e.target || e.srcElement;
-
- // find root element of slide
- var clickedListItem = closest(eTarget, function(el) {
- return (el.tagName && el.tagName.toUpperCase() === 'FIGURE');
- });
-
- if(!clickedListItem) {
- return;
- }
-
- // find index of clicked item by looping through all child nodes
- // alternatively, you may define index via data- attribute
- var clickedGallery = clickedListItem.parentNode,
- childNodes = clickedListItem.parentNode.childNodes,
- numChildNodes = childNodes.length,
- nodeIndex = 0,
- index;
-
- for (var i = 0; i < numChildNodes; i++) {
- if(childNodes[i].nodeType !== 1) {
- continue;
- }
-
- if(childNodes[i] === clickedListItem) {
- index = nodeIndex;
- break;
- }
- nodeIndex++;
- }
-
-
-
- if(index >= 0) {
- // open PhotoSwipe if valid index found
- openPhotoSwipe( index, clickedGallery );
- }
- return false;
- };
-
- // parse picture index and gallery index from URL (#&pid=1&gid=2)
- var photoswipeParseHash = function() {
- var hash = window.location.hash.substring(1),
- params = {};
-
- if(hash.length < 5) {
- return params;
- }
-
- var vars = hash.split('&');
- for (var i = 0; i < vars.length; i++) {
- if(!vars[i]) {
- continue;
- }
- var pair = vars[i].split('=');
- if(pair.length < 2) {
- continue;
- }
- params[pair[0]] = pair[1];
- }
-
- if(params.gid) {
- params.gid = parseInt(params.gid, 10);
- }
-
- return params;
- };
-
- var openPhotoSwipe = function(index, galleryElement, disableAnimation, fromURL) {
- var pswpElement = document.querySelectorAll('.pswp')[0],
- gallery,
- options,
- items;
-
- items = parseThumbnailElements(galleryElement);
-
- // define options (if needed)
- options = {
-
- // define gallery index (for URL)
- galleryUID: galleryElement.getAttribute('data-pswp-uid'),
-
- getThumbBoundsFn: function(index) {
- // See Options -> getThumbBoundsFn section of documentation for more info
- var thumbnail = items[index].el.getElementsByTagName('img')[0], // find thumbnail
- pageYScroll = window.pageYOffset || document.documentElement.scrollTop,
- rect = thumbnail.getBoundingClientRect();
-
- return {x:rect.left, y:rect.top + pageYScroll, w:rect.width};
- }
-
- };
-
- // PhotoSwipe opened from URL
- if(fromURL) {
- if(options.galleryPIDs) {
- // parse real index when custom PIDs are used
- // http://photoswipe.com/documentation/faq.html#custom-pid-in-url
- for(var j = 0; j < items.length; j++) {
- if(items[j].pid == index) {
- options.index = j;
- break;
- }
- }
- } else {
- // in URL indexes start from 1
- options.index = parseInt(index, 10) - 1;
- }
- } else {
- options.index = parseInt(index, 10);
- }
-
- // exit if index not found
- if( isNaN(options.index) ) {
- return;
- }
-
- if(disableAnimation) {
- options.showAnimationDuration = 0;
- }
-
- // Pass data to PhotoSwipe and initialize it
- gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, items, options);
- gallery.init();
- };
-
- // loop through all gallery elements and bind events
- var galleryElements = document.querySelectorAll( gallerySelector );
-
- for(var i = 0, l = galleryElements.length; i < l; i++) {
- galleryElements[i].setAttribute('data-pswp-uid', i+1);
- galleryElements[i].onclick = onThumbnailsClick;
- }
-
- // Parse URL and open gallery if it contains #&pid=3&gid=1
- var hashData = photoswipeParseHash();
- if(hashData.pid && hashData.gid) {
- openPhotoSwipe( hashData.pid , galleryElements[ hashData.gid - 1 ], true, true );
- }
-};
-
-// execute above function
-initPhotoSwipeFromDOM('.gallery');
diff --git a/src/sigal/themes/photoswipe/static/default-skin/default-skin.css b/src/sigal/themes/photoswipe/static/default-skin/default-skin.css
deleted file mode 100644
index bc42eba..0000000
--- a/src/sigal/themes/photoswipe/static/default-skin/default-skin.css
+++ /dev/null
@@ -1,485 +0,0 @@
-/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
-/*
-
- Contents:
-
- 1. Buttons
- 2. Share modal and links
- 3. Index indicator ("1 of X" counter)
- 4. Caption
- 5. Loading indicator
- 6. Additional styles (root element, top bar, idle state, hidden state, etc.)
-
-*/
-/*
-
- 1. Buttons
-
- */
-/* ",O.parseShareButtonOut&&(l=O.parseShareButtonOut(e,l));C.children[0].innerHTML=l,C.children[0].onclick=r},U=0,Z=function(){clearTimeout(A),U=0,I&&R.setIdle(!1)},P=function(e){x!==e&&(n(F,"preloader--active",!e),x=e)},q=[{name:"caption",option:"captionEl",onInit:function(e){f=e}},{name:"share-modal",option:"shareEl",onInit:function(e){C=e},onTap:function(){i()}},{name:"button--share",option:"shareEl",onInit:function(e){v=e},onTap:function(){i()}},{name:"button--download",option:"downloadEl",onInit:function(e){_=e},onTap:function(){var e=document.createElement("A");e.setAttribute("href",l.currItem.downloadURL||l.currItem.src||""),e.setAttribute("target","_blank"),e.setAttribute("download",""),_.appendChild(e),e.click(),_.removeChild(e)}},{name:"button--zoom",option:"zoomEl",onTap:l.toggleDesktopZoom},{name:"counter",option:"counterEl",onInit:function(e){w=e}},{name:"button--close",option:"closeEl",onTap:function(){setTimeout(l.close)}},{name:"button--arrow--left",option:"arrowEl",onInit:function(e){b=e},onTap:l.prev},{name:"button--arrow--right",option:"arrowEl",onInit:function(e){g=e},onTap:l.next},{name:"button--fs",option:"fullscreenEl",onTap:function(){p.isFullscreen()?p.exit():p.enter()}},{name:"preloader",option:"preloaderEl",onInit:function(e){F=e}}];R.init=function(){var t;s.extend(l.options,M,!0),O=l.options,m=s.getChildByClass(l.scrollWrap,"pswp__ui"),(E=l.listen)("onVerticalDrag",function(e){z&&e<.95?R.hideControls():!z&&.95<=e&&R.showControls()}),E("onPinchClose",function(e){z&&e<.9?(R.hideControls(),t=!0):t&&!z&&.9 {
+ this.initPswpEvents(lightbox.pswp);
+ });
+ }
+
+ initLightboxEvents(lightbox) {
+ lightbox.on('contentLoad', this.onContentLoad.bind(this));
+ lightbox.on('contentDestroy', this.onContentDestroy.bind(this));
+ lightbox.on('contentActivate', this.onContentActivate.bind(this));
+ lightbox.on('contentDeactivate', this.onContentDeactivate.bind(this));
+ lightbox.on('contentAppend', this.onContentAppend.bind(this));
+ lightbox.on('contentResize', this.onContentResize.bind(this));
+
+ lightbox.addFilter('isKeepingPlaceholder', this.isKeepingPlaceholder.bind(this));
+ lightbox.addFilter('isContentZoomable', this.isContentZoomable.bind(this));
+ lightbox.addFilter('useContentPlaceholder', this.useContentPlaceholder.bind(this));
+
+ lightbox.addFilter('domItemData', (itemData, element, linkEl) => {
+ if (itemData.type === 'video' && linkEl) {
+ if (linkEl.dataset.pswpVideoSources) {
+ itemData.videoSources = JSON.parse(pswpVideoSources);
+ } else if (linkEl.dataset.pswpVideoSrc) {
+ itemData.videoSrc = linkEl.dataset.pswpVideoSrc;
+ } else {
+ itemData.videoSrc = linkEl.href;
+ }
+ }
+ return itemData;
+ });
+ }
+
+ initPswpEvents(pswp) {
+ // Prevent draggin when pointer is in bottom part of the video
+ // todo: add option for this
+ pswp.on('pointerDown', (e) => {
+ const slide = pswp.currSlide;
+ if (isVideoContent(slide) && this.options.preventDragOffset) {
+ const origEvent = e.originalEvent;
+ if (origEvent.type === 'pointerdown') {
+ const videoHeight = Math.ceil(slide.height * slide.currZoomLevel);
+ const verticalEnding = videoHeight + slide.bounds.center.y;
+ const pointerYPos = origEvent.pageY - pswp.offset.y;
+ if (pointerYPos > verticalEnding - this.options.preventDragOffset
+ && pointerYPos < verticalEnding) {
+ e.preventDefault();
+ }
+ }
+ }
+ });
+
+ // do not append video on nearby slides
+ pswp.on('appendHeavy', (e) => {
+ if (isVideoContent(e.slide) && !e.slide.isActive) {
+ e.preventDefault();
+ }
+ });
+
+ pswp.on('close', () => {
+ if (isVideoContent(pswp.currSlide.content)) {
+ // Switch from zoom to fade closing transition,
+ // as zoom transition is choppy for videos
+ if (!pswp.options.showHideAnimationType
+ || pswp.options.showHideAnimationType === 'zoom') {
+ pswp.options.showHideAnimationType = 'fade';
+ }
+
+ // pause video when closing
+ this.pauseVideo(pswp.currSlide.content);
+ }
+ });
+ }
+
+ onContentDestroy({ content }) {
+ if (isVideoContent(content)) {
+ if (content._videoPosterImg) {
+ content._videoPosterImg.onload = content._videoPosterImg.onerror = null;
+ content._videoPosterImg = null;
+ }
+ }
+ }
+
+ onContentResize(e) {
+ if (isVideoContent(e.content)) {
+ e.preventDefault();
+
+ const width = e.width;
+ const height = e.height;
+ const content = e.content;
+
+ if (content.element) {
+ content.element.style.width = width + 'px';
+ content.element.style.height = height + 'px';
+ }
+
+ if (content.slide && content.slide.placeholder) {
+ // override placeholder size, so it more accurately matches the video
+ const placeholderElStyle = content.slide.placeholder.element.style;
+ placeholderElStyle.transform = 'none';
+ placeholderElStyle.width = width + 'px';
+ placeholderElStyle.height = height + 'px';
+ }
+ }
+ }
+
+
+ isKeepingPlaceholder(isZoomable, content) {
+ if (isVideoContent(content)) {
+ return false;
+ }
+ return isZoomable;
+ }
+
+ isContentZoomable(isZoomable, content) {
+ if (isVideoContent(content)) {
+ return false;
+ }
+ return isZoomable;
+ }
+
+ onContentActivate({ content }) {
+ if (isVideoContent(content) && this.options.autoplay) {
+ this.playVideo(content);
+ }
+ }
+
+ onContentDeactivate({ content }) {
+ if (isVideoContent(content)) {
+ this.pauseVideo(content);
+ }
+ }
+
+ onContentAppend(e) {
+ if (isVideoContent(e.content)) {
+ e.preventDefault();
+ e.content.isAttached = true;
+ e.content.appendImage();
+ }
+ }
+
+ onContentLoad(e) {
+ const content = e.content; // todo: videocontent
+
+ if (!isVideoContent(e.content)) {
+ return;
+ }
+
+ // stop default content load
+ e.preventDefault();
+
+ if (content.element) {
+ return;
+ }
+
+ content.state = 'loading';
+ content.type = 'video'; // TODO: move this to pswp core?
+
+ content.element = document.createElement('video');
+
+ if (this.options.videoAttributes) {
+ for(let key in this.options.videoAttributes) {
+ content.element.setAttribute(key, this.options.videoAttributes[key] || '');
+ }
+ }
+
+ content.element.setAttribute('poster', content.data.msrc);
+
+ this.preloadVideoPoster(content, content.data.msrc);
+
+ content.element.style.position = 'absolute';
+ content.element.style.left = 0;
+ content.element.style.top = 0;
+
+ if (content.data.videoSources) {
+ content.data.videoSources.forEach((source) => {
+ let sourceEl = document.createElement('source');
+ sourceEl.src = source.src;
+ sourceEl.type = source.type;
+ content.element.appendChild(sourceEl);
+ });
+ } else if (content.data.videoSrc) {
+ // Force video preload
+ // https://muffinman.io/blog/hack-for-ios-safari-to-display-html-video-thumbnail/
+ // this.element.src = this.data.videoSrc + '#t=0.001';
+ content.element.src = content.data.videoSrc;
+ }
+ }
+
+ preloadVideoPoster(content, src) {
+ if (!content._videoPosterImg && src) {
+ content._videoPosterImg = new Image();
+ content._videoPosterImg.src = src;
+ if (content._videoPosterImg.complete) {
+ content.onLoaded();
+ } else {
+ content._videoPosterImg.onload = content._videoPosterImg.onerror = () => {
+ content.onLoaded();
+ };
+ }
+ }
+ }
+
+
+ playVideo(content) {
+ if (content.element) {
+ content.element.play();
+ }
+ }
+
+ pauseVideo(content) {
+ if (content.element) {
+ content.element.pause();
+ }
+ }
+
+ useContentPlaceholder(usePlaceholder, content) {
+ if (isVideoContent(content)) {
+ return true;
+ }
+ return usePlaceholder;
+ }
+
+}
+
+class PhotoSwipeVideoPlugin {
+ constructor(lightbox, options) {
+ new VideoContentSetup(lightbox, {
+ ...defaultOptions,
+ ...options
+ });
+ }
+}
+
+export { PhotoSwipeVideoPlugin as default };
diff --git a/src/sigal/themes/photoswipe/static/photoswipe-video-plugin.esm.min.js b/src/sigal/themes/photoswipe/static/photoswipe-video-plugin.esm.min.js
new file mode 100644
index 0000000..d7b1182
--- /dev/null
+++ b/src/sigal/themes/photoswipe/static/photoswipe-video-plugin.esm.min.js
@@ -0,0 +1 @@
+const e={videoAttributes:{controls:"",playsinline:"",preload:"auto"},autoplay:!0,preventDragOffset:40};function t(e){return e&&e.data&&"video"===e.data.type}class o{constructor(e,t){this.options=t,this.initLightboxEvents(e),e.on("init",(()=>{this.initPswpEvents(e.pswp)}))}initLightboxEvents(e){e.on("contentLoad",this.onContentLoad.bind(this)),e.on("contentDestroy",this.onContentDestroy.bind(this)),e.on("contentActivate",this.onContentActivate.bind(this)),e.on("contentDeactivate",this.onContentDeactivate.bind(this)),e.on("contentAppend",this.onContentAppend.bind(this)),e.on("contentResize",this.onContentResize.bind(this)),e.addFilter("isKeepingPlaceholder",this.isKeepingPlaceholder.bind(this)),e.addFilter("isContentZoomable",this.isContentZoomable.bind(this)),e.addFilter("useContentPlaceholder",this.useContentPlaceholder.bind(this)),e.addFilter("domItemData",((e,t,o)=>("video"===e.type&&o&&(o.dataset.pswpVideoSources?e.videoSources=JSON.parse(pswpVideoSources):o.dataset.pswpVideoSrc?e.videoSrc=o.dataset.pswpVideoSrc:e.videoSrc=o.href),e)))}initPswpEvents(e){e.on("pointerDown",(o=>{const n=e.currSlide;if(t(n)&&this.options.preventDragOffset){const t=o.originalEvent;if("pointerdown"===t.type){const i=Math.ceil(n.height*n.currZoomLevel)+n.bounds.center.y,s=t.pageY-e.offset.y;s>i-this.options.preventDragOffset&&s{t(e.slide)&&!e.slide.isActive&&e.preventDefault()})),e.on("close",(()=>{t(e.currSlide.content)&&(e.options.showHideAnimationType&&"zoom"!==e.options.showHideAnimationType||(e.options.showHideAnimationType="fade"),this.pauseVideo(e.currSlide.content))}))}onContentDestroy({content:e}){t(e)&&e._videoPosterImg&&(e._videoPosterImg.onload=e._videoPosterImg.onerror=null,e._videoPosterImg=null)}onContentResize(e){if(t(e.content)){e.preventDefault();const t=e.width,o=e.height,n=e.content;if(n.element&&(n.element.style.width=t+"px",n.element.style.height=o+"px"),n.slide&&n.slide.placeholder){const e=n.slide.placeholder.element.style;e.transform="none",e.width=t+"px",e.height=o+"px"}}}isKeepingPlaceholder(e,o){return!t(o)&&e}isContentZoomable(e,o){return!t(o)&&e}onContentActivate({content:e}){t(e)&&this.options.autoplay&&this.playVideo(e)}onContentDeactivate({content:e}){t(e)&&this.pauseVideo(e)}onContentAppend(e){t(e.content)&&(e.preventDefault(),e.content.isAttached=!0,e.content.appendImage())}onContentLoad(e){const o=e.content;if(t(e.content)&&(e.preventDefault(),!o.element)){if(o.state="loading",o.type="video",o.element=document.createElement("video"),this.options.videoAttributes)for(let e in this.options.videoAttributes)o.element.setAttribute(e,this.options.videoAttributes[e]||"");o.element.setAttribute("poster",o.data.msrc),this.preloadVideoPoster(o,o.data.msrc),o.element.style.position="absolute",o.element.style.left=0,o.element.style.top=0,o.data.videoSources?o.data.videoSources.forEach((e=>{let t=document.createElement("source");t.src=e.src,t.type=e.type,o.element.appendChild(t)})):o.data.videoSrc&&(o.element.src=o.data.videoSrc)}}preloadVideoPoster(e,t){!e._videoPosterImg&&t&&(e._videoPosterImg=new Image,e._videoPosterImg.src=t,e._videoPosterImg.complete?e.onLoaded():e._videoPosterImg.onload=e._videoPosterImg.onerror=()=>{e.onLoaded()})}playVideo(e){e.element&&e.element.play()}pauseVideo(e){e.element&&e.element.pause()}useContentPlaceholder(e,o){return!!t(o)||e}}class n{constructor(t,n){new o(t,{...e,...n})}}export{n as default};
diff --git a/src/sigal/themes/photoswipe/static/photoswipe.css b/src/sigal/themes/photoswipe/static/photoswipe.css
index 30be2ab..686dfc3 100644
--- a/src/sigal/themes/photoswipe/static/photoswipe.css
+++ b/src/sigal/themes/photoswipe/static/photoswipe.css
@@ -1,175 +1,420 @@
-/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
+/*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */
+
+.pswp {
+ --pswp-bg: #000;
+ --pswp-placeholder-bg: #222;
+
+
+ --pswp-root-z-index: 100000;
+
+ --pswp-preloader-color: rgba(79, 79, 79, 0.4);
+ --pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
+
+ /* defined via js:
+ --pswp-transition-duration: 333ms; */
+
+ --pswp-icon-color: #fff;
+ --pswp-icon-color-secondary: #4f4f4f;
+ --pswp-icon-stroke-color: #4f4f4f;
+ --pswp-icon-stroke-width: 2px;
+
+ --pswp-error-text-color: var(--pswp-icon-color);
+}
+
+
/*
- Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
+ Styles for basic PhotoSwipe (pswp) functionality (sliding area, open/close transitions)
*/
-/* pswp = photoswipe */
+
.pswp {
- display: none;
- position: absolute;
- width: 100%;
- height: 100%;
- left: 0;
- top: 0;
- overflow: hidden;
- -ms-touch-action: none;
- touch-action: none;
- z-index: 16777271;
- -webkit-text-size-adjust: 100%;
- /* create separate layer, to avoid paint on window.onscroll in webkit/blink */
- -webkit-backface-visibility: hidden;
- outline: none; }
- .pswp * {
- -webkit-box-sizing: border-box;
- box-sizing: border-box; }
- .pswp img {
- max-width: none; }
-
-/* style is added when JS option showHideOpacity is set to true */
-.pswp--animate_opacity {
- /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
- opacity: 0.001;
- will-change: opacity;
- /* for open/close transition */
- -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
- transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: var(--pswp-root-z-index);
+ display: none;
+ touch-action: none;
+ outline: 0;
+ opacity: 0.003;
+ contain: layout style size;
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+/* Prevents focus outline on the root element,
+ (it may be focused initially) */
+.pswp:focus {
+ outline: 0;
+}
+
+.pswp * {
+ box-sizing: border-box;
+}
+
+.pswp img {
+ max-width: none;
+}
.pswp--open {
- display: block; }
-
-.pswp--zoom-allowed .pswp__img {
- /* autoprefixer: off */
- cursor: -webkit-zoom-in;
- cursor: -moz-zoom-in;
- cursor: zoom-in; }
-
-.pswp--zoomed-in .pswp__img {
- /* autoprefixer: off */
- cursor: -webkit-grab;
- cursor: -moz-grab;
- cursor: grab; }
-
-.pswp--dragging .pswp__img {
- /* autoprefixer: off */
- cursor: -webkit-grabbing;
- cursor: -moz-grabbing;
- cursor: grabbing; }
+ display: block;
+}
-/*
- Background is added as a separate element.
- As animating opacity is much faster than animating rgba() background-color.
-*/
+.pswp,
.pswp__bg {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
- background: #000;
- opacity: 0;
- -webkit-transform: translateZ(0);
- transform: translateZ(0);
- -webkit-backface-visibility: hidden;
- will-change: opacity;
- /* for open/close transition */
- -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
- transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }
+ transform: translateZ(0);
+ will-change: opacity;
+}
+.pswp__bg {
+ opacity: 0.005;
+ background: var(--pswp-bg);
+}
+
+.pswp,
.pswp__scroll-wrap {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
- overflow: hidden; }
+ overflow: hidden;
+}
+.pswp__scroll-wrap,
+.pswp__bg,
.pswp__container,
+.pswp__item,
+.pswp__content,
+.pswp__img,
.pswp__zoom-wrap {
- -ms-touch-action: none;
- touch-action: none;
- position: absolute;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0; }
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
-/* Prevent selection and tap highlights */
-.pswp__container,
+.pswp__img,
+.pswp__zoom-wrap {
+ width: auto;
+ height: auto;
+}
+
+.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
+ cursor: -webkit-zoom-in;
+ cursor: -moz-zoom-in;
+ cursor: zoom-in;
+}
+
+.pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
+ cursor: move;
+ cursor: -webkit-grab;
+ cursor: -moz-grab;
+ cursor: grab;
+}
+
+.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
+ cursor: -webkit-grabbing;
+ cursor: -moz-grabbing;
+ cursor: grabbing;
+}
+
+/* :active to override grabbing cursor */
+.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
+.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
.pswp__img {
- -webkit-user-select: none;
- -ms-user-select: none;
- user-select: none;
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
- -webkit-touch-callout: none; }
+ cursor: -webkit-zoom-out;
+ cursor: -moz-zoom-out;
+ cursor: zoom-out;
+}
-.pswp__zoom-wrap {
- position: absolute;
- width: 100%;
- -webkit-transform-origin: left top;
- -ms-transform-origin: left top;
- transform-origin: left top;
- /* for open/close transition */
- -webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
- transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); }
-
-.pswp--animated-in .pswp__bg,
-.pswp--animated-in .pswp__zoom-wrap {
- -webkit-transition: none;
- transition: none; }
+/* Prevent selection and tap highlights */
.pswp__container,
-.pswp__zoom-wrap {
- -webkit-backface-visibility: hidden; }
+.pswp__img,
+.pswp__button,
+.pswp__counter {
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
.pswp__item {
- position: absolute;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0;
- overflow: hidden; }
+ /* z-index for fade transition */
+ z-index: 1;
+ overflow: hidden;
+}
-.pswp__img {
+.pswp__hidden {
+ display: none !important;
+}
+
+/* Allow to click through pswp__content element, but not its children */
+.pswp__content {
+ pointer-events: none;
+}
+.pswp__content > * {
+ pointer-events: auto;
+}
+
+
+/*
+
+ PhotoSwipe UI
+
+*/
+
+/*
+ Error message appears when image is not loaded
+ (JS option errorMsg controls markup)
+*/
+.pswp__error-msg-container {
+ display: grid;
+}
+.pswp__error-msg {
+ margin: auto;
+ font-size: 1em;
+ line-height: 1;
+ color: var(--pswp-error-text-color);
+}
+
+/*
+class pswp__hide-on-close is applied to elements that
+should hide (for example fade out) when PhotoSwipe is closed
+and show (for example fade in) when PhotoSwipe is opened
+ */
+.pswp .pswp__hide-on-close {
+ opacity: 0.005;
+ will-change: opacity;
+ transition: opacity var(--pswp-transition-duration) cubic-bezier(0.4, 0, 0.22, 1);
+ z-index: 10; /* always overlap slide content */
+ pointer-events: none; /* hidden elements should not be clickable */
+}
+
+/* class pswp--ui-visible is added when opening or closing transition starts */
+.pswp--ui-visible .pswp__hide-on-close {
+ opacity: 1;
+ pointer-events: auto;
+}
+
+/* ',forceProgressiveLoading:!1,preload:[1,1],getNumItemsFn:function(){return Yt.length}},Jt=function(e,t,n){if(!e.src||e.loadError)return e.w=e.h=0,e.initialZoomLevel=e.fitRatio=1,e.bounds=zt(),e.initialPosition=e.bounds.center,e.bounds;var i,o,a,r,l,s,u,c=!n;return c&&(e.vGap||(e.vGap={top:0,bottom:0}),x("parseVerticalMargin",e)),qt.x=t.x,qt.y=t.y-e.vGap.top-e.vGap.bottom,c&&(i=qt.x/e.w,o=qt.y/e.h,e.fitRatio=i
+