Theming
⚠️
The widget’s theming should primarily be managed through the backoffice using the Theme Editor. If, for any reason, theming needs to be applied programmatically, the CSS variables listed below can be used. However, if a theme is set in the backoffice, these variables will be ignored.
The colors of the widget can be changed by setting the following CSS variables:
:root {
--gw-bg1: #1d2236;
--gw-bg2: #22283e;
--gw-text-primary: #ffffff;
--gw-text-secondary: #aeb1bd;
--gw-text-button-primary: #ffffff;
--gw-text-button-secondary: #000000;
--gw-button-primary: #286bff;
--gw-button-secondary: #c3d9f2;
--gw-accent1: #15e9fd;
--gw-accent2: #2073e3;
--gw-trail: #1d253b;
--gw-prize1: #fef08a;
--gw-prize2: #f59e0b;
}