Status badge

Uppercase stock caption coloured by availability.

Catalog

Pack defaults

With content

In context

Source

import { StatusBadge } from "demo-webshop/components";

const props = {
  "availability": "in-stock",
  "label": "In stock"
};
<StatusBadge {...props} />

Live CSS

Injected into the previews above. Status badge

/* Live CSS — edits inject into every preview above.
   Try overriding a component utility, e.g.:
   .btn { letter-spacing: 0.04em; } */