diff --git a/client/src/App/App.styles.scss b/client/src/App/App.styles.scss index 2ed11cbc6..b57e94677 100644 --- a/client/src/App/App.styles.scss +++ b/client/src/App/App.styles.scss @@ -156,3 +156,11 @@ td.ant-table-column-sort { background-color: transparent; } + +.ant-table-tbody > tr.ant-table-row:nth-child(2n) > td { + background-color: #f4f4f4; +} + +.rowWithColor > td { + background-color: var(--bgColor) !important; +} diff --git a/client/src/components/production-list-table/production-list-table.component.jsx b/client/src/components/production-list-table/production-list-table.component.jsx index 746d956ab..1585c6480 100644 --- a/client/src/components/production-list-table/production-list-table.component.jsx +++ b/client/src/components/production-list-table/production-list-table.component.jsx @@ -246,11 +246,21 @@ export function ProductionListTable({ (x) => x.status === record.status ); - if (!color) return null; + if (!color) { + if (index % 2 === 0) + return { + style: { + backgroundColor: `rgb(236, 236, 236)`, + }, + }; + + return null; + } return { + className: "rowWithColor", style: { - backgroundColor: `rgb(${color.color.r},${color.color.g},${color.color.b},${color.color.a})`, + "--bgColor": `rgb(${color.color.r},${color.color.g},${color.color.b},${color.color.a})`, }, }; },