mediawiki-extensions-Popups/resources/ext.popups/styles/ext.popups.animation.less
jdlrobson eea509637a Remove unused code in repo
The existence of these files was causing me much confusion as I thought
they were still being used in the mpga branch.

If this is note the case they should be removed to make the repo easier
to understand.

Changes:
* Move the ext.popups.animation.less into ext.popups since that's where
its shipped.
* Remove files which are not being used.
* Since csslint now runs on ext.popups.animation.less fix the linting
issues (previously linting was not occuring)

Change-Id: Iae0a78d0b8a13353de70794b67387f2c3bab44c6
2017-02-02 16:18:41 -08:00

140 lines
2.5 KiB
Plaintext

@import 'mediawiki.mixins.animation';
.mwe-popups-translate( @x, @y ) {
-webkit-transform: translate( @x, @y );
-moz-transform: translate( @x, @y );
-ms-transform: translate( @x, @y );
-o-transform: translate( @x, @y );
transform: translate( @x, @y );
}
/* FIXME: Use Phuedx's approach to make this cleaner
https://gist.github.com/phuedx/0639a279b6efb1a71474 */
@-webkit-keyframes mwe-popups-fade-in-up {
.mwe-popups-fade-in-up-frames;
}
@-moz-keyframes mwe-popups-fade-in-up {
.mwe-popups-fade-in-up-frames;
}
@-o-keyframes mwe-popups-fade-in-up {
.mwe-popups-fade-in-up-frames;
}
@keyframes mwe-popups-fade-in-up {
.mwe-popups-fade-in-up-frames;
}
@-webkit-keyframes mwe-popups-fade-in-down {
.mwe-popups-fade-in-down-frames;
}
@-moz-keyframes mwe-popups-fade-in-down {
.mwe-popups-fade-in-down-frames;
}
@-o-keyframes mwe-popups-fade-in-down {
.mwe-popups-fade-in-down-frames;
}
@keyframes mwe-popups-fade-in-down {
.mwe-popups-fade-in-down-frames;
}
@-webkit-keyframes mwe-popups-fade-out-down {
.mwe-popups-fade-out-down-frames;
}
@-moz-keyframes mwe-popups-fade-out-down {
.mwe-popups-fade-out-down-frames;
}
@-o-keyframes mwe-popups-fade-out-down {
.mwe-popups-fade-out-down-frames;
}
@keyframes mwe-popups-fade-out-down {
.mwe-popups-fade-out-down-frames;
}
@-webkit-keyframes mwe-popups-fade-out-up {
.mwe-popups-fade-out-up-frames;
}
@-moz-keyframes mwe-popups-fade-out-up {
.mwe-popups-fade-out-up-frames;
}
@-o-keyframes mwe-popups-fade-out-up {
.mwe-popups-fade-out-up-frames;
}
@keyframes mwe-popups-fade-out-up {
.mwe-popups-fade-out-up-frames;
}
.mwe-popups-fade-in-up-frames() {
0% {
opacity: 0;
.mwe-popups-translate( 0, 20px );
}
100% {
opacity: 1;
.mwe-popups-translate( 0, 0 );
}
}
.mwe-popups-fade-in-down-frames() {
0% {
opacity: 0;
.mwe-popups-translate( 0, -20px );
}
100% {
opacity: 1;
.mwe-popups-translate( 0, 0 );
}
}
.mwe-popups-fade-out-down-frames() {
0% {
opacity: 1;
.mwe-popups-translate( 0, 0 );
}
100% {
opacity: 0;
.mwe-popups-translate( 0, 20px );
}
}
.mwe-popups-fade-out-up-frames() {
0% {
opacity: 1;
.mwe-popups-translate( 0, 0 );
}
100% {
opacity: 0;
.mwe-popups-translate( 0, -20px );
}
}
.mwe-popups-fade-in-up {
.animation( mwe-popups-fade-in-up, 0.2s, ease, forwards );
}
.mwe-popups-fade-in-down {
.animation( mwe-popups-fade-in-down, 0.2s, ease, forwards );
}
.mwe-popups-fade-out-down {
.animation( mwe-popups-fade-out-down, 0.2s, ease, forwards );
}
.mwe-popups-fade-out-up {
.animation( mwe-popups-fade-out-up, 0.2s, ease, forwards );
}