Page MenuHomePhabricator

Graphic bug on template documentation
Open, Stalled, Needs TriagePublic

Description

With Timeless, on a template page, the inclusion of the {{documentation}} shows "modifier le code" (edit code) and "purger" (clear) at the top of the inclusion in the page, for the included part itself.

These 2 texts are supposed to be inbetween [....], but they appear to be on the side of it.

example page


French : Avec l'apparence Timeless, sur une page de modèle, l'inclusion de la {{documentation}} affiche en haut de celle ci "modifier le code" et "purger".
Ces 2 textes sont supposés se trouver entre des crochets [...] mais apparaissent décalés sur le côté.
page d'exemple

Event Timeline

Cause by css rules in screen-commone.less and VisualEditor.article.less

screen-common.less
.mw-editsection {
	font-family: @fonts;
	.background-image-svg( 'images/pencil-grey.svg', 'images/pencil-grey.png' );
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-left: 20px;
	padding-top: 0.5em;
	a {
		display: inline-block;
		padding: 0.5em 0 0.25em;
		margin-right: 1em;
		&:first-of-type {
			// make the icon part of the first link
			padding-left: 20px;
			margin-left: -20px;
		}
	}
}
VisualEditor.article.less
@media screen {
	[...]
	.client-nojs,
	.ve-not-available {
		.mw-editsection a {
			// make the icon part of the link
			padding-left: 20px;
			margin-left: -20px;
		}
	}
}

specifically, the margin-left rule moves the link to the left, and the margin-right rule makes sure that the bracket doesn't move as well

Can someone verify if this is still an issue? I can't reproduce now, but if it's just been fixed locally, it could still perhaps use adjusting skin-side, depending on what it is...

Isarra changed the task status from Open to Stalled.Dec 15 2020, 7:18 PM