diff --git a/sass/baguetteBox.scss b/sass/baguetteBox.scss
index 5fa0760..39485c3 100644
--- a/sass/baguetteBox.scss
+++ b/sass/baguetteBox.scss
@@ -1,196 +1,237 @@
/*!
* baguetteBox.js
* @author feimosi
- * @version %%INJECT_VERSION%%
+ * @version 1.13.0
* @url https://github.com/feimosi/baguetteBox.js
*/
-
#baguetteBox-overlay {
- display: none;
- opacity: 0;
- position: fixed;
- overflow: hidden;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- z-index: 1000000;
- background-color: #222;
- background-color: rgba(0,0,0,.8);
- transition: opacity .5s ease;
-
- &.visible {
- opacity: 1;
- }
-
- .full-image {
- display: inline-block;
- position: relative;
- width: 100%;
- height: 100%;
- text-align: center;
-
- figure {
- display: inline;
- margin: 0; // needed for mobile
- height: 100%; // Opera 12 image stretching fix
- }
-
- img {
- // IE8 fix
- display: inline-block;
- width: auto;
- height: auto;
-
- max-height: 100%;
- max-width: 100%;
- vertical-align: middle;
- box-shadow: 0 0 8px rgba(0,0,0,.6);
- }
-
- figcaption {
- display: block;
- position: absolute;
- bottom: 0;
- width: 100%;
- text-align: center;
- line-height: 1.8;
- white-space: normal;
- color: #ccc;
- background-color: #000;
- background-color: rgba(0,0,0,.6);
- font-family: sans-serif;
- }
-
- &:before {
- content: "";
- display: inline-block;
- height: 50%;
- width: 1px;
- margin-right:-1px;
- }
- }
+ display: none;
+ opacity: 0;
+ position: fixed;
+ overflow: hidden;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 1000000;
+ background-color: #222;
+ background-color: rgba(0, 0, 0, 0.8);
+ -webkit-transition: opacity 0.5s ease;
+ transition: opacity 0.5s ease;
+}
+#baguetteBox-overlay.visible {
+ opacity: 1;
+}
+#baguetteBox-overlay .full-image {
+ display: inline-block;
+ position: relative;
+ width: 100%;
+ height: 100%;
+ text-align: center;
+}
+#baguetteBox-overlay .full-image figure {
+ display: inline;
+ margin: 0;
+ height: 100%;
+}
+#baguetteBox-overlay .full-image img {
+ display: inline-block;
+ width: auto;
+ height: auto;
+ max-height: 100%;
+ max-width: 100%;
+ vertical-align: middle;
+ -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+ -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+}
+#baguetteBox-overlay .full-image figcaption {
+ display: block;
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ text-align: center;
+ line-height: 1.8;
+ white-space: normal;
+ color: #ccc;
+ background-color: #000;
+ background-color: rgba(0, 0, 0, 0.6);
+ font-family: sans-serif;
+}
+#baguetteBox-overlay .full-image:before {
+ content: "";
+ display: inline-block;
+ height: 50%;
+ width: 1px;
+ margin-right: -1px;
}
#baguetteBox-slider {
- position: absolute;
- left: 0;
- top: 0;
- height: 100%;
- width: 100%;
- white-space: nowrap;
- transition: left .4s ease, transform .4s ease;
-
- &.bounce-from-right {
- animation: bounceFromRight .4s ease-out;
- }
-
- &.bounce-from-left {
- animation: bounceFromLeft .4s ease-out;
- }
+ position: absolute;
+ left: 0;
+ top: 0;
+ height: 100%;
+ width: 100%;
+ white-space: nowrap;
+ -webkit-transition: left 0.4s ease, -webkit-transform 0.4s ease;
+ transition: left 0.4s ease, -webkit-transform 0.4s ease;
+ transition: left 0.4s ease, transform 0.4s ease;
+ transition: left 0.4s ease, transform 0.4s ease, -webkit-transform 0.4s ease, -moz-transform 0.4s ease;
+}
+#baguetteBox-slider.bounce-from-right {
+ -webkit-animation: bounceFromRight 0.4s ease-out;
+ animation: bounceFromRight 0.4s ease-out;
+}
+#baguetteBox-slider.bounce-from-left {
+ -webkit-animation: bounceFromLeft 0.4s ease-out;
+ animation: bounceFromLeft 0.4s ease-out;
}
-@keyframes bounceFromRight{
- 0% { margin-left: 0; }
- 50% { margin-left: -30px; }
- 100% { margin-left: 0; }
+@-webkit-keyframes bounceFromRight {
+ 0% {
+ margin-left: 0;
+ }
+ 50% {
+ margin-left: -30px;
+ }
+ 100% {
+ margin-left: 0;
+ }
}
-@keyframes bounceFromLeft{
- 0% { margin-left: 0; }
- 50% { margin-left: 30px; }
- 100% { margin-left: 0; }
+@keyframes bounceFromRight {
+ 0% {
+ margin-left: 0;
+ }
+ 50% {
+ margin-left: -30px;
+ }
+ 100% {
+ margin-left: 0;
+ }
}
-
-%arrow-button {
- top: 50%;
- top: calc(50% - 30px);
- width: 44px;
- height: 60px;
+@-webkit-keyframes bounceFromLeft {
+ 0% {
+ margin-left: 0;
+ }
+ 50% {
+ margin-left: 30px;
+ }
+ 100% {
+ margin-left: 0;
+ }
+}
+@keyframes bounceFromLeft {
+ 0% {
+ margin-left: 0;
+ }
+ 50% {
+ margin-left: 30px;
+ }
+ 100% {
+ margin-left: 0;
+ }
+}
+.baguetteBox-button#previous-button, .baguetteBox-button#next-button {
+ top: 50%;
+ top: calc(50% - 30px);
+ width: 44px;
+ height: 60px;
}
.baguetteBox-button {
- position: absolute;
- cursor: pointer;
- outline: none;
- padding: 0;
- margin: 0;
- border: 0;
- border-radius: 15%;
- background-color: #323232;
- background-color: rgba(50,50,50,.5);
- color: #ddd;
- font: 1.6em sans-serif;
- transition: background-color .4s ease;
-
- &:focus,
- &:hover {
- background-color: rgba(50,50,50,.9);
- }
-
- &#next-button {
- @extend %arrow-button;
- right: 2%;
- }
-
- &#previous-button {
- @extend %arrow-button;
- left: 2%;
- }
-
- &#close-button {
- top: 20px;
- right: 2%;
- right: calc(2% + 6px);
- width: 30px;
- height: 30px;
- }
-
- // Firefox fix
- svg {
- position: absolute;
- left: 0;
- top: 0;
- }
+ position: absolute;
+ cursor: pointer;
+ outline: none;
+ padding: 0;
+ margin: 0;
+ border: 0;
+ -moz-border-radius: 15%;
+ border-radius: 15%;
+ background-color: #323232;
+ background-color: rgba(50, 50, 50, 0.5);
+ color: #ddd;
+ font: 1.6em sans-serif;
+ -webkit-transition: background-color 0.4s ease;
+ transition: background-color 0.4s ease;
+}
+.baguetteBox-button:focus, .baguetteBox-button:hover {
+ background-color: rgba(50, 50, 50, 0.9);
+}
+.baguetteBox-button#next-button {
+ right: 2%;
+}
+.baguetteBox-button#previous-button {
+ left: 2%;
+}
+.baguetteBox-button#close-button {
+ top: 20px;
+ right: 2%;
+ right: calc(2% + 6px);
+ width: 30px;
+ height: 30px;
+}
+.baguetteBox-button svg {
+ position: absolute;
+ left: 0;
+ top: 0;
}
/*
Preloader
Borrowed from http://tobiasahlin.com/spinkit/
*/
-
.baguetteBox-spinner {
- width: 40px;
- height: 40px;
- display: inline-block;
- position: absolute;
- top: 50%;
- left: 50%;
- margin-top: -20px;
- margin-left: -20px;
+ width: 40px;
+ height: 40px;
+ display: inline-block;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ margin-top: -20px;
+ margin-left: -20px;
}
.baguetteBox-double-bounce1,
.baguetteBox-double-bounce2 {
- width: 100%;
- height: 100%;
- border-radius: 50%;
- background-color: #fff;
- opacity: .6;
- position: absolute;
- top: 0;
- left: 0;
- animation: bounce 2s infinite ease-in-out;
+ width: 100%;
+ height: 100%;
+ -moz-border-radius: 50%;
+ border-radius: 50%;
+ background-color: #fff;
+ opacity: 0.6;
+ position: absolute;
+ top: 0;
+ left: 0;
+ -webkit-animation: bounce 2s infinite ease-in-out;
+ animation: bounce 2s infinite ease-in-out;
}
.baguetteBox-double-bounce2 {
- animation-delay: -1s;
+ -webkit-animation-delay: -1s;
+ animation-delay: -1s;
+}
+
+@-webkit-keyframes bounce {
+ 0%, 100% {
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ }
+ 50% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
}
@keyframes bounce {
- 0%, 100% {
- transform: scale(0);
- } 50% {
- transform: scale(1);
- }
+ 0%, 100% {
+ -webkit-transform: scale(0);
+ -moz-transform: scale(0);
+ transform: scale(0);
+ }
+ 50% {
+ -webkit-transform: scale(1);
+ -moz-transform: scale(1);
+ transform: scale(1);
+ }
}
diff --git a/themes/tabi/static/js/baguetteBox.min.js b/themes/tabi/static/js/baguetteBox.min.js
index 14bdbcb..90770f5 100644
--- a/themes/tabi/static/js/baguetteBox.min.js
+++ b/themes/tabi/static/js/baguetteBox.min.js
@@ -1,7 +1,7 @@
/*!
* baguetteBox.js
* @author feimosi
- * @version 1.12.0
+ * @version 1.13.0
* @url https://github.com/feimosi/baguetteBox.js
*/
-!function(e,t){"use strict";"function"==typeof define&&define.amd?define(t):"object"==typeof exports?module.exports=t():e.baguetteBox=t()}(this,function(){"use strict";var s,l,u,c,d,f='',g='',p='',b={},v={captions:!0,buttons:"auto",fullScreen:!1,noScrollbars:!1,bodyClass:"baguetteBox-open",titleTag:!1,async:!1,preload:2,animation:"slideIn",afterShow:null,afterHide:null,onChange:null,overlayBackgroundColor:"rgba(0,0,0,.8)",closeX:p,leftArrow:f,rightArrow:g},m={},h=[],o=0,n=!1,i={},a=!1,y=/.+\.(gif|jpe?g|png|webp)/i,w={},k=[],r=null,x=function(e){-1!==e.target.id.indexOf("baguette-img")&&X()},E=function(e){e.stopPropagation?e.stopPropagation():e.cancelBubble=!0,q()},C=function(e){e.stopPropagation?e.stopPropagation():e.cancelBubble=!0,j()},B=function(e){e.stopPropagation?e.stopPropagation():e.cancelBubble=!0,X()},T=function(e){i.count++,1',b.captions&&r){var u=J("figcaption");u.id="baguetteBox-figcaption-"+t,u.innerHTML=r,l.appendChild(u)}e.appendChild(l);var c=J("img");c.onload=function(){var e=document.querySelector("#baguette-img-"+t+" .baguetteBox-spinner");l.removeChild(e),!b.async&&n&&n()},c.setAttribute("src",s),c.alt=a&&a.alt||"",b.titleTag&&r&&(c.title=r),l.appendChild(c),b.async&&n&&n()}}function j(){return D(o+1)}function q(){return D(o-1)}function D(e,t){return!n&&0<=e&&e=k.length?(b.animation&&O("right"),!1):(Y(o=e,function(){z(o),V(o)}),R(),b.onChange&&b.onChange(o,k.length),!0)}function O(e){l.className="bounce-from-"+e,setTimeout(function(){l.className=""},400)}function R(){var e=100*-o+"%";"fadeIn"===b.animation?(l.style.opacity=0,setTimeout(function(){m.transforms?l.style.transform=l.style.webkitTransform="translate3d("+e+",0,0)":l.style.left=e,l.style.opacity=1},400)):m.transforms?l.style.transform=l.style.webkitTransform="translate3d("+e+",0,0)":l.style.left=e}function z(e){e-o>=b.preload||Y(e+1,function(){z(e+1)})}function V(e){o-e>=b.preload||Y(e-1,function(){V(e-1)})}function U(e,t,n,o){e.addEventListener?e.addEventListener(t,n,o):e.attachEvent("on"+t,function(e){(e=e||window.event).target=e.target||e.srcElement,n(e)})}function W(e,t,n,o){e.removeEventListener?e.removeEventListener(t,n,o):e.detachEvent("on"+t,n)}function G(e){return document.getElementById(e)}function J(e){return document.createElement(e)}return[].forEach||(Array.prototype.forEach=function(e,t){for(var n=0;n',b.captions&&r){var u=J("figcaption");u.id="baguetteBox-figcaption-"+t,u.innerHTML=r,l.appendChild(u)}e.appendChild(l);var c=J("img");c.onload=function(){var e=document.querySelector("#baguette-img-"+t+" .baguetteBox-spinner");l.removeChild(e),!b.async&&n&&n()},c.setAttribute("src",s),c.alt=a&&a.alt||"",b.titleTag&&r&&(c.title=r),l.appendChild(c),b.async&&n&&n()}}function Y(){return D(o+1)}function j(){return D(o-1)}function D(e,t){return!n&&0<=e&&e=k.length?(b.animation&&O("right"),!1):(X(o=e,function(){z(o),V(o)}),R(),b.onChange&&b.onChange(o,k.length),!0)}function O(e){l.className="bounce-from-"+e,setTimeout(function(){l.className=""},400)}function R(){var e="rtl"===document.querySelectorAll("html")[0].getAttribute("dir"),t=-o*(e?-100:100)+"%";"fadeIn"===b.animation?(l.style.opacity=0,setTimeout(function(){v.transforms?l.style.transform=l.style.webkitTransform="translate3d("+t+",0,0)":l.style.left=t,l.style.opacity=1},400)):v.transforms?l.style.transform=l.style.webkitTransform="translate3d("+t+",0,0)":l.style.left=t}function z(e){e-o>=b.preload||X(e+1,function(){z(e+1)})}function V(e){o-e>=b.preload||X(e-1,function(){V(e-1)})}function U(e,t,n,o){e.addEventListener?e.addEventListener(t,n,o):e.attachEvent("on"+t,function(e){(e=e||window.event).target=e.target||e.srcElement,n(e)})}function W(e,t,n,o){e.removeEventListener?e.removeEventListener(t,n,o):e.detachEvent("on"+t,n)}function G(e){return document.getElementById(e)}function J(e){return document.createElement(e)}return[].forEach||(Array.prototype.forEach=function(e,t){for(var n=0;n