Page MenuHomePhabricator

[RTL, TOC] The arrow before collapsible sections in sidebar is clipped
Open, HighPublic2 Estimated Story PointsBUG REPORT

Description

Steps to replicate:

  • see this Arabic article with vector 2022 skin.
  • go to the table of content on the right hand and find the level 2 heading named "وصف اللوح المحفوظ" and check the arrow before the section title.
  • now see this Persian article with the same skin.
  • again, go to the table of content and find level 2 heading named "بررسی اجمالی" and see the arrow before the title.
  • inspect .sidebar-toc class for both pages and check the padding values (right and left paddings are swapped for Persian Wikipedia using Common.css as explained below).

description and proposed solution:
As you can see, in the arwiki, which uses rtl configuration, the arrow before the collapsible section titles (level 2 headings which have level 3 subsections) is incorrectly shown. this issue is present in all rtl wikis such as hewiki (example).
The value entered for right and left padding in .sidebar-toc class is the same in all rtl and ltr wikis, while the right and left padding values should be swapped when the direction is different.
We earlier addressed the issue in fawiki (reported here) and implemented a temporary solution at w:fa:MediaWiki:Common.css#L-11:

.sidebar-toc {
	padding: 20px calc(15px + 0.75em) 20px 12px;
}

The value for right padding in rtl wikis should be calculated using calc(15px + 0.75em). in ltr wikis, this value is considered for left padding (for example, inspect .sidebar-toc class in this English article).

Developer notes

CSSJanus doesn't seem to flip calc values, so we should either:

  1. not use calc
  2. Per reporter suggestion add a rule .rtl .sidebar-toc { 20px 12px 20px calc(15px + 0.75em); }

Event Timeline

Jdlrobson renamed this task from The arrow before collapsible sections in sidebar TOC is shown in half to [RTL, TOC] The arrow before collapsible sections in sidebar is not clipped.Tue, Aug 16, 7:25 AM
Jdlrobson updated the task description. (Show Details)
Jdlrobson renamed this task from [RTL, TOC] The arrow before collapsible sections in sidebar is not clipped to [RTL, TOC] The arrow before collapsible sections in sidebar is clipped.Tue, Aug 16, 5:24 PM

Also worth trying is removing the shorthand for padding and using padding-left and padding-right separately. CSS-Janus might just flip the property names in that case and not worry about the values.

ovasileva raised the priority of this task from Medium to High.Thu, Aug 18, 5:13 PM