Use margin-inline mixin to simplify direction specific styles

Bug: T371265
Change-Id: Iffc9c8ad36ae53b36c9135c206d1c1e02d67b6e2
This commit is contained in:
Ebrahim Byagowi 2024-10-06 09:56:15 +03:30
parent 3684f26994
commit 6f8049b2ed

View file

@ -26,20 +26,11 @@
@import 'mediawiki.mixins.less'; @import 'mediawiki.mixins.less';
@import 'mediawiki.skin.variables.less'; @import 'mediawiki.skin.variables.less';
/* On the list of subcategories hide the normal list bullet */
.client-js #mw-subcategories ul { .client-js #mw-subcategories ul {
/* On the list of subcategories hide the normal list bullet */
list-style: none; list-style: none;
} /* and reduce the margin on the margin start side. */
.margin-inline( 0.25em, 0 );
/* and reduce the margin on the margin start side. */
/* @noflip */
.client-js #mw-subcategories .mw-content-ltr ul {
margin-left: 0.25em;
}
/* @noflip */
.client-js #mw-subcategories .mw-content-rtl ul {
margin-right: 0.25em;
} }
#mw-panel .portal .body .CategoryTreeTag { #mw-panel .portal .body .CategoryTreeTag {
@ -52,31 +43,9 @@
padding: 0.25em 0; padding: 0.25em 0;
} }
/* /* Indent the children on each level on margin start side. */
* Indent the children on each level on margin start side.
* A category tree in the sidebar is in user interface language therefor
* a flipped margin-left is the margin start side.
*/
.CategoryTreeChildren { .CategoryTreeChildren {
margin-left: 1.25em; .margin-inline( 1.25em, 0 );
}
/*
* Category trees in the content are in content language and therefor
* an unflipped margin-left or margin-right is the margin start side.
* Use margin: 0 0 0 1.25em instead of margin-left: 1.25em here to
* overwrite the flipped margin-left from above.
*/
/* @noflip */
.mw-content-ltr .CategoryTreeChildren,
.mw-content-rtl .mw-content-ltr .CategoryTreeChildren {
margin: 0 0 0 1.25em;
}
/* @noflip */
.mw-content-rtl .CategoryTreeChildren,
.mw-content-ltr .mw-content-rtl .CategoryTreeChildren {
margin: 0 1.25em 0 0;
} }
.CategoryTreeBullet, .CategoryTreeBullet,