2014-05-05 21:44:27 +00:00
|
|
|
@import "../mmv.globals";
|
|
|
|
@import "../mmv.mixins";
|
|
|
|
@import "mediawiki.mixins.animation";
|
|
|
|
|
|
|
|
.mw-mmv-post-image {
|
|
|
|
.animation( mw-mmv-appear-animation 0.5s ease 0s 1 normal forwards );
|
|
|
|
&.invite {
|
2014-05-15 15:55:40 +00:00
|
|
|
.animation( mw-mmv-invite-animation 1s ease 0s 1 normal forwards );
|
2014-05-05 21:44:27 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.mw-mmv-appear-animation() {
|
|
|
|
0% {
|
|
|
|
opacity: 0.6;
|
|
|
|
}
|
|
|
|
50% {
|
|
|
|
opacity: 0.9;
|
|
|
|
}
|
|
|
|
100% {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@-webkit-keyframes mw-mmv-appear-animation {
|
|
|
|
.mw-mmv-appear-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
@-moz-keyframes mw-mmv-appear-animation {
|
|
|
|
.mw-mmv-appear-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
@-o-keyframes mw-mmv-appear-animation {
|
|
|
|
.mw-mmv-appear-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
@keyframes mw-mmv-appear-animation {
|
|
|
|
.mw-mmv-appear-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
.mw-mmv-invite-animation() {
|
|
|
|
0% {
|
|
|
|
margin-top: 0px;
|
|
|
|
}
|
2014-05-15 15:55:40 +00:00
|
|
|
33% {
|
|
|
|
margin-top: -30px;
|
2014-05-05 21:44:27 +00:00
|
|
|
}
|
|
|
|
100% {
|
|
|
|
margin-top: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@-webkit-keyframes mw-mmv-invite-animation {
|
|
|
|
.mw-mmv-invite-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
@-moz-keyframes mw-mmv-invite-animation {
|
|
|
|
.mw-mmv-invite-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
@-o-keyframes mw-mmv-invite-animation {
|
|
|
|
.mw-mmv-invite-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
@keyframes mw-mmv-invite-animation {
|
|
|
|
.mw-mmv-invite-animation;
|
|
|
|
}
|
|
|
|
|
|
|
|
.mw-mmv-drag-affordance {
|
|
|
|
width: 100%;
|
|
|
|
height: @metadatabar-drag-height;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
|
|
|
.mw-mmv-drag-icon {
|
|
|
|
width: 64px;
|
|
|
|
height: @metadatabar-drag-height;
|
|
|
|
/* @embed */
|
|
|
|
background-image: url(img/drag.svg);
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-position: center bottom;
|
|
|
|
margin: 0 auto;
|
2014-05-15 15:55:40 +00:00
|
|
|
opacity: 0.7;
|
2014-05-05 21:44:27 +00:00
|
|
|
transition: opacity 0.25s;
|
|
|
|
|
|
|
|
&.pointing-down {
|
|
|
|
background-position: center top;
|
|
|
|
.rotate(180deg);
|
|
|
|
}
|
2014-05-17 13:24:36 +00:00
|
|
|
|
2014-06-10 20:01:19 +00:00
|
|
|
.mw-mmv-post-image.invite & {
|
2014-05-17 13:24:36 +00:00
|
|
|
/* @embed */
|
2014-05-15 15:55:40 +00:00
|
|
|
background-image: url(img/drag-active.svg);
|
|
|
|
opacity: 0.9;
|
|
|
|
}
|
2014-05-05 21:44:27 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.mw-mmv-post-image:hover .mw-mmv-drag-icon {
|
|
|
|
opacity: 1;
|
|
|
|
}
|