mediawiki-skins-MinervaNeue/resources/skins.minerva.backtotop/backtotop.less
jdlrobson 038103299a Minerva owns BacktoTopOverlay
Not used in MobileFrontend so it is moved here from that repo.
t r
Change-Id: I97e6010026daf4c6610bcfbedf140fb2a45b1130
2017-10-26 16:34:16 -04:00

48 lines
916 B
Plaintext

@import 'minerva.variables';
@import 'mediawiki.mixins.less';
.backtotop {
/* initially hide the element */
visibility: hidden;
opacity: 0;
/* basic styling */
position: fixed;
width: 2.5em;
height: 2.5em;
border-radius: 100%;
box-shadow: 0.1em 0.2em 0.3em @colorGray12;
bottom: 20px;
right: 0;
cursor: pointer;
z-index: @z-indexOverlay;
background-color: @colorProgressive;
/* define what happens, if the visible class is added/removed, add a nice fade out/in */
.transition( opacity 0.5s 0s );
&.visible {
&:hover {
opacity: 1;
}
opacity: 0.8;
}
> .arrow-up {
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #fff;
position: absolute;
top: 50%;
left: 50%;
transform: translate( -50%, -50% );
}
/* center arrow in RTL wikis */
.rtl > & .arrow-up {
transform: translate( 50%, -50% );
}
}