Use separate, multiple CSS classnames to enable more versatile stylesheet customization

[robert@…]

Customizing CSS for trac reports is a bit difficult at the moment because semantically independent classnames are concatenated together in a single class.

For example, "color2-odd" reflects that a row is both at an odd index, and that it should have color2 applied to it. Thus, changing the even/odd color style requires defining at least 12 styles (6 colors X 2 even/odd values), as seen in the current report.css.

Generic Color Styling

If, instead, the classname were specified as "color_N odd", (where N indicated the cell value) then CSS rules could be specified like so:

.even {...}
.odd {...}
.color_1 {...}
.color_2 {...}
...
.color_6 {...}

Cell-Specific Styling

Furthermore, individual cells should have a class value that reflects both the cell name and cell value. For example, cells showing ticket priority should have a class of "priority priority_N" (where N is the priority value). E.g. the markup should look like this:

E.g. a cell could have class="priority priority_N", instead of just class="priority"

Backward Compatibility

Note that existing stylesheets can continue to be supported by simply including the existing stylenames as part of the 'class' attribute in the markup. To illustrate what this might look like for all of this …

<tr class="color2-odd odd color_2">
  <td class="id">...</td>
  <td class="subject">...</td>
  <td class="owner owner_is_user">...</td>
  <td class="reporter reporter_is_user">...</td>
  <td class="status status_4>...</td>
  <td class="priority priority_3">...</td>
</tr>

[Christian Boos]

Check also how it's done for the query module.