wikimedia/mediawiki-extensions-Popups
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/Popups synced 2024-11-29 01:44:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

Hygiene: Separate variables and mixins from code

Browse source 
The LESS mixin format looks so similar to css selectors it can
be very confusing at times to know whether you are looking at
a css selector or a mixin. I'd like to see these separate for
sanity.

Change-Id: I1241f62e0b5322c549f15e570ae2319737ed8c2e
This commit is contained in:
jdlrobson 2018-04-25 14:39:59 -07:00 committed by Stephen Niedzielski
parent a678df93a0
commit af606b37cb
3 changed files with 35 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/ui/mixins.less
View file

@ -1,4 +1,25 @@
@import 'mediawiki.mixins.animation';
@import 'mediawiki.mixins.less';
.mwe-popups-border-pointer-top( @size, @left, @color, @extra ) {
content: '';
position: absolute;
border: ( @size + @extra ) solid transparent;
border-top: 0;
border-bottom: ( @size + @extra ) solid @color;
top: -@size;
left: @left;
}
.mwe-popups-border-pointer-bottom( @size, @left, @color, @extra ) {
content: '';
position: absolute;
border: ( @size + @extra ) solid transparent;
border-bottom: 0;
border-top: ( @size + @extra ) solid @color;
bottom: -@size;
left: @left;
}
.mwe-popups-translate( @x, @y ) {
-webkit-transform: translate( @x, @y );

35
src/ui/templates/popup.less
View file

@ -1,5 +1,5 @@
@import 'mediawiki.mixins.less';
@import 'mediawiki.ui/variables';
@import '../variables.less';
@import '../mixins.less';
// Code adapted from Yair Rand's NavPopupsRestyled.js
// https://en.wikipedia.org/wiki/User:Yair_rand/NavPopupsRestyled.js
@ -11,37 +11,6 @@
// Not tall Landscape Portrait
// Not tall Missing Landscape
@popupPadding: 16px;
@popupWidth: 320px;
@popupTallWidth: 215px;
@cogIconSize: 30px;
@lineHeight: 20px;
@zIndexPopup: 110;
@zIndexBackground: 111;
@zIndexForeground: 112;
@zIndexThumbnailMask: 113;
.mwe-popups-border-pointer-top( @size, @left, @color, @extra ) {
content: '';
position: absolute;
border: ( @size + @extra ) solid transparent;
border-top: 0;
border-bottom: ( @size + @extra ) solid @color;
top: -@size;
left: @left;
}
.mwe-popups-border-pointer-bottom( @size, @left, @color, @extra ) {
content: '';
position: absolute;
border: ( @size + @extra ) solid transparent;
border-bottom: 0;
border-top: ( @size + @extra ) solid @color;
bottom: -@size;
left: @left;
}
.mwe-popups {
background: #fff;
position: absolute;

12
src/ui/variables.less Normal file
View file

@ -0,0 +1,12 @@
@import 'mediawiki.ui/variables';
@popupPadding: 16px;
@popupWidth: 320px;
@popupTallWidth: 215px;
@cogIconSize: 30px;
@lineHeight: 20px;
@zIndexPopup: 110;
@zIndexBackground: 111;
@zIndexForeground: 112;
@zIndexThumbnailMask: 113;