зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1239673 - memorytable: set tree-node-odd from JS. r=vporof
Only visible table rows are rendered, therefore we cannot rely on :nth-child(2) to create background stripes. This commit adds the source index to the treeNode props. Using this index, the treeNode can add a "tree-node-odd" className to its element. In css, tree-node-odd is then used to add the alternate background color to a row, --HG-- extra : rebase_source : 9ce30781c0e7a2197486a7e0271283f87fc8dff5
This commit is contained in:
Родитель
2bfbabd666
Коммит
7bff6c515d
|
@ -64,9 +64,10 @@ const TreeNode = createFactory(createClass({
|
|||
onCollapse: this.props.onCollapse
|
||||
});
|
||||
|
||||
let isOddRow = this.props.index % 2;
|
||||
return dom.div(
|
||||
{
|
||||
className: "tree-node div",
|
||||
className: `tree-node div ${isOddRow ? "tree-node-odd" : ""}`,
|
||||
onFocus: this.props.onFocus,
|
||||
onClick: this.props.onFocus,
|
||||
onBlur: this.props.onBlur,
|
||||
|
@ -251,6 +252,7 @@ const Tree = module.exports = createClass({
|
|||
let { item, depth } = toRender[i];
|
||||
nodes.push(TreeNode({
|
||||
key: this.props.getKey(item),
|
||||
index: begin + i,
|
||||
item: item,
|
||||
depth: depth,
|
||||
renderItem: this.props.renderItem,
|
||||
|
|
|
@ -332,7 +332,7 @@ html, body, #app, #memory-tool {
|
|||
display: flex;
|
||||
}
|
||||
|
||||
.tree-node:nth-child(2n) {
|
||||
.tree-node-odd {
|
||||
background-color: var(--row-alt-background-color);
|
||||
}
|
||||
|
||||
|
|
Загрузка…
Ссылка в новой задаче