Web Chat - Minimize and Close buttons hidden

Having an issue not being able to see the Minimize and Close chat buttons in the upper right hand corner of the chat box. The functionality is there, the buttons do work, but can't view them. Tried playing around with the 'overflow', 'z-index', 'color', 'fill', etc of different css attributes, to no avail. Occurs with both light and dark theme. Any ideas?

widgets.config.js:

window._genesys = {
"widgets": {
'main': {
'theme': 'light',
'i18n': {
"en": {
"webchat": {
"ChatTitle": "Google Fiber Webpass Chat",
}
}
}
},
"webchat": {
"transport": {
"type": "purecloud-v2-sockets",
"dataURL": "https://api.usw2.pure.cloud",
"deploymentKey": "xxx",
"orgGuid": "xxx",
"interactionData": {
"routing": {
"targetType": "QUEUE",
"targetAddress": "Test Queue",
"priority": 2
}
},
},
"emojis": true,
}
},
};

Hello Stephanie,

It could be coming from an HTML meta header (viewport) or some conflicts with some css you defined for your page.
Or if you have overridden some widgets css/style that is not allowed/supported (ex: width, height).

See the warning note on this page:
In particular, you must avoid setting the following CSS properties: height, width, thickness, size, and visibility; or any other properties that change the structure of widgets. These properties are not supported. Changing them can break widget stability and usability.

If your page is available on a public url, or if you want to upload it here (html, css, js), I can take a look at it and check if I see something.

Regards,

This topic was automatically closed 31 days after the last reply. New replies are no longer allowed.