You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Making datatable sortable alters the behavior of the column headers such that the headers are always begin/left aligned, and the sorting icon appears to the right of the column header text. In the absence of sorting, the column headers respect the alignment for the column.
Consistent with UX best practices for tables, we would like for the column header to always respect the column's alignment, and adjust the positioning of the sort icon based on the alignment so that it doesn't interfere with the alignment. For example, with end alignment the sort icon should be to the left of the column header.
There has been some previous discussion on this topic here #5965
Expected Behavior
Column headers should respect the column's alignment. Here's an example of a numeric column with end alignment. when sorting is disabled.
When this becomes sortable, I'm expecting for the alignment to remain the same, but for these end aligned column headers for the sort icon to now be to the left of the column header instead of always on the right.
Making datatable sortable alters the behavior of the column headers such that the headers are always begin/left aligned, and the sorting icon appears to the right of the column header text. In the absence of sorting, the column headers respect the alignment for the column.
Consistent with UX best practices for tables, we would like for the column header to always respect the column's alignment, and adjust the positioning of the sort icon based on the alignment so that it doesn't interfere with the alignment. For example, with end alignment the sort icon should be to the left of the column header.
There has been some previous discussion on this topic here #5965
Expected Behavior
Column headers should respect the column's alignment. Here's an example of a numeric column with end alignment. when sorting is disabled.
When this becomes sortable, I'm expecting for the alignment to remain the same, but for these end aligned column headers for the sort icon to now be to the left of the column header instead of always on the right.
@gregfuruiye shared these two resources showing expected behavior and discussing the issue:
https://finviz.com/screener.ashx
https://www.pencilandpaper.io/articles/ux-pattern-analysis-enterprise-data-tables#sorting-filtering-and-searching
Summarizing- "The sort chevron shouldn’t interfere with the alignment of the heading relative to the column’s content."
Actual Behavior
Sortable table example with the column header now left aligned
URL, screen shot, or Codepen exhibiting the issue
Here's an example of a table that "looks bad" because of a mix of alignments and sorting enabled
Steps to Reproduce
Your Environment
The text was updated successfully, but these errors were encountered: