Customizations

Customization Attributes

All of these attributes are optional. Use them to change the Buyback Badge style.

`custom-styles`

This attribute can be used to customize the look of the Croissant Buyback Badge. You can customize select CSS properties via a JSON object. For an overview of the properties and types available, see below:

type OptInContainerStyles = {
  primaryColor?: string; // This will replace the default Croissant blue
  secondaryColor?: string; // This will replace the default grey background
  defaultFontFamily?: string; // This font family will be applied on the entire container
  defaultFontSize?: number; // Default is 12 - will be applied in px
};

Example (with default styling):

<croissant-opt-in-container custom-styles= "{
    primaryColor: 'blue',
    secondaryColor: '#d9d9d9',
    defaultFontFamily: 'var(--croissant-font-family--main)',
    defaultFontSize: 12,
}"></croissant-opt-in-container>