← All examples

Color-code order status

Colors order-list rows in the seller panel by status so new and cancelled orders stand out instantly.

Code to copy

[data-role="order-row"]:has([class*="status" i][title*="nowe" i]),
tr:has(td[aria-label*="nowe zamówienie" i]) {
  background: #e8f5e9 !important;
}
[data-role="order-row"]:has([class*="status" i][title*="anulowane" i]),
tr:has(td[aria-label*="anulowane" i]) {
  background: #ffebee !important;
}

How to use this example

1. Copy the code with the button above.
2. Install JustZix (2 minutes) and open the extension on the target page.
3. Add a new rule matching that page.
4. Paste the code into the rule's CSS panel and save — the effect appears instantly.