mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer
synced 2024-09-29 13:17:35 +00:00
Merge "Make opacity rules compatible with IE6-8"
This commit is contained in:
commit
cffddda969
|
@ -106,11 +106,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mmv-controls {
|
.mw-mmv-controls {
|
||||||
opacity: 0;
|
.opacity(0);
|
||||||
transition: opacity 0.25s;
|
transition: opacity 0.25s;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
opacity: 1;
|
.opacity(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -15,6 +15,12 @@
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.opacity(@value) {
|
||||||
|
opacity: @value;
|
||||||
|
filter: e(%("alpha(opacity=%s)", round(@value * 100))); // IE6-8
|
||||||
|
zoom: 1; // IE 6-7 hasLayout hack
|
||||||
|
}
|
||||||
|
|
||||||
// from http://stackoverflow.com/a/12178019/323407
|
// from http://stackoverflow.com/a/12178019/323407
|
||||||
.fade-out(@backgroundColor: white) {
|
.fade-out(@backgroundColor: white) {
|
||||||
@invisible: fadeout(@backgroundColor, 100%);
|
@invisible: fadeout(@backgroundColor, 100%);
|
||||||
|
@ -25,7 +31,7 @@
|
||||||
background-image: -webkit-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // Chrome10+,Safari5.1+
|
background-image: -webkit-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // Chrome10+,Safari5.1+
|
||||||
background-image: -o-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // Opera 11.10+
|
background-image: -o-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // Opera 11.10+
|
||||||
background-image: -ms-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // IE10+
|
background-image: -ms-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // IE10+
|
||||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 )",
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient( startColorstr='#%s', endColorstr='#%s',GradientType=0 )",
|
||||||
rgbahex(@invisible), rgbahex(@backgroundColor))); // IE6-9
|
rgbahex(@invisible), rgbahex(@backgroundColor))); // IE6-9
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
.mw-mmv-image img.blurred {
|
.mw-mmv-image img.blurred {
|
||||||
filter: blur(3px);
|
filter: blur(3px);
|
||||||
-webkit-filter: blur(3px);
|
-webkit-filter: blur(3px);
|
||||||
opacity: 0.8;
|
.opacity(0.8);
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mmv-image img {
|
.mw-mmv-image img {
|
||||||
|
|
|
@ -12,12 +12,12 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
opacity: 0.8;
|
.opacity(0.8);
|
||||||
border: none;
|
border: none;
|
||||||
z-index: 1003;
|
z-index: 1003;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
opacity: 1;
|
.opacity(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.unselectable;
|
.unselectable;
|
||||||
|
|
|
@ -79,7 +79,7 @@
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: center bottom;
|
background-position: center bottom;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
opacity: 0.7;
|
.opacity(0.7);
|
||||||
transition: opacity 0.25s;
|
transition: opacity 0.25s;
|
||||||
|
|
||||||
&.pointing-down {
|
&.pointing-down {
|
||||||
|
@ -90,10 +90,10 @@
|
||||||
.mw-mmv-post-image.invite & {
|
.mw-mmv-post-image.invite & {
|
||||||
/* @embed */
|
/* @embed */
|
||||||
background-image: url(img/drag-active.svg);
|
background-image: url(img/drag-active.svg);
|
||||||
opacity: 0.9;
|
.opacity(0.9);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mmv-post-image:hover .mw-mmv-drag-icon {
|
.mw-mmv-post-image:hover .mw-mmv-drag-icon {
|
||||||
opacity: 1;
|
.opacity(1);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue