Upgrade to Magnific Popup 0.9.6

This commit is contained in:
Sébastien Lucas 2013-10-03 12:00:55 +02:00
parent 850263d022
commit 4ee2d2a607
2 changed files with 78 additions and 98 deletions

File diff suppressed because one or more lines are too long

View file

@ -58,8 +58,7 @@
.mfp-ajax-cur { .mfp-ajax-cur {
cursor: progress; } cursor: progress; }
.mfp-zoom-out-cur, .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
cursor: -moz-zoom-out; cursor: -moz-zoom-out;
cursor: -webkit-zoom-out; cursor: -webkit-zoom-out;
cursor: zoom-out; } cursor: zoom-out; }
@ -97,11 +96,9 @@
left: 8px; left: 8px;
right: 8px; right: 8px;
z-index: 1044; } z-index: 1044; }
.mfp-preloader a {
.mfp-preloader a {
color: #cccccc; } color: #cccccc; }
.mfp-preloader a:hover {
.mfp-preloader a:hover {
color: white; } color: white; }
.mfp-s-ready .mfp-preloader { .mfp-s-ready .mfp-preloader {
@ -110,8 +107,7 @@
.mfp-s-error .mfp-content { .mfp-s-error .mfp-content {
display: none; } display: none; }
button.mfp-close, button.mfp-close, button.mfp-arrow {
button.mfp-arrow {
overflow: visible; overflow: visible;
cursor: pointer; cursor: pointer;
background: transparent; background: transparent;
@ -122,7 +118,6 @@ button.mfp-arrow {
z-index: 1046; z-index: 1046;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; } box-shadow: none; }
button::-moz-focus-inner { button::-moz-focus-inner {
padding: 0; padding: 0;
border: 0; } border: 0; }
@ -176,17 +171,13 @@ button::-moz-focus-inner {
width: 90px; width: 90px;
height: 110px; height: 110px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); } -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.mfp-arrow:active {
.mfp-arrow:active {
margin-top: -54px; } margin-top: -54px; }
.mfp-arrow:hover, .mfp-arrow:focus {
.mfp-arrow:hover,
.mfp-arrow:focus {
opacity: 1; } opacity: 1; }
.mfp-arrow:before, .mfp-arrow:after,
.mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b,
.mfp-arrow .mfp-b, .mfp-arrow .mfp-a {
.mfp-arrow .mfp-a {
content: ''; content: '';
display: block; display: block;
width: 0; width: 0;
@ -197,13 +188,13 @@ button::-moz-focus-inner {
margin-top: 35px; margin-top: 35px;
margin-left: 35px; margin-left: 35px;
border: medium inset transparent; } border: medium inset transparent; }
.mfp-arrow:after, .mfp-arrow:after,
.mfp-arrow .mfp-a { .mfp-arrow .mfp-a {
border-top-width: 13px; border-top-width: 13px;
border-bottom-width: 13px; border-bottom-width: 13px;
top: 8px; } top: 8px; }
.mfp-arrow:before, .mfp-arrow:before,
.mfp-arrow .mfp-b { .mfp-arrow .mfp-b {
border-top-width: 21px; border-top-width: 21px;
border-bottom-width: 21px; } border-bottom-width: 21px; }
@ -231,19 +222,19 @@ button::-moz-focus-inner {
.mfp-iframe-holder { .mfp-iframe-holder {
padding-top: 40px; padding-top: 40px;
padding-bottom: 40px; } padding-bottom: 40px; }
.mfp-iframe-holder .mfp-content {
.mfp-iframe-holder .mfp-content {
line-height: 0; line-height: 0;
width: 100%; width: 100%;
max-width: 900px; } max-width: 900px; }
.mfp-iframe-holder .mfp-close {
top: -40px; }
.mfp-iframe-scaler { .mfp-iframe-scaler {
width: 100%; width: 100%;
height: 0; height: 0;
overflow: hidden; overflow: hidden;
padding-top: 56.25%; } padding-top: 56.25%; }
.mfp-iframe-scaler iframe {
.mfp-iframe-scaler iframe {
position: absolute; position: absolute;
display: block; display: block;
top: 0; top: 0;
@ -253,9 +244,6 @@ button::-moz-focus-inner {
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: black; } background: black; }
.mfp-iframe-holder .mfp-close {
top: -40px; }
/* Main image in popup */ /* Main image in popup */
img.mfp-img { img.mfp-img {
width: auto; width: auto;
@ -270,7 +258,9 @@ img.mfp-img {
margin: 0 auto; } margin: 0 auto; }
/* The shadow behind the image */ /* The shadow behind the image */
.mfp-figure:after { .mfp-figure {
line-height: 0; }
.mfp-figure:after {
content: ''; content: '';
position: absolute; position: absolute;
left: 0; left: 0;
@ -283,9 +273,11 @@ img.mfp-img {
z-index: -1; z-index: -1;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: #444444; } background: #444444; }
.mfp-figure small {
.mfp-figure { color: #bdbdbd;
line-height: 0; } display: block;
font-size: 12px;
line-height: 14px; }
.mfp-bottom-bar { .mfp-bottom-bar {
margin-top: -36px; margin-top: -36px;
@ -302,12 +294,6 @@ img.mfp-img {
word-wrap: break-word; word-wrap: break-word;
padding-right: 36px; } padding-right: 36px; }
.mfp-figure small {
color: #bdbdbd;
display: block;
font-size: 12px;
line-height: 14px; }
.mfp-image-holder .mfp-content { .mfp-image-holder .mfp-content {
max-width: 100%; } max-width: 100%; }
@ -321,15 +307,16 @@ img.mfp-img {
.mfp-img-mobile .mfp-image-holder { .mfp-img-mobile .mfp-image-holder {
padding-left: 0; padding-left: 0;
padding-right: 0; } padding-right: 0; }
.mfp-img-mobile img.mfp-img { .mfp-img-mobile img.mfp-img {
padding: 0; } padding: 0; }
.mfp-img-mobile .mfp-figure {
/* The shadow behind the image */ /* The shadow behind the image */ }
.mfp-img-mobile .mfp-figure:after { .mfp-img-mobile .mfp-figure:after {
top: 0; top: 0;
bottom: 0; } bottom: 0; }
.mfp-img-mobile .mfp-figure small {
display: inline;
margin-left: 5px; }
.mfp-img-mobile .mfp-bottom-bar { .mfp-img-mobile .mfp-bottom-bar {
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
bottom: 0; bottom: 0;
@ -340,14 +327,11 @@ img.mfp-img {
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; } box-sizing: border-box; }
.mfp-img-mobile .mfp-bottom-bar:empty { .mfp-img-mobile .mfp-bottom-bar:empty {
padding: 0; } padding: 0; }
.mfp-img-mobile .mfp-counter { .mfp-img-mobile .mfp-counter {
right: 5px; right: 5px;
top: 3px; } top: 3px; }
.mfp-img-mobile .mfp-close { .mfp-img-mobile .mfp-close {
top: 0; top: 0;
right: 0; right: 0;
@ -357,11 +341,7 @@ img.mfp-img {
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
position: fixed; position: fixed;
text-align: center; text-align: center;
padding: 0; } padding: 0; } }
.mfp-img-mobile .mfp-figure small {
display: inline;
margin-left: 5px; } }
@media all and (max-width: 900px) { @media all and (max-width: 900px) {
.mfp-arrow { .mfp-arrow {
-webkit-transform: scale(0.75); -webkit-transform: scale(0.75);