RTL positioning tweaks

* partially undo the RTL fix from mingle #512 which looks bad,
  and use four-value syyntax for background-position instead.
* use noflip on :before rule as :before itself is not flipped
* handle better the uncertainty resulting from image name
  usually not being RTL

Change-Id: If4aa7240e9bee5c0a06f1785edb9c72964dfc60f
This commit is contained in:
Gergő Tisza 2014-06-28 01:03:16 +00:00
parent b79f3a8392
commit eff0207199

View file

@ -137,7 +137,12 @@
background-image: url(img/repo.svg);
background-repeat: no-repeat;
background-size: auto @icon-size;
// icon should be positioned with consistent padding, but using absolute lengths is not RTL-compatible
// so we use percentages (looks a bit off) for older browsers and four-value syntax for newer ones;
// MediaWiki flips 'left' keywords automatically
background-position: 2% center;
background-position: left @padding center;
background-color: @info-box-color;
line-height: 1.3;
@ -150,6 +155,7 @@
padding-left: @icon-size + 2 * @padding;
background-size: auto @icon-size;
background-position: 3% center;
background-position: left @padding+4px center;
}
.mw-mmv-repo,
@ -173,7 +179,7 @@
.mw-mmv-license {
color: #888888;
font-size: 0.9em;
padding-left: 10px;
padding: 0 10px; // pad both sides; depending on the language of the image name, this might end up on either side
&.empty {
display: none;
@ -188,7 +194,7 @@
height: 20px;
width: 20px;
content: ' ';
margin-right: 5px;
/* @noflip */ margin-right: 5px; // :before is not flipped either
}
}