Stop botpress using default css
# 🤝helps
salmon-midnight-96260
07/24/2023, 4:13 AMHey, I've setup a configurable bot on my site connected to a spreadsheet hosted on my server. If I don't put !important next to tags though, the code is overwritten by botpress default css. Is there a way to disable botpress-default.css
salmon-midnight-96260
07/24/2023, 12:38 PMb
a
acceptable-kangaroo-64719
07/24/2023, 12:42 PMare you passing the CSS file as a
customStylesheets
salmon-midnight-96260
07/27/2023, 6:09 AMno just a "stylesheet":
salmon-midnight-96260
07/27/2023, 6:10 AMadded customStylesheet into the init and still being overwritten by botpress-default.css
a
acceptable-kangaroo-64719
07/27/2023, 10:33 AMyou're right, it is jsut "stylesheet" https://botpress.com/docs/cloud/webchat-customization/overview/#configuring-the-web-chat
acceptable-kangaroo-64719
07/27/2023, 10:33 AMcan you share the init() code that you're using on your website?
s
salmon-midnight-96260
07/27/2023, 10:55 PM
window.botpressWebChat.init({
"composerPlaceholder": "Chat with WomBot",
"botId": "cf667a02-130c-4abc-8720-50ad042b1d8b",
"hostUrl": "https://cdn.botpress.cloud/webchat/v0",
"messagingUrl": "https://messaging.botpress.cloud",
"clientId": "cf667a02-130c-4abc-8720-50ad042b1d8b",
"botName": "WomBot",
"avatarUrl": "https://uploads-ssl.webflow.com/6494eeb6582cc5cfa3ded133/6494f20dc495522f94af042e_Screen%20Shot%202023-06-19%20at%2012.36.53%20pm%20(1).png",
"stylesheet": "https://assets.digitalnative.com.au/wombot/css/WOMBOTStylesheet.css",
"useSessionStorage": true,
"enableConversationDeletion": true
});
salmon-midnight-96260
07/27/2023, 10:56 PMif i dont use !important on some elements it will revert back to botpress-default.css or occasionally inject.css?
salmon-midnight-96260
07/27/2023, 11:02 PMThere are many elements that work fine however others not so much. for examples i would attempt to set responsive heights for bpw-layout however without an !important the height will be overtaken by botpress-default and with !important i cant make it responsive so let me know! thank u
a
acceptable-kangaroo-64719
07/28/2023, 10:49 AM@bright-magazine-792 do you have any tips?
s
salmon-midnight-96260
07/30/2023, 3:34 AM@bright-magazine-792 please let me know if you do as it would be greatly appreciated
salmon-midnight-96260
08/01/2023, 1:31 AMI've learnt that using min-width causes all the css in the {} to be ignored while max-width does work. Wierdly though, if I set a max-width:767px for mobile, the page is still using the max-width:767px figures for desktop sizes