[TW5] Table (created by $list): Highlight every second row

[The Bo]

Hey,

is it possible to highlight every second row of a table which is created by a list filter?


The table is structured like this:

<table>
<tr>
<th>Topic 1</th>
<th>Topic 2</th>
</tr>

<$list filter="...">
<tr>
<td><$link to=<<currentTiddler>>>{{!!title}}</$link></td>
<td><$view field="created"></td>
</tr>
</$list>
</table>

Regards,
The Bo

[Jed Carty]

You use css the same way as you would in html.

More specifically, make a tiddler with whatever name you want and put this css in it:

.alternating-rows tr:nth-child(even) {background-color:white}
.alternating-rows tr:nth-child(odd) {background-color:lightgrey}

give the tiddler the tag $:/tags/Stylesheet and save the tiddler

then using what you have in your post just change the first line to

<table class=alternating-rows>

and it should give the table alternating background colors. You can change the background color or add whatever css properties to the even and odd rows independently by editing the css.

[The Bo]

Hey Jed,

this is perfect. Thanks!