Page MenuHomeWickedGov Phorge

mixins.less
No OneTemporary

Size
2 KB
Referenced Files
None
Subscribers
None

mixins.less

@import 'mediawiki.skin.variables.less';
@import 'mediawiki.mixins.less';
/*
* These two mixins create pointer triangles via cleverly placed borders, without any image.
* _____________
* |\ /|
* | \_________/ |
* | | | | ____
* | | Content | | |\ /|
* | |_________| | | \/ | ____
* | / \ | > | /\ | > | /\ | > /\
* |/___________\| |/__\| |/__\| /__\
*
* Element with Set content Remove Make left+right
* 4 borders to 0x0 top border transparent
*/
.mwe-popups-border-pointer-top( @size, @left, @color, @extra ) {
content: '';
position: absolute;
border: ( @size + @extra ) @border-style-base @border-color-transparent;
border-top: 0;
border-bottom: ( @size + @extra ) @border-style-base @color;
top: -@size;
left: @left;
}
.mwe-popups-border-pointer-bottom( @size, @left, @color, @extra ) {
content: '';
position: absolute;
border: ( @size + @extra ) @border-style-base @border-color-transparent;
border-bottom: 0;
border-top: ( @size + @extra ) @border-style-base @color;
bottom: -@size;
left: @left;
}
/* FIXME: Use Phuedx's approach to make this cleaner
https://gist.github.com/phuedx/0639a279b6efb1a71474 */
@keyframes mwe-popups-fade-in-up {
.mwe-popups-fade-in-up-frames;
}
@keyframes mwe-popups-fade-in-down {
.mwe-popups-fade-in-down-frames;
}
@keyframes mwe-popups-fade-out-down {
.mwe-popups-fade-out-down-frames;
}
@keyframes mwe-popups-fade-out-up {
.mwe-popups-fade-out-up-frames;
}
.mwe-popups-fade-in-up-frames() {
0% {
opacity: 0;
transform: translate( 0, 20px );
}
100% {
opacity: 1;
transform: translate( 0, 0 );
}
}
.mwe-popups-fade-in-down-frames() {
0% {
opacity: 0;
transform: translate( 0, -20px );
}
100% {
opacity: 1;
transform: translate( 0, 0 );
}
}
.mwe-popups-fade-out-down-frames() {
0% {
opacity: 1;
transform: translate( 0, 0 );
}
100% {
opacity: 0;
transform: translate( 0, 20px );
}
}
.mwe-popups-fade-out-up-frames() {
0% {
opacity: 1;
transform: translate( 0, 0 );
}
100% {
opacity: 0;
transform: 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;
}

File Metadata

Mime Type
text/plain
Expires
Sat, May 16, 14:44 (23 h, 41 m)
Storage Engine
local-disk
Storage Format
Raw Data
Storage Handle
a9/0b/b8983d58565ab64160408c648cdd
Default Alt Text
mixins.less (2 KB)

Event Timeline