Page MenuHomePhabricator
Create Task
Maniphest T364514

Table: align numbers to the right in both reading directionalities
Closed, ResolvedPublic1 Estimated Story Points
Actions

Description

The Table component allows users to set the text alignment for a column (or individual cell) to end, which is recommended for numbers. However, numbers should actually be aligned to the right in both reading directions.

Acceptance criteria

  • A new option for the textAlign property of the TableColumn type, 'right', is added
  • The Table component is updated to use this class to set text-align: right, a style which should not be flipped for RTL
  • The Table demo page should be updated to explain this new option and the difference between 'end' and 'right'
  • The demos on the Table demo page and sandbox page should be updated to use 'right' alignment for numbers

Details

SubjectRepoBranchLines +/-
Update Codex from 1.5.0 to 1.6.0mediawiki/coremaster+2 K -1 K
Table: Clean up alignment classesdesign/codexmain+164 -157
Table: Add `textAlign` option for numbersdesign/codexmain+100 -27
Customize query in gerrit

Related Objects
Search...

Event Timeline

AnneT created this task.Wed, May 8, 9:00 PM
Restricted Application added a project: Design-System-Team. · View Herald TranscriptWed, May 8, 9:00 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript
AnneT moved this task from Inbox to DST-Sprint-22 (2024-04-29 to 2024-05-10) on the Design-System-Team board.Wed, May 8, 9:00 PM
AnneT edited projects, added Design-System-Team (DST-Sprint-22 (2024-04-29 to 2024-05-10)); removed Design-System-Team.
AnneT moved this task from Committed to Blocked ⛔ on the Design-System-Team (DST-Sprint-22 (2024-04-29 to 2024-05-10)) board.
gerritbot added a comment.Wed, May 8, 9:01 PM

Change #1029216 had a related patch set uploaded (by Anne Tomasevich; author: Anne Tomasevich):

[design/codex@main] Table: Add textAlign option for numbers

https://gerrit.wikimedia.org/r/1029216

gerritbot added a project: Patch-For-Review.Wed, May 8, 9:01 PM
AnneT set the point value for this task to 1.EditedWed, May 8, 9:03 PM

The new cdx-table__cell--align-right class's styles don't actually work yet for these reasons:

  • Since the text-align: right style is not flipped, it does not get a [dir] selector added to it, therefore the selector with text-align: left is more specific and outweighs it. This only matters on the docs site and sandbox, but...the demos need to work.
  • Even if you add specificity to the --right class, it doesn't work for the th elements in the thead because of some flex styles there

I'd like to wait until this patch is complete before resolving the second item, because any changes I make to these th elements will clash with Lauralyn's code changes.

CCiufo-WMF moved this task from Blocked ⛔ to Committed on the Design-System-Team (DST-Sprint-22 (2024-04-29 to 2024-05-10)) board.Mon, May 13, 5:04 PM
Volker_E removed a project: Patch-For-Review.Mon, May 13, 6:45 PM
Volker_E updated the task description. (Show Details)
Volker_E moved this task from Committed to Pending Release on the Design-System-Team (DST-Sprint-22 (2024-04-29 to 2024-05-10)) board.
AnneT moved this task from Pending Release to Code Review on the Design-System-Team (DST-Sprint-22 (2024-04-29 to 2024-05-10)) board.Mon, May 13, 6:51 PM
gerritbot added a comment.Mon, May 13, 8:14 PM

Change #1029216 merged by jenkins-bot:

[design/codex@main] Table: Add `textAlign` option for numbers

https://gerrit.wikimedia.org/r/1029216

AnneT moved this task from Code Review to Pending Release on the Design-System-Team (DST-Sprint-22 (2024-04-29 to 2024-05-10)) board.Mon, May 13, 8:29 PM
gerritbot added a comment.Tue, May 14, 2:34 PM

Change #1031487 had a related patch set uploaded (by Anne Tomasevich; author: Anne Tomasevich):

[design/codex@main] Table: Clean up alignment classes

https://gerrit.wikimedia.org/r/1031487

gerritbot added a project: Patch-For-Review.Tue, May 14, 2:34 PM
gerritbot added a comment.Tue, May 14, 2:57 PM

Change #1031487 merged by jenkins-bot:

[design/codex@main] Table: Clean up alignment classes

https://gerrit.wikimedia.org/r/1031487

Maintenance_bot removed a project: Patch-For-Review.Tue, May 14, 3:31 PM
gerritbot added a comment.Thu, May 16, 12:47 AM

Change #1032095 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/core@master] Update Codex from 1.5.0 to 1.6.0

https://gerrit.wikimedia.org/r/1032095

gerritbot added a project: Patch-For-Review.Thu, May 16, 12:47 AM
gerritbot added a comment.Thu, May 16, 1:58 AM

Change #1032095 merged by jenkins-bot:

[mediawiki/core@master] Update Codex from 1.5.0 to 1.6.0

https://gerrit.wikimedia.org/r/1032095

Volker_E renamed this task from Table: align numbers to the right in both reading directions to Table: align numbers to the right in both reading directionalities.Thu, May 16, 2:06 AM
Volker_E closed this task as Resolved.
Volker_E removed a project: Patch-For-Review.
Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL