Alternating colors in tables is not preserved when sorted

NEW
Unassigned

Status

()

bugzilla.mozilla.org
General
4 years ago
4 years ago

People

(Reporter: basta, Unassigned)

Tracking

Production
x86_64
Windows 7

Details

(Reporter)

Description

4 years ago
Tables have alternating colors for rows. However, when the tables are sorted (by clicking the column headers), the row colors stay associated with the original row rather than the position in the list.

I.e.: before sorting, the rows are ordered light, dark, light, dark, etc. After sorting, the rows have a random light/dark order.

The easy fix is to simply re-assign row colors after sorting a column. The proper fix is to use nth-child(even) and nth-child(odd) to stripe the rows in the CSS.
ahhh, sorttable.js
Component: Sandstone/Mozilla Skin → General
(Reporter)

Comment 2

4 years ago
A quick look at the CSS shows that you can replace the selectors for .bz_row_odd and .bz_row_even with the following:

.bz_bugitem:nth-child(even)
.bz_bugitem:nth-child(odd)

Note that if you do this, the specificity on some of the other styles (like .bz_enhancement) will need to be adjusted (i.e.: to .bz_bugitem.bz_enhancement). A quick test in Chrome's live edit shows that this should work great.
You need to log in before you can comment on or make changes to this bug.