Page MenuHomePhabricator

margin for edit section button on RTL wikis with LTR user interface is on the wrong side
Closed, ResolvedPublic

Description

On RTL wikis with LTR user interface the edit section buttons are correctly on the left side but the margin is on the left side.

actual effective style definitions:

float: left;
margin-left: 5px;

expected effective style definitions:

float: left;
margin-right: 5px;

Untested patch for skins/common/shared.css:

  • old -----

/* Edit section links */
.editsection {
float: right;
margin-left: 5px;
}
/* Correct directionality when page dir is different from site/user dir */
.mw-content-ltr .editsection,
.mw-content-rtl .mw-content-ltr .editsection {
/* @noflip */
float: right;
}
.mw-content-rtl .editsection,
.mw-content-ltr .mw-content-rtl .editsection {
/* @noflip */
float: left;
}

  • new -----

/* Edit section links */
/* Correct directionality when page dir is different from site/user dir */
.mw-content-ltr .editsection,
.mw-content-rtl .mw-content-ltr .editsection {
/* @noflip */
float: right;
margin-left: 5px;
}
.mw-content-rtl .editsection,
.mw-content-ltr .mw-content-rtl .editsection {
/* @noflip */
float: left;
margin-right: 5px;
}


Version: unspecified
Severity: normal
URL: https://ar.wikipedia.org/wiki/%D9%87%D9%88%D9%84%D8%AF%D8%B1%D9%8A%D8%AE_%D8%B2%D9%88%D9%8A%D9%86%D9%83%D9%84%D9%8A?uselang=en#.D8.A7.D9.84.D8.A5.D8.B5.D9.84.D8.A7.D8.AD_.D9.8A.D8.AA.D9.82.D8.AF.D9.85_.D9.81.D9.8A_.D8.B2.D9.8A.D9.88.D8.B1.D8.AE_.281524-1525.29

Details

Reference
bz34470

Event Timeline

bzimport raised the priority of this task from to Medium.Nov 22 2014, 12:09 AM
bzimport set Reference to bz34470.

The margin is so small that I didn't notice it when developing mw-content-ltr/rtl. We can do the above fix (the exact patch doesn't work but it can be adapted), or another solution could be to simply change it to margin: 0 5px; so it would be 5px on both sides regardless of LTR/RTL. I don't know if that would be OK or if there's a reason to have no margin at the end.

margin: 0 5px is wrong because it generates an additional margin at the end.

(In reply to comment #2)

margin: 0 5px is wrong because it generates an additional margin at the end.

Yes, but I meant, if there is no problem with having a margin at the end (I don't see any problem), then it's better to do it that way because that's simpler.

The annoying left margin for the edit section buttons on RTL wikis with LTR user interface was my reason to open the bug.

The definition
.editsection {

float: right;

}
is useless because it is always overwritten by one of the more specific definitions with class mw-content-ltr or class mw-content-rtl in the selector. Or is there still a situation for a edit section button without class mw-content-ltr or mw-content-rtl?

Ok, there is one situation for a edit section button outside of the mw-content-ltr or mw-content-rtl container when you create a edit section button for the first heading as a gadget like [[de:MediaWiki:Gadget-Einleitung-bearbeiten.js]]. For this situation the automatic user interface based flipped definition is necessary:

.editsection {

float: right;
margin-left: 5px;

}

For edit section buttons inside the mw-content-ltr/mw-content-rtl container should not flipped and should depend mw-content-ltr/mw-content-rtl.

  • new -----

/* Edit section links */
/* outside of mw-content-ltr/mw-content-rtl */
.editsection {

float: right;
margin-left: 5px;

}
/* Correct directionality when page dir is different from site/user dir */
/* @noflip */
.mw-content-ltr .editsection,
.mw-content-rtl .mw-content-ltr .editsection {

float: right;
margin-left: 5px;

}
/* @noflip */
.mw-content-rtl .editsection,
.mw-content-ltr .mw-content-rtl .editsection {

float: left;
margin-right: 5px;

}

LTR wikis with RTL user interface have the same problem with the margin. The float definition and the margin definition must kept together.

Why depends the language and the direction of the first heading on the user interface language and not on the page content language? I think the language and the direction of the first heading should also depend on the page content language.

I created Bug 34514 for a first heading in page content language and direction. When this Bug is fixed I don't see any situations with a edit section button outside of a mw-content-ltr/mw-content-rtl container.

I applied a patch based on the first comment in
https://gerrit.wikimedia.org/r/#change,3920

Edit section links for the opening section are done using gadgets and user scripts today, so gadgets should care about their directionality.

Oh, and thanks a lot for the patch to fomafix@googlemail.com.

The patch was reviewed and approved by Brion. It will probably be deployed on Wikimedia projects next week.