Custom Styles
(Optional) A string defining custom css that will be applied to the hosted experience frame. For example, this may be used to change the color of a button within the hosted experience frame.
Styling elements within the UneeQ frame can be risky, as our application does change from time to time. Custom styling should be used as a last resort when changing the user interface. Instead you should opt to hide elements via configuration options and create your own interface. For example, you should use displayCallToAction: false and create your own call to action.
You should never use customStyles for mission critical UI.
To mitigate risks, we provide prefixed classes custom-style- that are unlikely to change:
Class name | Description |
|---|---|
custom-style-state-initial | The call to action callout, i.e. "👋 Hey! It is so good to meet you."  |
custom-style-state-error | The error callout, i.e. "An error occurred." |
custom-style-queue-position | The queue position callout, i.e. "You are 1st in line to speak to me."  |
To hide the queue position callout: